DOM解析器DOMParser api的讲解

本文涉及的产品
公共DNS(含HTTPDNS解析),每月1000万次HTTP解析
云解析 DNS,旗舰版 1个月
全局流量管理 GTM,标准版 1个月
简介: DOM解析器DOMParser api的讲解


介绍:

DOMParser 可以将存储在字符串中的 XMLHTML 源代码解析为一个 DOM Document

DOMParser - Web API 接口参考 | MDN (mozilla.org)

语法:

let domparser = new DOMParser();

方法:

parseFromString(string, type)

参数介绍:

  1. string : 要解析的DOM字符串
  2. type : 解析类型
  • text/html
  • text/xml
  • application/xml
  • application/xhtml+xml
  • image/svg+xml
  1. 返回值: 返回一个document对象

示例:

// 定义一个变量 用来存储dom字符串
        var dom = '<div><p>666</p></div>';
        // 创建DOM解析器
        var parser = new DOMParser();
        // 解析DOM字符串
        var doc = parser.parseFromString(dom, "text/html");
        console.log(doc);
        // 获取p标签
        var p = doc.querySelector("p");
        // 获取p标签的文本内容
        var text = p.textContent;
        console.log(text); // 666


目录
相关文章
|
3天前
|
XML Web App开发 JavaScript
XML DOM 解析器
XML DOM 解析器
|
7天前
|
XML Web App开发 JavaScript
XML DOM 解析器
XML DOM 解析器
|
5天前
|
XML Web App开发 JavaScript
XML DOM 解析器
XML DOM 解析器
|
13天前
|
XML Web App开发 JavaScript
XML DOM 解析器
XML DOM 解析器
|
9天前
|
XML Web App开发 JavaScript
XML DOM 解析器
XML DOM 解析器
|
11天前
|
XML Web App开发 JavaScript
XML DOM 解析器
XML DOM 解析器
|
1天前
|
XML Web App开发 JavaScript
|
4月前
|
缓存 JavaScript 前端开发
【JavaScript 技术专栏】DOM 操作全攻略:从基础到进阶
【4月更文挑战第30天】本文深入讲解JavaScript与DOM交互,涵盖DOM基础、获取/修改元素、创建/删除元素、事件处理结合及性能优化。通过学习,开发者能掌握动态改变网页内容、结构和样式的技能,实现更丰富的交互体验。文中还讨论了DOM操作在实际案例、与其他前端技术结合的应用,助你提升前端开发能力。
177 0
|
1月前
|
XML JavaScript 前端开发
JavaScript中的DOM解析器DOMParser api的讲解
`DOMParser`能将XML或HTML源码字符串解析成DOM `Document`。通过`new DOMParser()`创建实例,使用`.parseFromString(string, type)`方法进行解析,其中`string`为待解析的字符串,`type`指定解析类型如`text/html`或`text/xml`等,返回一个`Document`对象。例如,可解析包含`&lt;p&gt;666&lt;/p&gt;`的字符串并获取其文本内容`666`。
80 1
|
3月前
|
JavaScript 前端开发 UED
JavaScript基础-DOM操作:查找、创建、修改
【6月更文挑战第12天】本文介绍了DOM基础,包括查找元素(getElementById、getElementsByClassName等)、创建新节点(createElement、createTextNode)和修改节点(innerText、innerHTML、setAttribute等)。强调了易错点,如ID唯一性、性能考量和安全问题,并提供了代码示例。熟练掌握DOM操作对前端开发至关重要,但应注意性能优化,适时使用框架或库。
46 2
JavaScript基础-DOM操作:查找、创建、修改

推荐镜像

更多