php中文网

js怎么获取标签内容

php中文网

如何在 javascript 中获取标签内容

在 JavaScript 中,可以通过以下两种主要方法获取标签内容:

1. innerHTML 属性

innerHTML 属性用于获取或设置 HTML 元素及其子元素的 HTML 内容。

// 获取元素的 HTML 内容
const htmlContent = element.innerHTML;

// 设置元素的 HTML 内容
element.innerHTML = '<p>新的 HTML 内容</p>';

2. textContent 属性

textContent 属性用于获取或设置 HTML 元素及其子元素的纯文本内容(不包括 HTML 标记)。

// 获取元素的纯文本内容
const textContent = element.textContent;

// 设置元素的纯文本内容
element.textContent = '新的纯文本内容';

选择器示例

以下是一些使用选择器来获取不同类型标签内容的示例:

  • 获取所有 p 标签的文本内容:

    const paragraphs = document.querySelectorAll('p');
    paragraphs.forEach(paragraph =&gt; {
      console.log(paragraph.textContent);
    });
  • 获取 id 为 "my-div" 的 div 标签的 HTML 内容:

    const myDiv = document.getElementById('my-div');
    console.log(myDiv.innerHTML);
  • 获取 class 为 "my-class" 的所有 span 标签的纯文本内容:

    const spans = document.querySelectorAll('.my-class');
    spans.forEach(span =&gt; {
      console.log(span.textContent);
    });

以上就是js怎么获取标签内容的详细内容,更多请关注php中文网其它相关文章!

上一篇:js进度条怎么做

下一篇:js怎么设置css