javascript - 获取span标签的所有innerhtml内容-6ren

javascript - 获取span标签的所有innerhtml内容

转载作者：行者123 更新时间：2023-11-30 21:16:44

26

4

我正在尝试获取作为 div#parent 子级的所有 span 标签的内容，但我无法做到，我只获取了第一个标签。请有人帮助我!

$( document ).ready(function() {
    var allspans=$("#parent").find("span").html();
    console.log( allspans );
});

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>jQuery</title>
</head>
<body>
  <div id="parent">
    <span>Element_1</span>
    <span>Element_2</span>
    <span>Element_3</span>
    <span>Element_4</span>
    <span>Element_5</span>
<script src="https://code.jquery.com/jquery-3.1.0.js"></script>
  </div>
</body>
</html>

谢谢!最好的问候!

最佳答案

您可以使用 .each 遍历 span，然后像这样访问它们各自的 innerHTML。通过 .each，您可以将内部 HTML 内容组合成一个数组或字符串。

或者，您可以通过 $("#parent").text() 获取所有 span 的内部文本。

$(document).ready(function() {
  $("#parent").find("span").each(function() {
    console.log($(this).html());
  });
  
  console.log($("#parent").text());
});

<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>jQuery</title>
</head>

<body>
  <div id="parent">
    <span>Element_1</span>
    <span>Element_2</span>
    <span>Element_3</span>
    <span>Element_4</span>
    <span>Element_5</span>
    <script src="https://code.jquery.com/jquery-3.1.0.js"></script>
  </div>
</body>

</html>

关于javascript - 获取span标签的所有innerhtml内容，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/45605770/

26

4

0

文章推荐： c - 使用条件运算符找到两个数字中最小的数字

文章推荐： c# - Entity Framework 转换为 ObjectSet

文章推荐： c - 排序 100000 个元素未完成

首页

博学

6Ren·AI

商城

javascript - 获取span标签的所有innerhtml内容

标签)？
根据 Web 标准，创建带有标题 1 的链接的正确代码是什么？是吗 stackoverflow 或 stackoverflow 谢谢最佳答案根据网络标准，您不能将 block 元素放入内

首页

博学

6Ren·AI

商城

javascript - 获取span标签的所有innerhtml内容

标签)？ 根据 Web 标准，创建带有标题 1 的链接的正确代码是什么？ 是吗 stackoverflow 或 stackoverflow 谢谢 最佳答案 根据网络标准，您不能将 block 元素放入内

标签)？
根据 Web 标准，创建带有标题 1 的链接的正确代码是什么？是吗 stackoverflow 或 stackoverflow 谢谢最佳答案根据网络标准，您不能将 block 元素放入内