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);

获取节点的方法
新版本获取节点的方法:DOM2
1、通过id获取,可以交给一个变量保存(括号里写id名)

let a = document.getElementById("box");

console.log(a);
 2、通过class获取(获取到的是数组)

console.log(document.getElementsByClassName("1"));
3、通过标签名获取(获取到的是数组)

console.log(document.getElementsByTagName("div"));
4、通过name属性获取(获取到的是数组)

console.log(document.getElementsByName(2));

html5获取节点方法
 1、获取到的是满足选择器的第一个标签(括号里写css选择器)

console.log(document.querySelector(".box1>p"));

2、获取到的是数组(括号里写css选择器)

console.log(document.querySelectorAll(".box1>p"));

原文地址:https://www.cnblogs.com/badren/p/9575746.html

时间: 2024-10-27 05:15:15

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

JS获取节点方法

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

JS添加节点方法与JQuery添加节点方法的比较及总结

原生JS添加节点方法与JQuery添加节点方法的比较及总结 一.首先构建一个简单布局,来供下边讲解使用 1.HTML部分代码: <div id="div1">div1</div> <div id="div2">div2 <span id="span1">span1</span> <span id="span2">span2</span> <

JS获取标签方法及兼容处理

document.getElementById('Id名');  // 所有浏览器 document.getElementsByTagName('标签名'); // 所有浏览器 document.getElementsByName('name'); // 所有浏览器 document.getElementsByClassName('类名');       // 除ie9以下,均支持 如需通过类名获取标签,并兼容所有浏览器,则需做兼容处理: 1 /* 2 * 功能: 通过类名获取一定范围内的标签数

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获取节点和编辑的方法

获取: 1.document.getElementById() 靠id获取节点 2.document.getElementsByClassName() 靠类名获取节点集(数组) 3.document.getElementsByTagName() 靠标签名获取节点集(数组) 4.document.createElement() 创建新的节点 5.document.querySelector() 靠CSS选择符获取节点 6.document.querySelectorAll() 靠CSS选择符获取节

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添加节点方法与JQuery添加节点方法的比较及总结

一.首先构建一个简单布局,来供下边讲解使用 1.HTML部分代码: <div id="div1">div1</div> <div id="div2">div2 <span id="span1">span1</span> <span id="span2">span2</span> </div> <div id="div

JS获取长度方法总结

length: length是JS原生的方法,用于获取元素的个数或者对象的长度,从1开始 //用于获取对象的长度,从1开始var length = $("#uw3c").length; size(): size()是jQuery中的方法,用来获取元素个数,从1开始. //用于获取对象的长度,从1开始var length = $("#uw3c").size(); length与size()的区别: 如果要是获取字符串长度的话,那么用那个都一样.如果要是获取元素个数,那