码迷,mamicode.com
首页 > 编程语言 > 详细

JavaScript基础-----(DOM操作的内容)

时间:2020-01-12 22:04:44      阅读:107      评论:0      收藏:0      [点我收藏+]

标签:innertext   签名   删除节点   script   标准   指定   命名法   span   sel   

查询元素

  1.直接访问指定节点的方法

    getElementById():返回一个节点对象        id

    getElementByName():返回多个(节点数组)    名字

    getElementByTagName():返回多个(节点数组)  标签名

  2.间接根据层次关系查找节点

    父节点

      parentNode

    孩子节点

      childNodes 数组对象,表示该节点的多有子节点的集合

      firstChild   lastChild

    兄弟节点

      nextSibling  previousSiBling

 

操作文本

  1.对于<p></p>、<hn></hn>、<div></div> <span></span>等标签,操作内部文本都使用innetHTML或者innerText

   对于表单项input、select等标签,获取值使用value(属性的操作)

   对于img等标签,不涉及文本

  2.innerHTML   指的是从对象的起始位置到终止位置的全部内容,包括html标签

    innerText    指的是从起始位置到终止位置的内容,但它能去除HTML标签

 

操作属性

  方法1:setAttribute(属性名,属性值)和getAttribute(属性名)

  方法2  .属性名

  方法1可以对自定义属性进行操作;但是方法2只能对标准属性进行操作

 

操作元素

  创建节点的方法

    document.createElement("div")

  加入节点的方法

    parentNode.appendChild(childElement):  末尾追加式插入节点

    parentNode.insertBefore(newNode,beforeNode):  在指定节点前插入新节点

  删除节点方法

    parentNode.removeChild(childNode)

  替换节点方法

    parentNode.replace(newNode,oldNode) 

 

操作css

  使用style对象操作css

    每个style对象对应为该元素指定的css,而每个css属性-对应于style对象的属性

      对于单个单词的css属性,在style对象中的属性名称不变

      对于双单词或多单词属性改写为驼峰命名法。例font-size 为fontSize

      注意:是JavaScript的style对象,不是html标签的style属性,但是有对应关系

JavaScript基础-----(DOM操作的内容)

标签:innertext   签名   删除节点   script   标准   指定   命名法   span   sel   

原文地址:https://www.cnblogs.com/skyline1/p/12184726.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!