jquery 遍历 siblings([expr])

最新推荐文章于 2020-05-27 13:28:45 发布
最新推荐文章于 2020-05-27 13:28:45 发布
阅读量192 收藏
点赞数
分类专栏： jQuery 文章标签： jQuery CSS HTML ViewUI

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>

iteye_2604
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
html中siblings方法,jQuery使用siblings获取某元素所有同辈(兄弟姐妹)元素用法示例...
weixin_42415059的博客
06-28 1428
jQuery使用siblings获取某元素所有同辈(兄弟姐妹)元素用法示例本文实例讲述了jQuery使用siblings获取某元素所有同辈(兄弟姐妹)元素用法。分享给大家供大家参考，具体如下：siblings()属于jQuery筛选类的API，用来查找某个元素的所有同辈元素(所有兄弟姐妹)。假如需要实现如下功能：点击某个按钮的时候，该按钮背景色变成#88b828，其他按钮背景色变成#15b494。...
jQuery siblings()用法与实例。
weixin_30367543的博客
04-25 922
jQuery 的遍历方法siblings() $("给定元素").siblings(".selected") 其作用是筛选给定的同胞同类元素（不包括给定元素本身） 例子：网页选项栏 当点击任意一个选项卡是，其他2个选项卡就会改变样式，其内容也会隐藏。 下面是html代码。 <body> <ul id="menu"> ...
siblings() 获得匹配集合中每个元素的同胞，通过选择器进行筛选是可选的。
weixin_30797027的博客
10-21 595
如果给定一个表示 DOM 元素集合的 jQuery 对象，.siblings() 方法允许我们在 DOM 树中搜索这些元素的同胞元素，并用匹配元素构造一个新的 jQuery 对象。 该方法接受可选的选择器表达式，与我们向 $() 函数中传递的参数类型相同。如果应用这个选择器，则将通过检测元素是否匹配该选择器对元素进行筛选。 请思考这个带有基本的嵌套列表的页面： <ul> ...
siblings ---选择兄弟集合(标签相同)
维克多噗噗的博客
04-14 1190
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="Author" content=" "> <title>Document</title> <style type="text/css"> *{margin: 0;padding: 0;}
jquery遍历函数siblings()
我的IT世界
05-09 9505
siblings([expr])得到所有匹配元素集合中各个元素的所有兄弟元素集合。返回匹配元素集合Html代码 <a title="复制代码" onclick="function onclick(){dp.sh.Toolbar.CopyToClipboard(this);return false;}" href="#">                 
jQuery遍历siblings()
qq_43742368的博客
05-27 165
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-type" content="text/html; charset=utf-8" /> <title></title> <script src="../jquery-1.10.2.min.js"></script> <script type="text/javas
jQuery遍历之siblings()
qq_37036642的博客
08-04 248
jQuery是一个合集对象，如果想快速查找指定元素集合中每一个元素的同辈元素，此时可以用siblings()方法 理解节点查找关系： 如下蓝色的class="item-2"的li元素，红色的节点就是它的siblings兄弟节点 1 2 3 siblings()无参数 取得一个包含匹配的元素集合中每一个元素的同辈元素的元素集合 注意
jquery函数大全
07-02
- `siblings(expr)` 获取同级元素。 4. **核心（Core）**： - `$(html).appendTo(”body”);` 在body中动态添加HTML。 - `$(elems)` 从DOM获取元素集合。 - `$(function(){……..});` 页面加载完成后执行匿名...
jQuery对象属性.docx
05-28
jQuery 是一个广泛应用于 web 前端开发的 JavaScript 库，它简化了 HTML 文档遍历、事件处理、动画设计和Ajax交互等任务。本文主要介绍jQuery中的选择器属性及其相关方法，帮助初学者理解并掌握jQuery的核心知识。 ...
jquery的父、子、兄弟节点查找,节点的子节点循环方法
10-20
9. **jQuery.siblings()**: 与prevAll()和nextAll()结合，siblings()会查找所有兄弟元素，无论它们是在当前元素之前还是之后。 10. **jQuery.find(expr)**: find()方法从当前匹配的元素集合中查找匹配expr的后代...
Jquery文档
08-18
- `siblings([expr])`：选取所有同级元素，但不包括自身。结合`nextAll()`和`prevAll()`的功能。 3. **串联（Chaining）** - `andSelf()`：将之前选择的元素合并到当前选择的元素集中。在链式操作中，这有助于在...
课题-js和jquery获取父级元素、子级元素、兄弟元素的方法.pdf
11-11
如果需要查找特定的后代元素，可以使用`.find(expr)`，这不同于`.filter(expr)`，后者是在当前选择集中筛选元素。 总结来说，JavaScript和jQuery在处理DOM元素关系时有各自的特点。JavaScript原生方法虽然灵活，但...
jQuery(查询方法)——children()和siblings()方法的理解
lchyz89的专栏
07-10 2618
jQuery(查询方法)——children()和siblings()方法的理解        children()——此方法会获取到所有的直接子元素。而不会向下遍历。         siblings()——此方法会获取到所有的兄弟元素，而不仅仅是同种元素的兄弟元素     -->                   $(document).ready(function(){
使用 React 和 Redux 进行井字游戏并附带源代码.zip
最新发布
07-24
项目：使用 React 和 Redux 进行井字游戏并附带源代码 使用 react 和 redux 的井字游戏是一个简单的 react 项目。整个项目都是使用 react components 和redux制作的。游戏很简单，玩法也很多。要运行此项目，您必须先安装 NodeJS。 关于项目 井字游戏反应而 redux 是使用ReactJS开发的。说到这个游戏，它具有高级功能和游戏玩法。要运行此项目，首先，您必须安装费用到您的系统。然后运行npm安装然后开始运行npm开始。游戏启动后，您可以选择不同的游戏选项。您还可以选择所需的网格框数量。此外，您还可以选择对手的类型。 要运行此项目，您需要 在计算机上安装NodeJS 并使用现代浏览器，例如 Google Chrome、  Mozilla Firefox。 演示： 该项目为国外大神项目，可以作为毕业设计的项目，也可以作为大作业项目，不用担心代码重复，设计重复等，如果需要对项目进行修改，需要具备一定基础知识。 注意：如果装有360等杀毒软件，可能会出现误报的情况，源码本身并无病毒，使用源码时可以关闭360，或者添加信任。
使用 JavaScript 编写的专注力游戏（附源代码）.zip
07-24
项目：JavaScript 中的专注力游戏（附源代码） 专注力游戏是一个使用 JavaScript、CSS 和 HTML 开发的简单项目。这款游戏很有趣。玩家必须点击移动的框并获得分数。要点击正确的位置，玩家需要在这个游戏中集中注意力。这款游戏可以帮助玩家练习以进一步增强他们的专注力。 游戏制作 这个游戏项目仅使用 HTML、CSS 和 JavaScript。说到这个游戏的特点，用户必须单击移动框并得分。游戏有三种模式：简单、中等和困难。游戏的 PC 控制非常简单。您只需使用光标单击移动框的碎片即可。 该游戏包含大量的 javascript 以确保游戏正常运行。 如何运行该项目？ 要运行此游戏，您不需要任何类型的本地服务器，但需要浏览器。我们建议您使用现代浏览器，如 Google Chrome 和 Mozilla Firefox。要玩游戏，首先，单击 index.html 文件在浏览器中打开游戏。 演示： 该项目为国外大神项目，可以作为毕业设计的项目，也可以作为大作业项目，不用担心代码重复，设计重复等，如果需要对项目进行修改，需要具备一定基础知识。 注意：如果装有360等杀毒软件，可能会出现误报的情况，源码本身并无病毒，使用源码时可以关闭360，或者添加信任。
人脸识别方案资料61EDA-C1590.zip
07-24
人脸识别方案资料61EDA_C1590.zip
316、基于DK124设计的离线式开关电源设计12V 2A（原理图、PCB图、BOM表、设计说明）
07-24
316、基于DK124设计的离线式开关电源设计12V 2A（原理图、PCB图、BOM表、设计说明） 该设计为DK124控制的开关电源，实现12V 2A输出； 功能： 1、使用DK124核心控制； 2、反激式开关电源拓扑设计； 3、实现12V 2A输出； 4、市电输入； 5、整流、滤波、变压器等电路； 6、原理图、PCB图、BOM表、设计说明；
基于Springboot和Vue的生鲜超市管理的设计与实现源码 生鲜超市管理的设计与实现代码（优秀毕业设计）
07-24
生鲜超市管理的设计与实现源码（高分毕设），个人经导师指导并认可通过的98分毕业设计项目，主要针对计算机相关专业的正在做毕设的学生和需要项目实战练习的学习者。也可作为课程设计、期末大作业。包含全部项目源码[代码]、该项目可以直接作为毕设使用。项目技术栈：前端是vue，后端是springboot，项目代码都经过严格调试，代码没有任何bug！ 系统源码（高分毕设），个人经导师指导并认可通过的98分毕业设计项目，主要针对计算机相关专业的正在做毕设的学生和需要项目实战练习的学习者。也可作为课程设计、期末大作业。包含全部项目源码[代码]、该项目可以直接作为毕设使用。项目技术栈：前端是vue，后端是springboot，项目代码都经过严格调试，代码没有任何bug！ 系统源码（高分毕设），个人经导师指导并认可通过的98分毕业设计项目，主要针对计算机相关专业的正在做毕设的学生和需要项目实战练习的学习者。也可作为课程设计、期末大作业。包含全部项目源码[代码]、该项目可以直接作为毕设使用。项目技术栈：前端是vue，后端是springboot，项目代码都经过严格调试，代码没有任何bug！
jquery遍历节点
06-13
在jQuery中，遍历节点主要通过选择器（selectors）来选取HTML元素，并提供一系列的方法来操作这些元素。这里有几个常见的方法： 1. `$(selector)`：选择匹配指定CSS选择器的元素。 2. `.each(function(index, ...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值