怎么解析table中的input元素?
- HTML code
<!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].childNodes[0].nodeValue); } } </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="text" value="aaaaaaa"/></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>还有这种方法:
- JScript code
var rows=document.getElementById('tb').rows; for(var i=0;i<rows.length;i++) { var cells=rows[i].cells; for(var j=0;j<cells.length;j++) { alert(cells[j].innerText); } }第一种方法不可以在google中运行,只能在IE中运行,但是每个中方法得到的是:
<input id="testId" name="test" value="">
这种形式
谁知道应该怎么来遍历,找了好久也没有找到。。。
[解决办法]
- HTML code
<!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").getElementsByTagName('input'); for(var i = 0, len = t.length; i < len; i++ ){ alert( t[i].type ) } } </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="text" value="aaaaaaa"/></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>
[解决办法]
- JScript code
function f() { var obj = document.getElementById('tb').getElementsByTagName('input'); //获取id值为tb的元素中的所有input子元素 for (var i = 0; i < obj.length; i ++) alert(obj[i].value);}
[解决办法]
第二段代码中,innerText属性是IE私有的,应该使用标准属性innerHTML代替。
[解决办法]
再补充一下,楼主你写的代码无法达到你预期目的的原因在于各浏览器对childNodes、firstChild属性的实现是不同的,比如下面这个简单例子,在所有的标准浏览器下都弹出3,也就是div元素下存在3个子节点。但在IE6/7/8中弹出的是1,因为div内的p标签前后都有换行,标准浏览器会将换行、空白字符等作为文本节点来对待,而IE6/7/8会忽略掉这些字符。
- HTML code
<div id="demo"> <p>demo</p></div><script type="text/javascript">var demo = document.getElementById('demo');alert(demo.childNodes.length);</script>
[解决办法]
- JScript code
$("#tb").find(":input").each(function(){ alert($(this).val());});
[解决办法]
document.getElementById("tb").getElementsByTagName('input');
childNodes 有兼容问题
[解决办法]
haoke yi bu ah a
[解决办法]
javascript写法
- JScript code
document.getElementById("tb").getElementsByTagName('input');//先根据ID取到表,再根据tag取到input
[解决办法]
楼主 你看 1楼 贴的了吗?