获取 HTML 中指定 className 所在的内容并去除标签,可以通过 JavaScript 函数来实现。下面是具体步骤:
获取 HTML 中指定 className 所在的内容并去除标签,可以通过 JavaScript 函数来实现。下面是具体步骤:
- 选取需要获取 className 的元素
首先,需要通过 JavaScript 找到需要获取 className 的元素,可以使用 document.querySelector 或 document.querySelectorAll 方法。
const element = document.querySelector('.my-class');
- 获取元素的 innerHTML
获取到需要获取 className 的元素之后,就可以获取元素的 innerHTML 属性,这个属性可以返回元素中包含的所有 HTML 代码。
const elementHtml = element.innerHTML;
console.log(elementHtml);
- 使用正则表达式去除 HTML 标签
获取到元素的 innerHTML 之后,需要去掉其中的 HTML 标签。这可以通过正则表达式来实现。将 HTML 标签替换为空字符串即可。
const content = elementHtml.replace(/<\/?[a-z]+>/gi, '');
console.log(content);
完整代码示例 1:获取元素中指定 className 的文本内容
const element = document.querySelector('.my-class');
const elementHtml = element.innerHTML;
const content = elementHtml.replace(/<\/?[a-z]+>/gi, '');
console.log(content);
完整代码示例 2:获取所有指定 className 的元素文本内容
const elements = document.querySelectorAll('.my-class');
const contents = [];
for (let i = 0; i < elements.length; i++) {
const elementHtml = elements[i].innerHTML;
const content = elementHtml.replace(/<\/?[a-z]+>/gi, '');
contents.push(content);
}
console.log(contents);
需要注意的是,获取到的内容仅仅是文本,如果需要保留部分标签可以在正则表达式中加入对应标签的正则匹配。
本文标题为:js函数获取html中className所在的内容并去除标签
基础教程推荐
- 使用BitSet位集合,一个重复校验工具 2023-06-30
- cookie+mybatis+servlet实现免登录时长两天半的整体流程 2023-06-06
- Java 内存溢出排查 2023-08-31
- Java Map接口概述和常用方法详解 2023-06-30
- java – Spring Data JPA何时实际上在数据库上调用INSERT? 2023-10-29
- Java的引用类型常用的四种方法 2023-02-10
- Spring事务失效的各种场景(13种) 2023-03-11
- MyBatis实现多表联查的详细代码 2023-03-30
- Springboot使用redis实现接口Api限流的示例代码 2023-02-27
- Linux Centos安装jdk 之前照着网上安装了好多次 结果都是javac编译失败,出现javac :command not found 2023-09-01
