Javascript遍历Html Table示例(包括内容和属性值)

1: 遍历并输出Table中值

<table id="tb">
<tr>
<td></td>
</tr>
<tr>
<td></td>
</tr>
</table>
function f()
{
var t=document.getElementById("tb").childNodes.item(0);
for(var i=0;i< t.childNodes.length;i++)
{
for(var j=0;j<t.childNodes(i).childNodes.length;j++)
{
alert(t.childNodes(i).childNodes(j).innerText);
}
}
}

2: 遍历Table，读取CheckBox状态和其他Column值

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Untitled Page</title> </head> <body onload="f()">
<script type="text/javascript">
function f()
{
var t=document.getElementById("tb").childNodes.item(0);

for(var i=0;i< t.childNodes.length;i++)
{
alert(t.childNodes(i).firstChild.firstChild.nodeValue);
alert(t.childNodes(i).childNodes[1].firstChild.checked);
}
}

</script>

<table id="tb">
<tr>
<td style="width: 122px">
1234</td>
<td style="width: 89px">
<input type="checkbox" /></td>
<td style="width: 210px">
</td>
</tr>
<tr>
<td style="width: 122px; height: 21px">
2234</td>
<td style="width: 89px; height: 21px">
<input type="checkbox" checked="CHECKED" /></td>
<td style="width: 210px; height: 21px">
</td>
</tr>
<tr>
<td style="width: 122px">
3234</td>
<td style="width: 89px">
<input type="checkbox" /></td>
<td style="width: 210px">
</td>
</tr>
</table>
</body>
</html>
赞 (0)

相关推荐

  • JS使用for循环遍历Table的所有单元格内容

    JS遍历Table的所有单元格内容思路是遍历Table的所有Row,遍历Row中的每一列,获取Table中单元格的内容 function GetInfoFromTable(tableid) { var tableInfo = ""; var tableObj = document.getElementById(tableid); for (var i = 0; i < tableObj.rows.length; i++) { //遍历Table的所有Row for (var j

  • Javascript遍历table中的元素示例代码

    例如: <table id=tb> <tr><th> </th><th> </th><th> </th><th> </th></tr> <tr><td> </td><td> </td><td> </td><td> </td></tr> <tr>&

  • 用js遍历 table的脚本

    var tableObj = document.getElementById("tableName"); var str = ""; for(var i=0;i<tableObj.rows.length;i++) {    for(varj=0;j<tableObj.rows[i].cells.length;j++)    {       //str += tableObj.rows[i].cells[j].innerHTML+"   &quo

  • JavaScript遍历table表格中的某行某列并打印其值

    JavaScript遍历table表格中的某行某列并打印其值

    JavaScript遍历table 1.说明 遍历表格中的某行某列,并打印其值 2.实现源码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml">

  • JS与jQuery遍历Table所有单元格内容的方法

    本文实例讲述了JS与jQuery遍历Table所有单元格内容的方法.分享给大家供大家参考,具体如下: 用JS去遍历Table的所有单元格中的内容,可以用如下JS代码实现: function GetInfoFromTable(tableid) { var tableInfo = ""; var tableObj = document.getElementById(tableid); for (var i = 0; i < tableObj.rows.length; i++) { /

  • js实现遍历含有input的table实例

    本文实例讲述了js实现遍历含有input的table.分享给大家供大家参考,具体如下: table 如下: <table id="groupTable" class="tblist_black"> <% DataTable firstGroupTable = ViewState["firstGroupTable"] as DataTable; if (firstGroupTable != null) { for (int i =

  • Javascript遍历Html Table示例(包括内容和属性值)

    1: 遍历并输出Table中值 <table id="tb"> <tr> <td></td> </tr> <tr> <td></td> </tr> </table> function f() { var t=document.getElementById("tb").childNodes.item(0); for(var i=0;i< t.c

  • 浅谈vue的iview列表table render函数设置DOM属性值的方法

    如下所示: { title: '负责人社保照片', key: 'leaderIdNumber', render: (h, params) => { return h('img',{domProps:{ src:params.row.leaderIdNumber }}) } }, 找了好多,终于找到了原因,如果想要让列表返回的是一个img标签,并且设置img的src,这里不能用props,而是要用domProps就ok了. 以上这篇浅谈vue的iview列表table render函数设置DOM属

  • c++遍历lua table示例

    c/c++从栈上获取Lua压栈过来的table数据 复制代码 代码如下: map<string,string> traverse_table(lua_State *L, int index){ map<string,string> data;    lua_pushnil(L);     // 现在的栈:-1 => nil; index => table index = index - 1;    while (lua_next(L, index))    {     

  • JavaScript获取table中某一列的值的方法

    JavaScript获取table中某一列的值的方法

    1.实现源码 复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-eq

  • JavaScript使用正则表达式获取全部分组内容的方法示例

    JavaScript使用正则表达式获取全部分组内容的方法示例

    本文实例讲述了JavaScript使用正则表达式获取全部分组内容的方法.分享给大家供大家参考,具体如下: 1. 需要使用正则表达式的exec 2. 需要循环 DEMO示例:(如下代码将输出 8 , 9,两个匹配到的分组内容) <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>JS正则demo</title>

  • JavaScript实现多叉树的递归遍历和非递归遍历算法操作示例

    本文实例讲述了JavaScript实现多叉树的递归遍历和非递归遍历算法操作.分享给大家供大家参考,具体如下: 演示之前的准备工作 演示项目的文件结构: index.html jsonData.js recurrenceTree.js noRecurrenceTree.js 解释一下各个文件: index.html 是用来演示的 HTML 文件. jsonData.js 里面存储着多叉树的JSON数据. recurrenceTree.js 递归算法遍历树. noRecurrenceTree.js

  • JavaScript遍历DOM元素的常见方式示例

    JavaScript遍历DOM元素的常见方式示例

    本文实例讲述了JavaScript遍历DOM元素的常见方式.分享给大家供大家参考,具体如下: 对于元素之间的空格,IE9以及之前的版本不会返回文本节点,,其他的浏览器会返回文本节点,所以我们在使用firstChild,lastChild时会导致行为不一致. DOM中为元素新增了下面几个属性: childElementCount:返回子元素(不包括文本节点和注释)的数量: firstElementChild:firstChild的元素版: lastElementChild:lastChild的元素

  • JavaScript遍历查找数组中最大值与最小值的方法示例

    JavaScript遍历查找数组中最大值与最小值的方法示例

    本文实例讲述了JavaScript遍历查找数组中最大值与最小值的方法.分享给大家供大家参考,具体如下: <script language="javascript"> // 查找数组中最小值 function mathMin(arrs){ var min = arrs[0]; for(var i = 1, ilen = arrs.length; i < ilen; i+=1) { if(arrs[i] < min) { min = arrs[i]; } } ret

  • JavaScript遍历数组和对象的元素简单操作示例

    JavaScript遍历数组和对象的元素简单操作示例

    本文实例讲述了JavaScript遍历数组和对象的元素.分享给大家供大家参考,具体如下: 博主最近一直在学习JavaScript,今天给大家分享如何遍历JavaScript中的数组和对象的元素,这篇文章相当于做一篇小的笔记,希望能帮助到大家! 遍历数组 <script> var arr = ['关羽','张飞','赵云','马超','黄忠'];//定义数组 //遍历数组 for(var i = 0;i<arr.length;i++){ console.log(arr[i]); } <

随机推荐