在 Javascript 中访问表格单元格的内容
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/6013009/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Accessing the contents of a table cell in Javascript
提问by Puppy
I've got a checkbox nested inside a table cell element in HTML. How can I access the inner checkbox from Javascript? All of the examples I've seen alter the inner HTML itself, or the visual properties, which is not what I'm interested in. I've tried the childNodes array, but it's empty, apparently.
我在 HTML 中的表格单元格元素中嵌套了一个复选框。如何从 Javascript 访问内部复选框？我看到的所有示例都改变了内部 HTML 本身或视觉属性，这不是我感兴趣的。我已经尝试了 childNodes 数组，但显然它是空的。
回答by enoyhs
If you are not using jQuery then you could do:
如果您不使用 jQuery，那么您可以这样做：
document.getElementsByTagName('input');
And then cycling through them to find one that is checkbox and parentNode is table cell.
然后循环浏览它们以找到一个是复选框且 parentNode 是表格单元格的。
Or very simply add ID to that checkbox.
或者非常简单地将 ID 添加到该复选框。
回答by Ibu
if you are using jquery its very simple;
如果您使用 jquery，它非常简单；
$('table td input:checkbox')
UPDATE
更新
without jquery.
没有jQuery。
<table id='table'>
...
<td><input name='input' type='checkbox' /></td>
</table>
var table = document.getElementById('table');
var inputs = table.getElementsByTagName('input')
var chkbox = [];
for (var i=0; i< inputs.length;i++) {
if (inputs[i].type == 'checkbox') {
chkbox.push(inputs[i]);
}
}
now all your check boxes are inside chkbox array
现在你所有的复选框都在 chkbox 数组中
if you want to access from a form its also easy:
如果您想从表单访问也很容易：
var ckbox = document.formname.checkboxname;
回答by wdm
You can use an id...
你可以用身...
Demo: http://jsfiddle.net/YTDeW/1/
演示：http: //jsfiddle.net/YTDeW/1/
document.getElementById('ck1').value;
...
...
<table>
<tr>
<td>checkbox 1<input type="checkbox" id="ck1" name="ck" value="check1" /></td>
<td>checkbox 2<input type="checkbox" id="ck2" name="ck" value="check2" /></td>
<td>checkbox 3<input type="checkbox" id="ck3" name="ck" value="check3" /></td>
</tr>
</table>
...
...
or you can get all that have the same nameattribute...
或者你可以得到所有具有相同name属性的...
var y = document.getElementsByName('ck');
for (var i = 0; i < y.length; i++) {
document.getElementById('trace').innerHTML += "<br />" + y[i].value;
}
回答by RobG
If your input is in a form, then you can ignore the table completely for access purposes:
如果您的输入是表单，那么您可以完全忽略该表以进行访问：
<form name="aForm" ...>
// Whatever table structure you like
<input name="anInput" ...>
</form>
You can access the input as:
您可以通过以下方式访问输入：
var inp = document.aForm.anInput;
or more formally as:
或更正式地说：
var inp = document.forms['aForm'].elements['anInput'];
noting that if you have more than one form control in that form with the name anInput, inpwill be a collection of those elements.
请注意，如果该表单中有多个名为anInput 的表单控件，inp则将是这些元素的集合。
