在一个例子中我有这个结构(小例子):
<table id=example>
<tr class="blah test example"><td>Test1</td><td><a href="url">LINK</a>Test11</td></tr>
<tr class="blah test example"><td>Test2</td><td><a href="url">LINK</a>Test22</td></tr>
<tr class="blah test example"><td>Test3</td><td><a href="url">LINK</a>Test33</td></tr>
</table>
Run Code Online (Sandbox Code Playgroud)
在jQuery中我会动态创建它:
var test = "<table id=" + someIDVar + ">"
+ "<tr class=" + classOneVar
+ classTwoVar + classThreeVar + ">"....
Run Code Online (Sandbox Code Playgroud)
等等...(很多其他的东西要写).之后我会追加它:
$(".somePlaceInHtml").append(test);
Run Code Online (Sandbox Code Playgroud)
那么有没有其他方法用jQuery动态编写这样的结构?这对我来说是个问题,因为我的结构很大,不像我在示例中所示的那么小.主要原因是我想为自己和维护此代码的其他开发人员提供更好的可读性.
我有一张表如下:
<table>
<tr>
<td>col 1</td><td>col2</td>
</tr>
<tr id="insert">
<td>field</td><td>Field 2</td>
</tr>
<tr>
<td>another field</td><td>one more field</td>
</tr>
</table>
Run Code Online (Sandbox Code Playgroud)
现在问题是我需要在中间行(id = insert)之后动态插入新行.我有一个自定义的javascript函数,通过对下一个元素使用insertBefore函数来插入elementsAFTER元素.
使用以下javascript成功创建新行:
var new_row = document.createElement('tr');
new_row.innerHTML="<td>test</td>";
insertAfter(document.getElementById("insert"), new_row);
Run Code Online (Sandbox Code Playgroud)
但是,新行拒绝使用innerHTML接受任何简单的html格式.新行的最终输出类似于:
<tr>test</tr>
Run Code Online (Sandbox Code Playgroud)
你看它不想输出我指定的.实际的脚本要复杂得多,不幸的是,使用appendChild或类似功能手动添加每个脚本会耗费太多时间,而且可能相当耗费资源.无论如何我可以在这个表行中添加一个"hunk"块并在这个chunk中定义表列吗?
我很困惑,任何帮助都非常感激.