【JavaScript总结】JavaScript语法基础:DOM

->DOM的理解:文档对应dom树

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

->有了DOM能做什么:DOM的操作

html文档做为DOM树模型,DOM树的节点就是对象。对象会触发事件来执行一些事件代码。
C#中的事件是一个委托变量,JavaScript事件就是方法,浏览器的底层也会有很多触发函数的机制。
事件要做什么就写什么。例如:a标签添加点击事件

if(a.onclick!=null){
	var res=a.onclick();
	if(res===true){
		break;  //默认的正常跳转就不做了,返回了FALSE表示这个事件默认处理忽略不做
	}
}

标准DOM中定义了12中节点类型:
元素节点–1
文本节点–3
属性节点–2
获得方式:<node>.nodeType
获取节点

  1. 获取页面中指定id的节点对象:document.getElementByID("id的字符串“)
  2. 获取页面中所有标签名符合要求的标签的节点集合: document.getElementsByTagName(“标签名”); //可以使用“*”
  3. 获取指定父节点下的所有名字符号要求的节点集合: 父节点.getElementsByTagName("标签名称”)
  4. 元素节点的子节点 :
      <node>.childNodes
      <node>.childNodes[0]
      <node>.firstChild
      <node>.lastChild
      <node>.childNodes[<node>.childNodes.length-1]

修改节点:修改节点的属性和包含的文本内容
 标准修改方法:
  <node>.setAttribute("属性名”,“值”)
  <node>.getAttrubute("属性名”);
 DOM-html方法
  <node>.属性名=值
  var v=<node>.属性名
添加节点
 创建节点
   -->元素节点:var node=document.createElement("标签名”);
   -->文本节点:
         var textNode=document.createTextNode(“文本”);
        <节点>.innerHTML=“文本”;//这里可以使用html
        <节点>.innerText=“文本”;//非标准
   -->属性节点:<节点>.setAttribute(…,…);
 追加节点
   -->追加到尾部
          父节点.appendChild(子节点);
   -->插入到中间(插入到某个元素的前面)
          父节点.insertBefore(新元素 ,旧元素);
删除节点
   父节点.removeChild(子节点);
为节点添加事件对象
<node>.οnclick=function(){};

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值