js获取节点和编辑的方法

获取:

1.document.getElementById()

靠id获取节点

2.document.getElementsByClassName()

靠类名获取节点集(数组)

3.document.getElementsByTagName()

靠标签名获取节点集(数组)

4.document.createElement()

创建新的节点

5.document.querySelector()

靠CSS选择符获取节点

6.document.querySelectorAll()

靠CSS选择符获取节点集(数组)

编辑:

获取元素节点后,可以用之前提到过的点表示法和方括号表示法来编辑操作元素节点的属性(id、src、className、style、offsetTop、offsetWidth、clientWidth、scrollWidth....)和内容(innerHTML、outerHTML、innerText、textContent、childNodes、appendChild、removeChild....)。

值得注意的是操作样式的写法:

1.第一种是  node.style.样式名  的写法:例如div.style.height="100px"(比较特别的:有-的样式名如div.style.backgroundColor,浮动div.style.cssFloat)

2.第二种是  node.style.cssText  的写法:例如div.style.cssText="display:block;width:100px;height:100px"

时间: 2024-10-13 08:09:00

js获取节点和编辑的方法的相关文章

JS获取节点方法

1. 通过顶层document节点获取:(1) document.getElementById(elementId):该方法通过节点的ID,可以准确获得需要的元素,是比较简单快捷的方法.如果页面上含有多个相同id的节点,那么只返回第一个节点. 如今,已经出现了如prototype.Mootools等多个JavaScript库,它们提供了更简便的方法:$(id),参数仍然是节点的id.这个方法可以看作是document.getElementById()的另外一种写法,不过$()的功能更为强大,具体

原生js获取css中class的方法

function getByClass( className, context) { var context = context || document; if( context.getElementsByClassName) { return context.getElementsByClassName(className); } var nodes = context.getElementsByTagName("*"); ret=[]; for( var i=0; i<nod

js 获取节点

var chils= s.childNodes; //得到s的全部子节点 var par=s.parentNode; //得到s的父节点 var ns=s.nextSbiling; //获得s的下一个兄弟节点 var ps=s.previousSbiling; //得到s的上一个兄弟节点 var fc=s.firstChild; //获得s的第一个子节点 var lc=s.lastChile; //获得s的最后一个子节点 js 获取节点

原生JS的使用,包括jquery和原生JS获取节点、jquery和原生JS修改属性的比较

一.前言 相比于JS这条直达终点.满是荆棘的小路,jquery无疑是康庄大道了,足够的简洁.易用给了它辉煌的地位.然而,毕竟是绕着道的插件,当小路走着走着变成大路的时候,曾经的大路也就失去了他自身的优势了. 原生JS虽然没有jquery那么的好用.便捷,或者说没有jquery那样让我们使用的如此顺手,甚至是无法舍弃的依赖.可是我们依然不得不扔掉手中这根陪伴我们多年的拐杖,我们不是瘸子,我们不曾腐朽,我们还可以独立前行. 二.正文 1. jquery和原生JS获取节点的比较 //这是HTML代码,

JS获取DOM的几种方法

JS获取DOM和几种方法 通过ID获取(getElementById) 通过name属性(getElementsByName) 通过标签名(getElementsByTagName) 通过类名(getElementsByClassName) 获取html的方法(document.documentElement) 获取body的方法(document.body) 通过选择器获取一个元素(querySelector) 通过选择器获取一组元素(querySelectorAll) 下面依次讲解:1.通过

js 获取节点方法

旧版本获取节点1.获取body console.log(document.body); 2.获取img console.log(document.images); 3.获取a标签 console.log(document.links); 4.获取含有name属性的a标签 console.log(document.anchors); 5.获取form标签 console.log(document.forms); 获取节点的方法新版本获取节点的方法:DOM21.通过id获取,可以交给一个变量保存(括

JS获取节点的兄弟,父级,子级元素

先说一下JS的获取方法,其要比JQUERY的方法麻烦很多,后面以JQUERY的方法作对比. JS的方法会比JQUERY麻烦很多,主要则是因为FF浏览器,FF浏览器会把你的换行也当最DOM元素 <div id="test"> <div></div> <div></div> </div> 原生的JS获取ID为test的元素下的子元素.可以用: var a = docuemnt.getElementById("

JS获取HTML DOM元素的方法

在JS中获取元素的方法有很多,可以根据实际需要选择合适的方法 一.JS获取元素的方法 1)根据id获取标签元素 var div1=document.getElementById("div1"); 2)根据标签名获取标签列表 var divs=document.getElementsByTagName("div") 3)根据className获取标签列表 var div0=document.getElementsByClassName("div0"

JS获取各种浏览器窗口大小的方法

常用:JS 获取浏览器窗口大小 // 获取窗口宽度 if (window.innerWidth) winWidth = window.innerWidth; else if ((document.body) && (document.body.clientWidth)) winWidth = document.body.clientWidth; // 获取窗口高度 if (window.innerHeight) winHeight = window.innerHeight; else if