时间戳

首页 > 解决方案 > 为什么控制台给我未定义的结果

javascript - 为什么控制台给我未定义的结果

问题描述

我不知道为什么我的控制台告诉我结果未定义。我正在学习 DOM 并在我的第一个代码中发现了我不理解的问题

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>

        let head = document.getElementsByClassName(".main");

        console.log(head.textContent);

        let tail = document.getElementsByTagName("p");

        console.log(tail.textContent);

    </script>
</head>

<body>

    <div class="main">
        <p>hello</p>
    </div>

</body>

</html>

标签： javascriptdom

解决方案

  1. 当脚本在 head 中运行时，这些元素不存在。将脚本移动到元素之后
  2. 从更改.main为maingetElementsByClassName
  3. getElementsByClassName返回一个列表，因此添加[0]到getElementsByClassName("main")以获取第一个元素

<div class="main">
    <p>hello</p>
</div>

<script>
    let head = document.getElementsByClassName("main")[0];
    console.log(head.textContent);

    let tail = document.getElementsByTagName("p")[0];
    console.log(tail.textContent);
</script>

推荐阅读