DOM重点(方法使用)

1.getElementById()
 1、查询给定ID属性值的元素,返回该元素的元素节点。成为元素对象
 2、因为在一个html页面中id的值是唯一的,所有返回值也是唯一的,所以方法的名称为getElementBiId()而不是getElementsById()
 3、该方法只能用于document对象,类似与java的static关键字

2.getElementsByName()
 1、查找给定name属性的所有元素,这个方法返回一个节点集合,也可以称为对象集合
 2、这个集合可以作为数组来对待,length属性的值表示集合的个数
 3、因为在html页面中,name不能唯一确定一个元素,所以方法的名称为getElementsByName而不是getElementByName
3.getElementsByTagName()
 1、查询给定标签名的所有元素
 2、因为在html页面中,标签名不是唯一的,所以发挥至为节点的集合
 3、这个集合可以当做数组来处理length属性为集合里所有元素的个数
 4、可以有两种形式执行这个方法:
  1、var elements = document.getElementsByTagName(tagName);
  2、var elements = element.getElementsByTagName(tagName);
 5、从这两种方法可以看出只有这个方法的对象并不一定是整个文档对象(document)也可以是一个元素节点
4、hasChildNodes()
 1、该方法用来判断一个元素是否有子节点
 2、返回值为tyue或者false
 3、文本节点和属性节点不可能在包含子节点,所以对于这两个类节点使用hasChildeNodes()返回值用于为false
 4、如果hasChildNodes()返回值为false,则childNodes,firstChild,lastChild将为空数组或者空字符串。
5、nodeName
 1、文档中的每一个节点都有这个属性
 2、为给定节点的名称
 3、如果节点是元素节点,nodeName返回元素的名称
 如果给定节点为属性节点,nodeName返回属性的名称
 如果给定节点为文本节点,nodeName返回#text的字符串
6、nodeTyPE
 1、给节点表名节点类型,返回值为一个整数
 2、常用的节点类型有三种:
  1、元素节点类型 值为1
  2、属性节点类型 值为2
  3、文本节点类型 值为3
7、nodeValue
 1、返回给定节点的当前值(字符串)

 2、如果给定节点是属性节点点,返回值是这个属性的值
 如果给定节点是文本节点,返回值是这个文本节点的内容
 如果给定节点是元素节点,返回值是null
 3、nodeValue是一个读写属性
8、replaceChild()
 1、吧一个给定父元素里的一个子节点替换成为另一个子节点
 2、var reference = element.replaceChild(newChild,oldChild)
 3、返回值指向已经被替换掉的那个子节点的引用

9、getAttribute()
 1、返回一个给定元素的给定属性的节点的值
 2、var atributeValue = element.getAttribute(attributeName)
 3、给定属性的名字必须以字符串的形式传递给该方法
 4、给定属性的值将以字符创的形式返回
 5、通过属性获取属性节点
  getAttributeNode(属性名)-------返回属性节点
10、setAttribute()
 1、将给定元素添加一个新的属性或该百年他现有属性的值
 2、elemnt。setAttribute(attributeName,attributeValue);
 3、属性的名字和值必须以字符串的形式传递
 4、如果这个属性已经存在,那么值将被attributeValue取代
11、createElement()
 1、按照给定的标签创建一个新的元素节点,方法的参数为呗创建的元素的名称
 2、var reference = document.createElement(elementName);
 3、方法的返回值只当新建节点的引用,返回值是一个元素节点,所以nodeType为1
 4、新建的节点不会自动添加搭配文档里,只是存在于document里一个有力的对象
12、createTextNode()
 1、创建一个包含给定文本的新文本节点
 2、这个方法的返回值指向这个新建的文本节点的引用
 3、该方法有一个参数:新建文本节点的文本内容
 4、他是一个文本节点,所有nodeTye值为3
 5、新建的文本对象不会自动添加到文档里,属于游离态的对象
13、appendChild()
 1、为给定元素则加一个子节点
 var newrfernce = element.appendChild()newChild;
 2、给定子节点newChil将成为elmenet的最后一个节点
 3、方法的返回值指向新增节点的而引用
 4、该方法通常与createElement()与creatTextNode()一起使用
 5、新节点可以追加给文本中的任何一个元素
14、insertBefore()
 1、把一个给定节点插入到一个给定元素子节点的前面
        2、var reference = element.insertBefore(newNode,targetNode)
        3、newNode节点将作为element的子节点出现,并在targetNode节点的前面
        4、节点targetNode必须是element的一个子节点
        5、该方法通常与createElement和createTextNode结合使用

15、removeChild()
 1、从给定的元素里删除一个子节点
        2、var reference = element.removeChild(node)
        3、返回值指向已经被删除的子节点的引用
        4、当某个子节点被删除时,这个子节点所包含的子节点也被删除掉
        5、如果想删除一个子节点,但不知道父节点,可以使用parentNode属性
 

16、childNodes()
 1、返回一个数组,这个数组是由给定节点的子节点组成的。
        2、var nodeList = node.childNodes()
        3、文本节点和属性节点不可能再包含子节点,所以他们的childNodes()方法返回一个空的数组
 4、如果想知道这个节点有没有子节点可以利用hasChildNodes方法。
 5、一个节点的子节点有多少个可以调用数组的length来得到。
 6、如果这个节点还有子节点,那么这个节点肯定是元素节点
17、firstChild
 1、该属性返回给定节点的第一个子节点
        2、var reference = node.firstChild
        3、文本节点和属性节点不包括任何子节点,所以返回值为null
        4、node.firstChild=node.childNodes[0]
18、nextSibling
   1、返回给定节点的下一个兄弟节点
19、previousSibling
 1、 返回给定节点的上一个兄弟节点
20、innerHTML
 1、用来读写某个元素中的HTML内容
21、window.onload
 1、在页面上所有的数据加载完以后触发该方法
 2、这样做的好处是,有时候一些JS函数要用到页面上的一些数据,但是此时有些数据还没有加载进来。这个时候触发函数,就会报一些异常。所以用window.onload方法可以确保数据安全落地。

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值