无法读取未定义的属性“innerText”答案

【问题标题】：Cannot read property 'innerText' of undefined无法读取未定义的属性“innerText”
【发布时间】：2018-01-04 00:07:05
【问题描述】：

以下代码有错误。如果选择了元素（选择的类是选择的元素），我正在尝试获取 id id05 的值。

HTML：

<ul id="items" class="clearfix">

  <!-- ---------- this item is selected --------------- -->
  <li class="item folder selected">
    <a href="/t1/">

      <!-- -------this is the element whose innerTEXT i want ----------- -->
      <span id="id05" class="label" title="t1">t1</span>
    </a>
  </li>


  <!-- ---------- this item is also selected --------------- -->

  <li class="item folder page selected">
    <a href="/upl/" target="_blank">

      <!-- -------this is the element whose innerTEXT i want ----------- -->
      <span id="id05" class="label" title="upl">upl</span>
    </a>
  </li>

  <!-- ---------- this item is not selected --------------- -->

  <li class="item file">
    <a href="Ff.html/" target="_blank">
      <span id="id05" class="label" title="Ff.html">Ff.html</span>
    </a>
  </li>
</ul>

JS：

function del() {
  var name;

  var nam = document.querySelectorAll(".selected");

  for (var i = 0; i < nam.length; i++) {
    name = document.getElementById("id05")[i].innerText; //Here is the error
  }
  console.log(name);
}

console.log - 未捕获的 TypeError：无法读取未定义的属性“innerText”

【问题讨论】：

您有多个具有相同id 的元素，它们必须是唯一的。您的问题是因为您无法通过索引访问getElementById()，因为它只返回一个元素
ID 就像汉兰达一样。只可以有一个人。将它们更改为类，您的代码将起作用。
谢谢。每次我都忘记这个XD

标签： javascript jquery html dom

【解决方案1】：

试试这个：

HTML：

<ul id="items" class="clearfix">
  <li class="item folder selected">
    <a href="/t1/">
      <span class="label" title="t1">t1</span>
    </a>
  </li>
  <li class="item folder page selected">
    <a href="/upl/" target="_blank">
      <span class="label" title="upl">upl</span>
    </a>
  </li>
  <li class="item file">
    <a href="Ff.html/" target="_blank">
      <span class="label" title="Ff.html">Ff.html</span>
    </a>
  </li>
</ul>

Javascript：

function del(){
  var selected = document.querySelectorAll("li.selected span");
  selected.forEach(item => {
    console.log(item.innerText);
    // Do what you need to each item here
  });
}

我刚刚删除了 id 并在查询选择器中定位了子 span。

【讨论】：

谢谢你，这是完美的，刚刚在 DOM 中编辑了 span.label。