javascript - 如何查询h3标签内的内容

Question

我正在使用以下 jQuery 代码来尝试获取元素内的文本并将其添加到我的变量中:

   <script>
    var title = $('h3').html();
    alert(title);
   </script>

但是，我的浏览器警告我“未定义”，而不是标记内的值。知道我做错了什么吗？

以下是供引用的 html 部分:

    <article>
      <div class="row">
        <div class="columns large-6 large-centered medium-8 medium-centered small-12">
          <h3>This is the post title</h3>
          <h4>written by <b>Myself</b></h4>
          <section>
            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla lacinia urna sit amet convallis dictum. Curabitur non sodales orci. Praesent vel gravida felis. Cras ultricies velit mi, eget efficitur ipsum tempus nec.</p>
          </section>
        </div>
      </div>
    </article>

谢谢

Answer 1

这是使用纯 JavaScript 的解决方案；这里实际上并不需要 jQuery。

var h3element = document.getElementsByTagName("h3")[0];

这将返回文档中所有 h3 元素的数组，您将获取其中的第 0 个索引。然后，只需访问innerHTML属性:

var h3content = h3element.innerHTML;

完整的解决方案如下所示:

<script>
    var title = document.getElementsByTagName("h3")[0].innerHTML;
    alert(title);
</script>