如何使用Jquery获取当前节点的孙节点
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了如何使用Jquery获取当前节点的孙节点相关的知识，希望对你有一定的参考价值。
参考技术A这些jquery的一些查找方法：可以看看
jQuery.parent(expr) //找父元素
jQuery.parents(expr) //找到所有祖先元素，不限于父元素
jQuery.children(expr) //查找所有子元素，只会找到直接的孩子节点，不会返回所有子孙
jQuery.contents() //查找下面的所有内容，包括节点和文本。
jQuery.prev() //查找上一个兄弟节点，不是所有的兄弟节点
jQuery.prevAll() //查找所有之前的兄弟节点
jQuery.next() //查找下一个兄弟节点，不是所有的兄弟节点
jQuery.nextAll() //查找所有之后的兄弟节点
jQuery.siblings() //查找兄弟节点，不分前后
jQuery.find(expr) //跟jQuery.filter(expr)完全不一样，jQuery.filter(expr)是从初始的
jQuery对象集合中筛选出一部分，而jQuery.find()的返回结果，不会有初始集中
筛选出一部分，而jQuery.find()的返回结果，不会有初始集合中的内容，比如：
$("p").find("span")是从元素开始找，等于$("p span")
$('当前节点的选择器').children().children();
jquery如何获取树勾选的所有子节点
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html>
<head>
<meta name="generator" content="HTML Tidy, see www.w3.org">
<meta http-equiv="Content-Type" content= "text/html; charset=UTF-8">
<title>jQuery EasyUI</title>
<link rel="stylesheet" type="text/css" href= "../themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href= "../themes/icon.css">
<script type="text/javascript" src="../jquery-1.4.4.min.js">
</script>
<script type="text/javascript" src="../jquery.easyui.min.js">
</script>
<script type="text/javascript">
$(function()
$(\'#tt2\').tree(
checkbox: true,
url: \'tree_data.json\',
onClick: function(node)
$(this).tree(\'toggle\', node.target);
//alert(\'you dbclick \'+node.text);
,
onContextMenu: function(e, node)
e.preventDefault();
$(\'#tt2\').tree(\'select\', node.target);
$(\'#mm\').menu(\'show\',
left: e.pageX,
top: e.pageY
);
);
);
function reload()
var node = $(\'#tt2\').tree(\'getSelected\');
if (node)
$(\'#tt2\').tree(\'reload\', node.target);
else
$(\'#tt2\').tree(\'reload\');
function getChildren()
var node = $(\'#tt2\').tree(\'getSelected\');
if (node)
var children = $(\'#tt2\').tree(\'getChildren\', node.target);
else
var children = $(\'#tt2\').tree(\'getChildren\');
var s = \'\';
for (var i = 0; i < children.length; i++)
s += children[i].text + \',\';
alert(s);
function getChecked()
var nodes = $(\'#tt2\').tree(\'getChecked\');
var s = \'\';
for (var i = 0; i < nodes.length; i++)
if (s != \'\')
s += \',\';
s += nodes[i].text;
alert(s);
function getSelected()
var node = $(\'#tt2\').tree(\'getSelected\');
alert(node.text);
function collapse()
var node = $(\'#tt2\').tree(\'getSelected\');
$(\'#tt2\').tree(\'collapse\', node.target);
function expand()
var node = $(\'#tt2\').tree(\'getSelected\');
$(\'#tt2\').tree(\'expand\', node.target);
function collapseAll()
var node = $(\'#tt2\').tree(\'getSelected\');
if (node)
$(\'#tt2\').tree(\'collapseAll\', node.target);
else
$(\'#tt2\').tree(\'collapseAll\');
function expandAll()
var node = $(\'#tt2\').tree(\'getSelected\');
if (node)
$(\'#tt2\').tree(\'expandAll\', node.target);
else
$(\'#tt2\').tree(\'expandAll\');
function append()
var node = $(\'#tt2\').tree(\'getSelected\');
$(\'#tt2\').tree(\'append\',
parent: (node ? node.target : null),
data: [
text: \'new1\',
checked: true
,
text: \'new2\',
state: \'closed\',
children: [
text: \'subnew1\'
,
text: \'subnew2\'
]
]
);
function remove()
var node = $(\'#tt2\').tree(\'getSelected\');
$(\'#tt2\').tree(\'remove\', node.target);
function update()
var node = $(\'#tt2\').tree(\'getSelected\');
if (node)
node.text = \'<span style="font-weight:bold">new text<\\/span>\';
node.iconCls = \'icon-save\';
$(\'#tt2\').tree(\'update\', node);
function isLeaf()
var node = $(\'#tt2\').tree(\'getSelected\');
var b = $(\'#tt2\').tree(\'isLeaf\', node.target);
alert(b)
function GetNode(type)
var node = $(\'#tt2\').tree(\'getChecked\');
var chilenodes = \'\';
var parantsnodes = \'\';
var prevNode = \'\';
for (var i = 0; i < node.length; i++)
if ($(\'#tt2\').tree(\'isLeaf\', node[i].target))
chilenodes += node[i].text + \',\';
var pnode = $(\'#tt2\').tree(\'getParent\', node[i].target);
if (prevNode != pnode.text)
parantsnodes += pnode.text + \',\';
prevNode = pnode.text;
chilenodes = chilenodes.substring(0, chilenodes.length - 1);
parantsnodes = parantsnodes.substring(0, parantsnodes.length - 1);
if (type == \'child\')
return chilenodes;
else
return parantsnodes
;
;
function getNodes()
alert(GetNode(\'fnode\') + "," + GetNode(\'child\'));
function doNode()
var c="";
var p="";
$(".tree-checkbox1").parent().children(\'.tree-title\').each(function()
c+=$(this).parent().attr(\'node-id\')+",";
);
$(".tree-checkbox2").parent().children(\'.tree-title\').each(function()
p+=$(this).parent().attr(\'node-id\')+",";
);
var str=(c+p);
str=str.substring(0,str.length-1);
alert(str);
</script>
</head>
<body>
<h1>Tree</h1>
<p>
Create from HTML markup
</p>
<ul id="tt1" class="easyui-tree" animate="true" dnd="true">
<li>
<span>Folder</span>
<ul>
<li state="closed">
<span>Sub Folder 1</span>
<ul>
<li>
<span><a href="#">File
11</a></span>
</li>
<li>
<span>File 12</span>
</li>
<li>
<span>File 13</span>
</li>
</ul>
</li>
<li>
<span>File 2</span>
</li>
<li>
<span>File 3</span>
</li>
<li>
File 4
</li>
<li>
File 5
</li>
</ul>
</li>
<li>
<span>File21</span>
</li>
</ul>
<hr>
<p>
Create from JSON data
</p>
<div style="margin:10px;">
<a href="#" onclick="reload()">reload</a>
<a href="#" onclick="getChildren()">getChildren</a>
<a href="#" onclick="getChecked()">getChecked</a>
<a href="#" onclick="getSelected()">getSelected</a>
<a href="#" onclick="collapse()">collapse</a>
<a href="#" onclick="expand()">expand</a>
<a href="#" onclick="collapseAll()">collapseAll</a>
<a href="#" onclick="expandAll()">expandAll</a>
<a href="#" onclick="append()">append</a>
<a href="#" onclick="remove()">remove</a>
<a href="#" onclick="update()">update</a>
<a href="#" onclick="isLeaf()">isLeaf</a>
<a href="#" onclick="getNodes()">getNodes</a>
<a href="#" onclick="doNode()">获取所有checkbox选中节点id</a>
</div>
<ul id="tt2">
</ul>
<div id="mm" class="easyui-menu" style="width:120px;">
<div onclick="append()" iconcls="icon-add">
Append
</div>
<div onclick="remove()" iconcls="icon-remove">
Remove
</div>
<div onclick="expand()">
Expand
</div>
<div onclick="collapse()">
Collapse
</div>
</div>
</body>
</html> 参考技术A 你的树是怎么样的啊
以上是关于如何使用Jquery获取当前节点的孙节点的主要内容，如果未能解决你的问题，请参考以下文章
js jquery获取当前元素的兄弟级 上一个 下一个元素 jquery如何获取第一个或最后一个子元素