
jquery获取父元素方法比较多,比如parent(),parents(),closest(),find,first-child这些都能帮你实现查找父节点、子节点、兄弟节点。
$('#cur')parent()parent();或$('#cur')parent()parent('pp');或$('#cur')parent('pp');
jquery 兄弟节点的获取
<ul>
<li>
<h3 class="title">类目一</h3>
<ul>
<li>第一项</li>
<li>第二项</li>
</ul>
</li>
<li>
<h3 class="title">类目二</h3>
<ul>
<li>第一项</li>
<li>第二项</li>
</ul>
</li></ul>
比如要点击类目一所在的 h3,对其兄弟节点的 ul 添加一个叫做 "show" 的 class,代码如下:
$("title")click(function () { $(this)parent()find('ul')addClass('show'); });
就是通过先找到 h3 与 ul 共同的父节点 li 然后来用 find() 找到 ul,还有一种方法是使用 siblings() 函数,代码如下:
("title")click(function() { $(this)siblings('ul')addClass('show'); })
子节点怎么获得
$("#tbody1:first-child")
:first-child
匹配第一个子元素
':first' 只匹配一个元素,而此选择符将为每个父元素匹配一个子元素
可以使用jQuery的children方法来获取某个元素下的所有子元素。如果给定表示 DOM 元素集合的 jQuery 对象,children() 方法允许我们检索 DOM 树中的这些元素,并用匹配元素构造新的 jQuery 对象。find() 和 children() 方法类似,不过后者只沿着 DOM 树向下遍历单一层级。
工具原料:编辑器、浏览器
1、使用children方法可以获得选择器下的所有子元素,代码实例如下:
<!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、运行的结果是找到类名为 "selected" 的所有 div 的子元素,并将其设置为蓝色,结果如下:
jQuery的parent()方法可以获得当前匹配元素集合中每个元素的父元素,因此可以用以实现选择当前元素的父元素下的另一个子元素。下面给出实例演示:
1、创建Html元素
<div class="box">
<span>实例演示:获取当前点击li标签的父标签下类型为bb4的子标签</span><br>
<div class="content">
<ul>
<li class="bb1">哈哈,我是bb1</li>
<li class="bb2">click me</li>
<li class="bb3">哈哈,我是bb3</li>
<li class="bb4">哈哈,我是bb4</li>
</ul>
</div>
</div>
2、设置css样式
divbox{width:300px;padding:20px;margin:20px;border:4px dashed #ccc;}
divbox>span{color:#999;font-style:italic;}
divcontent{width:250px;margin:10px 0;padding:20px;border:2px solid #ff6666;}
li{margin:5px;list-style: none;}
3、编写jquery代码
$(function(){
$("li")click(function() {
alert($(this)parent()find("bb4")html());
});
});
4、观察效果:点击任一个li标签都将d出最后一个li标签的文字
jQuery 提供了 parent() 方法用以获取当前匹配元素集合中每个元素的父元素,例如:
$("span")parent(); // 获取所有span标签元素的父节点对象集合
$("selected")parent(); // 获取所有class位selected的元素的父节点对象集合
$(spanselected)parent(); // 获取class为selected的span标签元素的父节点对象集合
另外,注意与parents() 方法的区别——parents() 方法获取当前匹配元素集合中每个元素的祖先元素(祖先元素不仅包括父节点,还包括祖父、曾祖父等等)。
(1)$("#id",windowopenerdocument)val(赋值);
或者$("#id",windowopenerdocument)html(赋值)
(2)上述(1)中的id为父窗口元素的id,获得后可以给赋值用val方法或者html方法
(3)原生js可以这样写:
windowopenerdocumentgetElementById("id")value=赋值或者
windowopenerdocumentgetElementById('cname')innerHTML=赋值
var jCheckbox = jQuery('checkbox');//你的checkbox
var jTr=jCheckboxparent()parent();//即可
不知道你想获取什么jQuery很强大或者使用
var jTr=jCheckboxparents('tr');//所有父元素中选择tr
var jTr=jCheckboxclosest('tr');//只要最近的
取父窗口的元素方法:
$(selector, windowparentdocument);
那么你取父窗口的父窗口的元素就可以用:
$(selector, windowparentparentdocument);
类似的,取其它窗口的方法大同小异,
$(selector, windowtopdocument);
$(selector, windowopenerdocument);
$(selector, windowtopframes[0]document);
js:
父窗口:
1、<input type="text" name="currentProjectIDForDetail" id="currentProjectIDForDetail"
disabled
2、<input type="button"
onclick="windowopen('showDetailshtml','','toolsbar=no,menubar=no,resizable=yes,scrollb
ars=yes')" value="查看已有明细" id="showDetail" />
子窗口:
curproject = windowopenerdocumentgetElementById("currentProjectIDForDetail")value;
jQuery:
父窗口:
<input type="text" name="aa" id="aa" />
<input type="button"
onclick="windowopen('sonhtml','','toolsbar=no,menubar=no,resizable=yes,scrollbars=yes')
" value="send" />
子窗口:
<script>
$(function () {
temp=$("#aa",windowopenerdocument)val();
$("#bb")html(temp);
})
</script>
</head>
<body>
<div id="bb"></div>
以上就是关于用jquery怎么取父节点的兄弟节点的所有子节点全部的内容,包括:用jquery怎么取父节点的兄弟节点的所有子节点、jquery如何获取父元素的子元素、jquery 判断父元素下有多少个子元素等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!
欢迎分享,转载请注明来源:内存溢出
微信扫一扫
支付宝扫一扫
评论列表(0条)