javascript 复选框的Javascriptinnerhtml
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/10143211/
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
Javascript innerhtml of checkbox
提问by Sergey Scopin
Well I have some checkboxes with id='0','1','2','3' etc. So I need to get text of checkboxes. Here is code of checkboxes in PHP.
好吧，我有一些带有 id='0','1','2','3' 等的复选框。所以我需要获取复选框的文本。这是 PHP 中复选框的代码。
'<input id="'.$i.'"type="checkbox" name="option1" value="a1" onclick="checkYears()">'.$years[$i].'</input>
So i need to get $years[$i]-value. I'm using this code.
所以我需要获得 $years[$i] 值。我正在使用此代码。
while (bool==false)
{
if (document.getElementById(i)!=null)
{
if (document.getElementById(i).checked)
{
years.push(1);
yearsValue.push(document.getElementById(i).innerHTML);
document.getElementById(i).innerText="WORKS";
console.log(yearsValue[i]);
}
else
{
years.push(0);
yearsValue.push(document.getElementById(i)).innerHTML);
console.log(yearsValue[i]);
}
}
else
{
bool=true;
}
i++;
}
0's and 1's are added ok, but when i'm trying to use innerHTML there is and undefined values in consle.
添加 0 和 1 没问题，但是当我尝试使用 innerHTML 时，consle 中有未定义的值。
Any suggestions?
有什么建议？
回答by Quentin
InnerHTML gets the HTML contentof an element. i.e. the data between the start tag and the end tag. Inputs are empty elements, they cannot have content (in HTML (as opposed to XHTML) they cannot have an end tag either). Your HTML is invalid and you should use a validator.
InnerHTML 获取元素的 HTML内容。即开始标记和结束标记之间的数据。输入是空元素，它们不能有内容（在 HTML（与 XHTML 相对）中，它们也不能有结束标记）。您的 HTML 无效，您应该使用验证器。
You probably want something like this:
你可能想要这样的东西：
<label>
<input type="checkbox">
<span>Text label</span>
</label>
Then you could get:
那么你可以得到：
checkbox.parentNode.innerHTML;
or
或者
checkbox.parentNode.getElementsByTagName('span')[0].innerHTML
回答by Rick Kuipers
An input element does not have an innerhtml because the element is supposed to be self-closing:
输入元素没有innerhtml，因为该元素应该是自关闭的：
<input type="checkbox" name="checkbox" value="1" />
<input type="checkbox" name="checkbox" value="1" />
回答by antyrat
回答by sushil bharwani
Ideally a input element will not have any innerHTML. That means you cannot have an enclosing html content in input element. You can just have value of input element.
理想情况下，输入元素不会有任何innerHTML。这意味着您不能在 input 元素中包含封闭的 html 内容。您可以只拥有输入元素的值。
回答by whoislouis
As pointed out, input elements are self-closing and do not have innerHTML. Best solution if you want to catch the plain text next to the checkbox element would be to use "nextElementSibling" and "innerText".
正如所指出的，输入元素是自关闭的，没有innerHTML。如果您想捕获复选框元素旁边的纯文本，最佳解决方案是使用“nextElementSibling”和“innerText”。
<input type="checkbox" id="checkbox1"> <span>Text to get...</span>
<button onclick="getText()">Get Text</button>
JavaScript:
JavaScript：
function getText() {
console.log(document.getElementById("checkbox1").nextElementSibling.innerText);
}
