Dom解析Html文档中的元素

最新推荐文章于 2021-06-10 16:44:57 发布
最新推荐文章于 2021-06-10 16:44:57 发布
阅读量6k 收藏 3
点赞数
文章标签： html 文档 xml null 语言 function
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/hongmeikaile/article/details/6520061
版权

Dom解析Html文档中的元素

一、理论

Dom我们并不陌生，之前我写过一篇XML的解析方法，里面有一种解析方法叫Dom4j，其实Dom4j和Dom的区别就是版本高了点、功能更强了一点，其实本质是一样的，都是用来解析文档。DOM： DOM= Document Object Model，文档对象模型，DOM可以以一种独立于平台和语言的方式访问和修改一个文档的内容和结构。换句话说，这是表示和处理一个HTML或XML文档的常用方法。有一点很重要，DOM的设计是以对象管理组织（OMG）的规约为基础的，因此可以用于任何编程语言，

D：文档 – html 文档 或 xml 文档

O：对象 – document 对象的属性和方法

M：模型

DOM 是针对xml(html)的基于树的API。

DOM树:节点（node）的层次。

DOM 把一个文档表示为一棵家谱树（父，子，兄弟）

DOM定义了Node的接口以及许多种节点类型来表示XML节点的多个方面

DOM 规定：（1）整个文档是一个文档节点 （2）每个 HTML 标签是一个元素节点 （3）包含在 HTML 元素中的文本是文本节点 （4）每一个 HTML 属性是一个属性节点 （5）注释属于注释节点 

二、举例

举例说明dom的用法：

Code:
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">   
  2. <html>   
  3.   <head>   
  4.     <title>Dome04.html</title>   
  5.        
  6.     <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">   
  7.     <meta http-equiv="description" content="this is my page">   
  8.     <meta http-equiv="content-type" content="text/html; charset=UTF-8">   
  9.        
  10.     <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->   
  11.     <script type="text/javascript">   
  12.  window.onload = function(){     
  13. //获得html的标签   
  14.     var aa=document.documentElement;   
  15.     //获得html的名字，应该输出BOBY   
  16.     alert(aa.nodeName);   
  17.     //获得html的类型,应该输出的是1   
  18.     alert(aa.nodeType);   
  19.     //获得html的值，应该输出的是null   
  20.     alert(aa.nodeValue);   
  21.     //判断html是否有子节点,应该输出的是true   
  22.     alert(aa.hasChildNodes());   
  23.     //获得body标签   
  24.     var bb=document.body;   
  25.     //获得body的类型,应该是1   
  26.     alert(bb.nodeType);   
  27.     //获得h1的对象   
  28.     var h1=aa.lastChild;   
  29.     //输出h1中的名字，应该是h1   
  30.     alert(h1.nodeName);   
  31.     //输出h1中的值，应该是null，因为标签是元素节点  元素节点的nodeValue值是null   
  32.     alert(h1.nodeValue);   
  33.     //输出h1中的值， 通过innerText获取元素节点的内容===>去掉标签的内容，通过innerHtml获取元素节点的内容===>原样内容 是什么就是什么   
  34.     alert(h1.innerText)   
  35.        
  36.     //另一种方法输出h1的值      
  37.     var zhi = h1.lastNode;   
  38.     //输出zhi的值   
  39.     alert(zhi.nodeValue);      
  40.     }   
  41.     </script>   
  42.        
  43.   </head>   
  44.      
  45.   <body>   
  46.     <h1>你好！</h1>   
  47.   </body>   
  48. </html>   
  49.   
  50.       

 

