
Jquery获取子元素的方法有2种,分别是children()方法和find()方法。下面我们分别来使用这两种方法,看看它们有何差异。
children()方法:获取该元素下的直接子集元素
find()方法:获取该元素下的所有子集元素
分别以以下HTML代码为例:<ul><li>list1<ul><li>list1-1</li><li>list1-2</li></ul></li><li>list2<ul><li>list2-1</li><li>list2-2</li></ul></li><li>list3<ul><li>list3-1</li><li>list3-2</li></ul></li></ul>
children()方法获取ul下面直接子集元素li:$("ul")children("li")
需要注意的是,如果li元素下还有li元素,children方法将不会被获取。我们可以用length来测试获取的个数“$("ul")children("li")length”,最后输出结果为3
find()方法获取ul下所有元素li:$("ul")find("li")
需要注意的是,find方法会无限循环查找ul标签节点下的li,一直找到没有为止,用length来测试获取个数“$("ul")find("li")length”,最后输出结果为9
children和find的区别:children只会查找直接子集,而find会跨越层级查找,一直找到没有为止。
直接通过<a id = "displayDelete" class="aDelete" onclick="Delete(this);" href="JavaScript:void(0);">Delete</a>中的ID号来找不就行了吗
$("#displayDelete")
而且你要在什么地方用?如果是 Delete(this) 函数中用的话 你的 this指针已经将该元素通过形参的方式传递到了函数Delete中啊
function Delete(element){
//这个时候通过下面这个就可以调用到上面这段 并且可以是用jQuery方法
$(element);
}
<div id="div1">
<p id="p1">这是一个段落。</p>
<p id="p2">这是另一个段落。</p>
</div>
<script>
var para=documentcreateElement("p");
var node=documentcreateTextNode("这是一个新段落。");
paraappendChild(node);
var element=documentgetElementById("div1");
elementappendChild(para);
</script>
这段代码创建新的<p> 元素:
var para=documentcreateElement("p");
如需向 <p> 元素添加文本,您必须首先创建文本节点。这段代码创建了一个文本节点:
var node=documentcreateTextNode("这是一个新段落。");
然后您必须向 <p> 元素追加这个文本节点:
paraappendChild(node);
最后您必须向一个已有的元素追加这个新元素。
这段代码找到一个已有的元素:
var element=documentgetElementById("div1");
以下代码在已存在的元素后添加新元素:
elementappendChild(para);
在获取到父节点的情况下 var parentNode =
多次执行parentNodeappendChild(已经创建好的子节点);即可多次添加子节点
$get("xml文件",function(data){
var id=$(date)find("app:eq(1)")find("addid")text();
});
jquery中获取当前dom元素的子元素的方法有很多,常见的方法是使用children()方法或者fand()方法都是可以获取到某个元素的子元素的,children() 方法返回匹配元素集合中每个元素的子元素,find()方法获得当前元素集合中每个元素的后代,通过选择器、jQuery 对象或元素来筛选。
工具原料:jQuery、编辑器、浏览器
一、使用children()方法获得子元素
1、使用该方法获取子元素并设置子元素的字体为蓝色,代码如下:
<!DOCTYPE html><html>
<head>
<script type="text/javascript" src="/jquery/jqueryjs"></script>
<style>
body { font-size:16px; font-weight:bolder; }
p { margin:5px 0; }
</style>
</head>
<body>
<div>
<span>Hello</span>
<p class="selected">Hello Again</p>
<div class="selected">And Again</div>
<p>And One Last Time</p>
</div>
<script>$("div")children("selected")css("color", "blue");</script>
</body>
</html>
2、运行的效果如下图:
二、使用find()方法获取子元素
1、使用fand()方法获取子元素并且进行选择器的筛选,代码如下图:
<!DOCTYPE html><html>
<head>
<script type="text/javascript" src="/jquery/jqueryjs"></script>
</head>
<body>
<p><span>Hello</span>, how are you</p>
<p>Me I'm <span>good</span></p>
<script>
$("p")find("span")css('color','red');
</script>
</body>
</html>
2、运行的结果如下图:
以上就是关于jquery如何获取没有子节点的元素全部的内容,包括:jquery如何获取没有子节点的元素、jquery中的一个查找子节点属性的问题、怎么运用js或jquery,在已经获取父节点的情况下可以多次增加该节点的子节点等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!
欢迎分享,转载请注明来源:内存溢出
微信扫一扫
支付宝扫一扫
评论列表(0条)