Javascript：如何将值设置为 HTMLDivElement？答案

【问题标题】：Javascript: How to setValue to HTMLDivElement?Javascript：如何将值设置为 HTMLDivElement？
【发布时间】：2015-10-17 06:03:12
【问题描述】：

我的 HTML 页面代码如下所示-

<div id="test-inputEl" role="textbox" class="test-field" data-errorqtip="">10</div>

要访问这个值 10 我正在使用下面的代码-

var divObject = parent.document.getElementById('test-inputEl');
alert(divObject);
var testField = divObject.getElementsByClassName("test-field");
alert(testField);

对于我得到的第一个 alert 框-

[object HTMLDivElement]

第二个我得到了-

[object HTMLCollection]

但我无法访问该值。我试过这样-

var objValue = divObject.getElementsByClassName("x-form-display-field")[0].innerHTML;

但不工作。有没有办法获取这个值或使用javascript 设置这个值。因为我对jquery不太熟悉。

【问题讨论】：

...什么是父母？以及为什么你使用 document.getEl.... 如果你使用 parent？

标签： javascript

【解决方案1】：

使用innerHTML属性从div中获取10的值。

var divObject = document.getElementById('test-inputEl').innerHTML;
document.write(divObject);

&lt;div id="test-inputEl" role="textbox" class="test-field" data-errorqtip=""&gt;10&lt;/div&gt;

【讨论】：

你认为`parent.document.getElementById...`会起作用吗？

【解决方案2】：

当您使用 getElementById 时，您会检索到您想要的 HtmlElement，但是当您使用 getElementsByClassName 时，您的结果是 HTML 元素的集合，而不是数组！！

要获取第一项，请使用myCollection.item(0)

var objValue = divObject.getElementsByClassName("x-form-display-field").item(0).innerHTML;

https://developer.mozilla.org/it/docs/Web/API/HTMLCollection

How to correctly iterate through getElementsByClassName

【讨论】：