红梅开了
关注
HTML DOM（文档对象模型） 详细讲解
qq_53016083的博客
01-18 2161
1. HTML DOM 独立于平台和编程语言。它可被任何编程语言诸如 Java、JavaScript 和 VBScript 使用。 2. 当网页被加载时，浏览器会创建页面的文档对象模型（Document Object Model）。 3. 通过 HTML DOM，可访问 JavaScript HTML 文档的所有元素。
android 解析dom,Android中的DOM解析方式
weixin_32148341的博客
05-27 741
1、DOM解析简介 DOM解析会将XML文件的内容，以对象树的形式存放在内存中。DOM解析采用了对象树这种形式存储，使它易于遍历，方便的知道上下层节点的情况，这是DOM解析与SAX解析最大的不同之处。SAX解析只能够知道自己节点的情况，无法得知其它节点的信息。2、DOM解析常用方法 (1)Document.getDocumentElement()：返回文档的根元素(2)Node.g...
dom解析
weixin_30904593的博客
07-22 84
上一篇说到了pull解析、针对于pull解析做了一个封装、虽然在android里面推荐用pull解析、但是dom解析作为java三种常用的解析方法之一、没研究其速度方面哪个更好、对于dom解析、个人感觉还是很不错的、至少在封装的时候、可以封装的更抽象点、直接解析一个完整的xml、 /** * 解析XML * @param inputStream * @param s...
DOM解析html
weixin_30469895的博客
06-12 396
通过DOM的方法，把HTML全部（元素（标签）、文本、属性）都封装成了document对象。 　　* DOM解析HTML(可以使用浏览器解析HTML)。 　　* 浏览器DOM解析HTML： 　　　　DOM会把HTML解析成树状结构。 　　　 注意：Node对象是Document、Element、Attribute、Text四个对象的父类，四个对象都属于节点对象。 * DHTML不是一种...
DOM解析
weixin_34099526的博客
12-10 283
Dom解析是将xml文件全部载入，组装成一颗dom树，然后通过节点以及节点之间的关系来解析xml文件 根据 DOM，XML 文档中的每个成分都是一个节点。 DOM 是这样规定的： 整个文档是一个文档节点 每个 XML 标签是一个元素节点 包含在 XML 元素中的文本是文本节点 每一个 XML 属性是一个属性节点 注释属于注释节点 位于org.w...
使用dom对html文档进行解析
红豆和绿豆的博客
11-16 407
将html文档映射到内存中，然后操作内存中的对象。从而就可以动态的修改页面上的值。 将一个html文档映射到内存之后，整个内存类的继承图，就是上面这个图所示的。 HTML元素之间的包含关系如下图所示：
php使用simple_html_dom解析HTML示例
10-21
在使用simple_html_dom解析HTML文档时，常用的方法包括获取网页的DOM对象，以及使用选择器来查找HTML元素。例如，使用file_get_html函数可以从指定的URL获取网页的DOM对象。一旦获取了DOM对象，就可以利用简单的选择...
DOM.rar_DOM_HTML dom_dom树解析
09-21
**DOM（Document Object Model）**是万维网联盟（W3C）定义的一个标准，它是一种与语言无关的接口，允许程序和脚本动态更新、添加、删除和改变元素及属性，以操作XML和HTML文档。DOM的核心在于将文档结构化为一个...
用dom解析xml文件
03-28
在处理XML文件时，DOM解析器会将整个XML文档加载到内存中，形成一个完整的节点树，这样我们就可以通过这个树来查找、修改或遍历XML数据。 XML（eXtensible Markup Language）是一种标记语言，常用于存储和传输结构...
php解析html类库simple_html_dom(详细介绍)
01-20
下载地址：https://github.com/samacs/simple_html_dom解析器不仅仅只是帮助我们验证html文档...开始使用上传类文件以后，有三种方式调用这个类：从url中加载html文档从字符串中加载html文档从文件中加载html文档复制代
DOM解析HTML
林林木林林L的博客
07-01 306
#DOM解析 from lxml import etree #定义一段待解析的HTML片段 text = ''' <div> <ul> <li>第一项</li> <li class="item2">第二项</li> <li name="item3"> <div>第三项</div> </li> <li id="item4"> <a hre
DOM解析HTML文件
分享经验，共同进步.
08-05 1653
源代码如下：http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">http://www.w3.org/1999/xhtml" >    利用Dom技术解析HTML            //检查用户名是否为空        function checkUserName()        {            var name =
html dom页面解析,HTML DOM 详解
weixin_35545176的博客
06-03 491
警告请使用 document.write() 仅仅向文档输出写内容。如果在文档已完成加载后执行 document.write，整个 HTML 页面将被覆盖：.DOM 节点根据 W3C 的 HTML DOM 标准，HTML 文档中的所有内容都是节点：整个文档是一个文档节点每个 HTML 元素是元素节点HTML 元素内的文本是文本节点每个 HTML 属性是属性节点注释是注释节点HTML DOM 节点树...
dom解析结构html,Dom详解
weixin_34684706的博客
06-10 753
DOMJavaScript 的组成组成部分说明Ecmascript描述了该语言的语法和基本对象DOM描述了处理网页内容的方法和接口BOM描述了与浏览器进行交互的方法和接口DOM(文档对象模型)是针对HTML和XML文档的一个API(应用程序编程接口)。DOM描绘了一个层次化的节点树，允许开发人员添加、移除和修改页面的某一部分。DOM 以树结构表达 HTML 文档。获取元素getElementByI...
评论 10
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值