document.getElementsByClassName给我未定义的值

Question

<canvas id="can" height="500px" width="1200px"></canvas>
<div class="name">
    <h1>AISHWARYA</h1> </div>
<script>
    var name=['MOHITE','AISHWARYA',"CHANDRAKANT","KAVITA"]
    var counter=0
    var data=document.getElementsByClassName("name")[0].value;
    console.log(data);

undefined打印在控制台上。

Answer 1

这个问题在.value中最有可能出现

如果您只打印document.getElementsByClassName("name")[0]，您将得到div的内部value -如果我正确的话，value是用于输入的。

您可以使用.innerHTML、.innerText或.textContent来获取内容。

Answer 2

要实现扩展结果，请使用以下选项:使用document.getElementsByTagName("h1")和innerHTML

​

    <canvas id="can" height="500px" width="1200px"></canvas>
    <div class="name">
        <h1>AISHWARYA</h1> </div>
    <script>
        var name=['MOHITE','AISHWARYA',"CHANDRAKANT","KAVITA"]
        var counter=0
        var data=document.getElementsByTagName("h1")[0].innerHTML;
        console.log(data)
      </script>

​

代码- https://codepen.io/nagasai/pen/LJJdqa