在子跨度内的<输入>是未定义的。

Question

所以我目前试图访问这个元素中的classNameHTML输入。

<div id="1">
      <span>
          <input name="classNameHTML" type="text" />
      <span>
</div>

我目前写的代码是

let cObj = document.getElementById(1);
let cObjClass = cObj.children[0].classNameHTML.value; <--- buggy line

错误信息。

Uncaught TypeError: Cannot read property 'value' of undefined
at calcGrade (index.html:172)
at HTMLButtonElement.onclick (index.html:243)

我以为children[0]会引用span，然后我可以通过它的输入名来使用引用classNameHTML。我在做console.log()的时候，控制台说clasNameHTML未定义。谁能告诉我，我这里的点运算符做错了什么？

Answer 1

如前所述:

let cObjClass = cObj.children[0].classNameHTML.value;

是无效的。把它分解开来。

coObj 是周围的div.

.children[0] 是div里面的span。

.classNameHTML 是属于跨度的该名称的属性。这个是不存在的。

你想要的是span里面的输入。这将使你得到输入。

cObj.children[0].firstChild

那么，作为span的第一个子代的输入的值是：

cObj.children[0].firstChild.value

但如果你想通过名称而不是位置来访问输入，使用：

cObj.children[0].querySelector('[name="classNameHTML"]').value

这将会得到跨度内的元素，其名称为 name="classNameHTML".

Answer 2

如果你想从一个元素中获取className，你应该使用.className而不是.classNameHTML.value。