siblings([expr])
得到所有匹配元素集合中各个元素的所有兄弟元素集合。返回匹配元素集合
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function(){
var len = $(".hilite").siblings()
.css("color", "red")
.length;
$("b").text(len);
});
</script>
<style>
ul { float:left; margin:5px; font-size:16px; font-weight:bold; }
p { color:blue; margin:10px 20px; font-size:16px; padding:5px;
font-weight:bolder; }
.hilite { background:yellow; }
</style>
</head>
<body>
<ul>
<li>One</li>
<li>Two</li>
<li class="hilite">Three</li>
<li>Four</li>
</ul>
<ul>
<li>Five</li>
<li>Six</li>
<li>Seven</li>
</ul>
<ul>
<li>Eight</li>
<li class="hilite">Nine</li>
<li>Ten</li>
<li class="hilite">Eleven</li>
</ul>
<p>Unique siblings: <b></b></p>
</body>
</html>
$(".hilite").siblings()
将得到包含特殊样式‘hilite’元素的所有兄弟元素集合。以下是匹配元素集合
<li>One</li>
<li>Two</li>
<li>Four</li>
<li>Eight</li>
<li class="hilite">Nine</li>
<li>Ten</li>
<li class="hilite">Eleven</li>
分享到:
相关推荐
通过对jquery遍历函数siblings()用法的介绍,以及结合实际的示例分析,我们可以看到如何利用这个函数来对页面元素的同级兄弟进行操作。对于使用jQuery进行前端开发的开发者来说,掌握此类函数能显著提高开发效率和...
- `siblings(expr)` - 获取元素的所有同级元素。 12. **核心方法**: - `$(html).appendTo(”body”)` - 将HTML字符串插入到body元素中。 - `$(elems)` - 创建一个jQuery对象,表示一组DOM元素。 - `$(function...
- `siblings(expr)` 获取同级元素。 4. **核心(Core)**: - `$(html).appendTo(”body”);` 在body中动态添加HTML。 - `$(elems)` 从DOM获取元素集合。 - `$(function(){……..});` 页面加载完成后执行匿名...
50. **DOM树遍历**:`siblings()`, `next()`, `prev()`等方法遍历元素的兄弟、前后节点。 以上50个jQuery经典实例展示了其强大的功能,无论你是前端新手还是经验丰富的开发者,都能从中学习到实用技巧,提升...
`filter(expression)`, `find(expr)`, `is(expr)`, `next(expr)`, `not(el)`, `not(expr)`, `not(elems)`, `parent(expr)`, `parents(expr)`, `prev(expr)`, `siblings(expr)` - 这些方法用于选择、过滤和遍历DOM...
- `$(元素).next(expr)`,`$(元素).prev(expr)`,`$(元素).siblings(expr)`:找到元素的相邻兄弟元素。 6. 核心功能 - `$()`:用于选择DOM元素,可以是HTML字符串、DOM元素或jQuery对象。 - `$(function(){……....
- `siblings(expr)` - **描述**:获取当前匹配元素集合的同级兄弟元素。 #### 核心功能 (Core) 1. **向页面中添加HTML**: - `$(html).appendTo("body")` - **描述**:将指定的HTML代码添加到页面的`<body>`...
- `next(expr)`, `prev(expr)`, `siblings(expr)`: 分别查找下一个、上一个或同级元素。 9. **父元素** - `parent(expr)`, `parents(expr)`: 查找当前元素的父元素或祖先元素。 #### 核心功能 (Core) 1. **...
- **siblings(expr)**: 获取所有具有相同父元素的兄弟元素。 ### Core 这部分涵盖了jQuery的核心功能。 - **$(html).appendTo(body)**: 将HTML字符串添加到页面body中。 - **$(elems)**: 创建一个新的jQuery对象...
jQuery 是一个广泛应用于 web 前端开发的 JavaScript 库,它简化了 HTML 文档遍历、事件处理、动画设计和Ajax交互等任务。本文主要介绍jQuery中的选择器属性及其相关方法,帮助初学者理解并掌握jQuery的核心知识。 ...
9. **jQuery.siblings()**: 与prevAll()和nextAll()结合,siblings()会查找所有兄弟元素,无论它们是在当前元素之前还是之后。 10. **jQuery.find(expr)**: find()方法从当前匹配的元素集合中查找匹配expr的后代...
- `siblings(expr)`: 获取元素的所有同级元素,可选地通过expr过滤。 5. **核心(Core)**: - `$(html).appendTo(”body”)`: 把HTML字符串插入到body中。 - `$(elems)`: 创建一个jQuery对象,包含给定的DOM...
- `siblings(expr)`:获取所有兄弟元素。 9. **查找父元素** - `parent(expr)`:获取匹配元素的父元素。 - `parents(expr)`:获取所有祖先元素直到文档根。 #### 四、Core核心功能 1. **在DOM中插入HTML** ...
- `siblings([expr])`:选取所有同级元素,但不包括自身。结合`nextAll()`和`prevAll()`的功能。 3. **串联(Chaining)** - `andSelf()`:将之前选择的元素合并到当前选择的元素集中。在链式操作中,这有助于在...
- `siblings(expr)`: 获取元素的所有同级元素。 4. **核心功能** - `$(html).appendTo(”body”)`: 动态创建并插入 HTML 到指定位置。 - `$(elems)`: 从 DOM 中选择元素。 - `$\(function(){……..});`: 在文档...
- `$(”元素名称”).siblings(expr)`: 获取元素的同级元素。 5. **核心功能**: - `$(html).appendTo(”body”)`: 将HTML字符串插入到body中。 - `$(elems)`: 从DOM元素创建JQuery对象。 - `$(function(){…})`...
- **jQuery(expr, context):** 该方法用于在指定的上下文中选择元素。`expr` 参数定义了要匹配的选择器字符串,而 `context` 参数指定了搜索的起点。 - **jQuery(html):** 创建一个新的 HTML 元素,并返回一个包含这...
如果需要查找特定的后代元素,可以使用`.find(expr)`,这不同于`.filter(expr)`,后者是在当前选择集中筛选元素。 总结来说,JavaScript和jQuery在处理DOM元素关系时有各自的特点。JavaScript原生方法虽然灵活,但...
12. **jQuery 筛选**:jQuery 的筛选不包括“自动”,其他如过滤(`filter()`, `not()`),查找(`find()`, `siblings()`, `parent()`),串联(`.add()`)都是常见的筛选操作。 13. **文档处理**:jQuery 提供包裹(`...