jquery获得当前节点的兄弟节点

例如有这样的HTML结构

<ul>
<li>
<h3 class="title">标题1</h3>
<ul>
<li>项目1</li>
<li>项目2</li>
</ul>
</li>
<li>
<h3 class="title">标题2</h3>
<ul>
<li>项目1</li>
<li>项目2</li>
</ul>
</li>
</ul>

需要点击h3,对其兄弟节点ul进行相关操作:

$(".title").click(function () { $(this).parent().find('ul').addClass('show'); });

就是先返回其父节点,然后再在其子节点搜索ul,返回jQuery对象,可以使用jQuery的各种方法进行操作。这种方式会对所以符合要求的子节点进行操作,需要查某一个,可以选择搜索class。

<ul>
	<li>
		<h3 class="title">标题1</h3>
		<ul class="x2">
			<li>项目1</li>
			<li>项目2</li>
		</ul>
		<ul>
			<li>项目4</li>
			<li>项目5</li>
		</ul>
		<ul>
			<li>项目6</li>
			<li>项目7</li>
		</ul>
		<ul>
			<li>项目8</li>
			<li>项目9</li>
		</ul>
	</li>
	<li>
		<h3 class="title">标题1</h3>
		<ul>
			<li>项目11</li>
			<li>项目12</li>
		</ul>
		<ul>
			<li>项目12</li>
			<li>项目14</li>
		</ul>
		<ul>
			<li>项目15</li>
			<li>项目16</li>
		</ul>
		<ul>
			<li>项目17</li>
			<li>项目18</li>
		</ul>
	</li>
</ul>
$(".title").click(function () { $(this).parent().find('.x2').addClass('show'); });

半途不废学JavaScript,或许对你有用。

此条目发表在 JavaScript 分类目录,贴了 标签。将固定链接加入收藏夹。

发表评论

电子邮件地址不会被公开。 必填项已用 * 标注

*

您可以使用这些 HTML 标签和属性: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre lang="" line="" escaped="" highlight="">