DOM介绍

1.document:文档,DOM中的"D":当创建了一个网页并把它加载到Web浏览器中时,DOM就已经生成了,它把你编写的网页文档转换为一个文档对象.

2.Object:对象,DOM中的"O":在程序设计语言里,“对象”这个词含义很明确,对象是一种自给自足的数据集合,与对象相关联的变量被称为属性,与对象相关联的且只能由该对象去调用的函数被称为这个对象的方法.JavaScript里最基础的对象是window对象,对应着浏览器本身,这个对象的属性和方法通常被称为BOM(浏览器对象模型),但叫做窗口对象模型似乎更加贴切.

3.Model:模型,DOM中的"M":也可以称为Map,指的是某种事物的表现形式,DOM代表着加载到浏览器窗口的当前网页,浏览器提供了网页的模型(地图),我们可以通过JavaScript去读取这张地图.

DOM把一份文档表示为一棵树,指的是数学上的"树",这是理解这一模型的关键.

看下面这张网页:

 

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>你的星座</title>

</head>

<body>

    <h1>水象星座</h1>

    <p title="">下面三个是水象星座</p>

    <ul id="content">

        <li>双鱼座</li>

        <li class="cancer">巨蟹座</li>

        <li class="scorpio">天蝎座</li>

    </ul>

</body>

</html>

这份文档可以用树来表示:

 html

        --head

                --meta

                ---title

        --body

                --h1

                --p

                --ul

                        --li

                        --li

                        --li

其中,html是根标签,代表整个文档,然后是两个分支<head>,<body>,它们互不包含,所以是兄弟关系,<head>有两个子元素<meta>,<title>,<body>有三个子元素<h1><p><ul>,<ul>也有三个子元素,都是<li>.

4.节点:node,网络术语,表示网络中的一个连接点.网络就是由一些节点构成的集合.DOM主要有三种节点,元素节点,文本节点,属性节点.

 (1)元素节点(element node):在刚才那份文档里,<body>,<p>,<ul>就是元素节点.

 (2)文本节点(text node):<p>元素包含着文本"下面三个是水象星座",它就是一个文本节点.

 (3)属性节点(attribute node):用来对元素做更具体的描述,例如在<p>元素中的title="水",就是一个属性节点,ul的id,li的class都是属性节点.

  • 3
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

雪落星辰ow

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值