如何通过其类获得跨度文本？

Question

我需要在span元素中获取文本.问题是它没有唯一的ID,只有一个类.有没有办法通过只知道它的类来检索这个元素中的文本？

我试过这段代码:

var theValue = document.getElementById('you').getElementsByClassName('username').innerHTML;

但是我收到一个错误:

未捕获的TypeError:无法读取null的属性'getElementsByClassName'

HTML:

<div id="you">
       <span class="username">theTextIShouldGet</span>

        <a class="logout" href="/logout">
         </a>
        <a class="settings" href="/settings">
         </a>
</div>

Answer 1

您收到该错误是因为您在页面上加载该元素之前尝试访问该元素.将脚本移动到页面底部或将脚本包装在DOM就绪函数中.

至于按班级获取文本,当然!getElementsByClassName返回一个集合 - 所以你需要引用你想要的索引:

<div id="you">
   <span class="username">theTextIShouldGet</span>

    <a class="logout" href="/logout">
     </a>
    <a class="settings" href="/settings">
     </a>
</div>
<script>
    var theValue = document.getElementById('you').getElementsByClassName('username')[0].innerHTML;
</script>