JavaScript----DOM

一、DOM

DOM定义

DOM全称:Document Object Model 文档对象模型。
JS中通过DOM来对HTML文档进行操作。

文档: 表示的就是整个HTML网页文档;
对象: 表示将网页中的每一个部分都转换为了一个对象;
模型: 使用模型来表示对象之间的关系,这样方便我们获取对象。

二、节点

节点定义
节点(Node)------构成HTML文档最基本的单元。

常用节点分为四类:
				文档节点:整个HTML文档;
				元素节点:HTML文档中的HTML标签;
				属性节点:元素的属性;
				文本节点:HTML标签中的文本内容。

三、事件

事件的简介

事件就是文档或浏览器窗口中发生的一些特定的交互瞬间。
比如:点击按钮,鼠标移动,关闭窗口…
我们可以在事件对应的属性中设置一些js代码,这样当事件被触发时,这些代码就会执行。

注意:js和html代码不要写在一起,这种写法我们成为结构和行为耦合,不方便维护,不推荐使用。

四、文档的加载

注意: 浏览器在加载一个页面时,是按照自上向下的顺序加载的,读取到一行就运行一行,如果将script标签写到页面的上边,在代码执行时,页面还没有加载,页面没有加载DOM对象也没有加载,会导致无法获取到DOM对象。

解决方法:

1.将js标签写到下面;
2.将js标签写上面但是要加一个window.οnlοad=function(){}

onload事件会在整个页面加载完成之后才触发

为window绑定一个onload事件
该事件对应的响应函数将会在页面加载完成之后执行,这样可以确保我们的代码执行时所有的DOM对象已经加载完毕了。

五、常用的语句

1.getElementById()
通过id属性获取一个元素节点对象
2. getElementsByTagName()
通过标签名获取一组元素节点对象
3. getElementsByName()
通过name属性获取一组元素节点对象

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值