首先我们来介绍一下DOM中元素与节点间的关系：页面中所有内容都是节点[包括元素，属性，文本]，所以节点是包括元素的。
以下是节点的三个属性：
若是火狐和chrome浏览器上述方法不存在兼容问题，而若是在IE8浏览器中后四组内容只能获取元素，无法获取文本或属性。即原获取节点方法-->取元素；原获取元素方法-->undefined。
jQuery中是以方法的形式进行调用，同时都是用来获取元素：
这些jquery的一些查找方法：可以看看
jQueryparent(expr) //找父元素
jQueryparents(expr) //找到所有祖先元素，不限于父元素
jQuerychildren(expr) //查找所有子元素，只会找到直接的孩子节点，不会返回所有子孙
jQuerycontents() //查找下面的所有内容，包括节点和文本。
jQueryprev() //查找上一个兄弟节点，不是所有的兄弟节点
jQueryprevAll() //查找所有之前的兄弟节点
jQuerynext() //查找下一个兄弟节点，不是所有的兄弟节点
jQuerynextAll() //查找所有之后的兄弟节点
jQuerysiblings() //查找兄弟节点，不分前后
jQueryfind(expr) //跟jQueryfilter(expr)完全不一样，jQueryfilter(expr)是从初始的
jQuery对象集合中筛选出一部分，而jQueryfind()的返回结果，不会有初始集中
筛选出一部分，而jQueryfind()的返回结果，不会有初始集合中的内容，比如：
$("p")find("span")是从元素开始找，等于$("p span")
JQuery提供以下两个方法可以读取节点中的内容：
text() - 设置或返回所选元素的文本内容
html() - 设置或返回所选元素的内容（包括 HTML 标记）
注意二者在获取内容上的区别，实例演示如下:
1、HTML结构
<div id="test"><i>示例文字</i></div><input type="button" id="btn1" value="获取text">
<input type="button" id="btn2" value="获取html">
2、jquery代码
$(function(){$("#btn1")click(function() {
alert($("#test")text());
});
$("#btn2")click(function() {
alert($("#test")html());
});
});
3、效果演示
JQUERY里的next()是下一节点的的意思
你的$("p")在HTML里有两个，所以得出来的结果是分别输出两次：
第一个<P> 输出 :<p>Hello Again</p>,
第二个<p>输出 :<div><span>And Again</span></div>
别外next()也可能这样 $("p")next("div")，指<p>的下一个DIV，那么就输出:<div><span>And Again</span></div> ,不过你HTML里有两个<p>那就输出两次这东西了
如果顺序不变你可以使用prev()寻找目标的前一个同辈节点，如果你只知道2这相邻可以这样写
var target=jQuery(this)prev("scd")length>0jQuery(this)prev("scd"):jQuery(this)next("scd");target就是获取fir相邻的同辈节点
本文实例讲述了jQuery查找节点方法。分享给大家供大家参考，具体如下：
<html>
<head>
<meta
>
jquery中css() 方法可以设置或返回被选元素的一个或多个样式属性，下面的例子将返回首个匹配元素的 background-color 值：
$("p")css("background-color");父级的同级元素的子标签的css样式如下：
//eq(0)表示选择匹配到多个元素中的第一个$("target")parent()siblings()eq(0)children()eq(0)
以上就是关于原生JS与jQuery获取节点的方法全部的内容，包括:原生JS与jQuery获取节点的方法、如何使用Jquery获取当前节点的孙节点、JQuery如何读取节点中的内容等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）