如何使用Jquery在DIV标记内创建表
How to create a table inside a DIV tag using Jquery?
我已经使用创建了一个数据表
<script>
var table = '<table border="0" id="tblTestCases">';
table+="<tr bgcolor='#e6e6e6'><td colspan='3'>Number of text boxes = " + $searchObject.find('[type=text]').length + "</td></tr>";
$searchObject.find('[type=text]').each(function () {
table+="<tr bgcolor='#ccccff'><td>Name of textbox = " + $(this).attr("name") + "</td><td> ID =" + $(this).attr("id") + "</td><td> Test cases : <br /> 1) Check if cursor is displayed/blinking after mouse click <br /> 2)Check if a text can be entered inside</td></tr>";
});
table+="<tr bgcolor='#e6e6e6'><td colspan='3'>Number of Submit Buttons = " + $searchObject.find('[type=submit]').length + "</td></tr>";
$searchObject.find('[type=submit]').each(function () {
table+="<tr bgcolor='#6666ff'><td>Name of Submit button = " + $(this).attr("name") + "</td><td> ID =" + $(this).attr("id") + "</td><td> Test cases : <br /> 1) Check if the button is clickable or not <br /> 2) Check if the submission result is displayed after mouse click";
});
</script>
我想把表格放在DIV标签里。但是脚本是在主体内创建表,而不是在我想要的位置。有什么方法可以把同一个表放在DIV内吗?
提前谢谢。PS。表里面有很多条目。我只添加了2个用于演示。
使用以下代码片段作为html:中的容器
<div id="container"></div>
并像一样更新脚本
<script>
var table = '<table border="0" id="tblTestCases">';
table+="<tr bgcolor='#e6e6e6'><td colspan='3'>Number of text boxes = " + $searchObject.find('[type=text]').length + "</td></tr>";
$searchObject.find('[type=text]').each(function () {
table+="<tr bgcolor='#ccccff'><td>Name of textbox = " + $(this).attr("name") + "</td><td> ID =" + $(this).attr("id") + "</td><td> Test cases : <br /> 1) Check if cursor is displayed/blinking after mouse click <br /> 2)Check if a text can be entered inside</td></tr>";
});
table+="<tr bgcolor='#e6e6e6'><td colspan='3'>Number of Submit Buttons = " + $searchObject.find('[type=submit]').length + "</td></tr>";
$searchObject.find('[type=submit]').each(function () {
table+="<tr bgcolor='#6666ff'><td>Name of Submit button = " + $(this).attr("name") + "</td><td> ID =" + $(this).attr("id") + "</td><td> Test cases : <br /> 1) Check if the button is clickable or not <br /> 2) Check if the submission result is displayed after mouse click";
});
$("#container").html(table);
</script>
<script>
var table = '<table border="0" id="tblTestCases">';
table+="<tr bgcolor='#e6e6e6'><td colspan='3'>Number of text boxes = " + $searchObject.find('[type=text]').length + "</td></tr>";
$searchObject.find('[type=text]').each(function () {
table+="<tr bgcolor='#ccccff'><td>Name of textbox = " + $(this).attr("name") + "</td><td> ID =" + $(this).attr("id") + "</td><td> Test cases : <br /> 1) Check if cursor is displayed/blinking after mouse click <br /> 2)Check if a text can be entered inside</td></tr>";
});
table+="<tr bgcolor='#e6e6e6'><td colspan='3'>Number of Submit Buttons = " + $searchObject.find('[type=submit]').length + "</td></tr>";
$searchObject.find('[type=submit]').each(function () {
table+="<tr bgcolor='#6666ff'><td>Name of Submit button = " + $(this).attr("name") + "</td><td> ID =" + $(this).attr("id") + "</td><td> Test cases : <br /> 1) Check if the button is clickable or not <br /> 2) Check if the submission result is displayed after mouse click";
});
</script>
现在你有了这个HTML,只需要把它放在div
中,例如,这就是HTML:
<div id="testing"></div>
现在做:
$("#testing").html(table);
相关文章:
- 从Div创建图像,并使用Javascript和ASP.net将其保存到服务器
- 用Div内容创建obj
- 如何使用Jquery在DIV标记内创建表
- HowTo:使用 DOM 创建 DIV,无需 jQuery
- D3 在具有多个值的 enter() 数据上没有创建 DIV
- 在执行AJAX调用时,没有从PHP创建DIV
- 动态创建DIV,并不是动态地获取高度和宽度
- 动态创建Div's、 外部Div的孩子,在Chrome中的位置错误,但在IE中是正确的
- 单击创建 DIV;然后通过单击它删除相同的 DIV
- 在每次迭代中使用Jquery更改新创建DIv的样式
- 动态创建Div,在其他Div之上
- jQuery用动态ID和定义的CSS属性创建DIV(定义该DIV的外观和位置)
- 创建Div "catch"滚动时的页面顶部
- For循环没有创建Div
- 创建Div并在另一个Div中追加
- 如何从json创建Div和它的内容
- 我正在尝试在JQuery滑块中创建DIV动画
- 解析XML和创建DIV's JQuery
- 在调试中查找,试图创建DIV时出现未定义错误
- 遍历 JSON 并创建 DIV 标记