在JavaScript中，如果需求对多个元素重复进行同样的操作，就需要写一个循环来遍历选中的所有元素。

在jQuery中，当选择器返回了多个元素时，可以使用一个方法来更新所有的元素，不再需要使用循环。

示例：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>理解选取更新范围</title>
        <script src="https://ajax.aspnetcdn.com/ajax/jquery/jquery-3.3.1.min.js"></script>
        <style>
            .box{
                border: 1px solid blueviolet;
                padding: 1px;
                margin-bottom: 12px;
            }
        </style>
    </head>
    <body>     
        <div>
            <ul id="ul">
                <li id="a">油条</li>
                <li id="b">包子</li>
                <li id="c">米饺</li>
                <li id="d"><a>鱼粉</a></li>
            </ul>
        </div>
        <script>
            $('li').attr("class", "box");
        </script>
    </body>
</html>

遍历DOM树，理解更新范围的更多相关文章

  1. 函数遍历DOM树

    //获取页面中的根节点--根标签   var root=document.documentElement;//html   //函数遍历DOM树   //根据根节点,调用fn的函数,显示的是根节点的名 ...

  2. 先序遍历DOM树的5种方法

    DOM树由文档中的所有节点(元素节点.文本节点.注释节点等)所构成的一个树结构,DOM树的解析和构建是浏览器要实现的关键功能.既然DOM树是一个树结构,那么我们就可以使用遍历树结构的相关方法来对DOM ...

  3. jQuery向上遍历DOM树之parents(),parent(),closest()之间的区别

    http://www.poluoluo.com/jzxy/201312/253059.html 在这个sprint中,因为要写前端UI,所以用到了jQuery,但是jQuery在向上遍历DOM树的AP ...

  4. 拷贝和遍历DOM树

    一.浅拷贝: 拷贝就是复制,就相当于把一个对象中的所有内容,复制一份给另一个对象,直接复制, 或者说,就是把一个对象的地址给了另外一个对象,他们的指向相同,两个对象之间有相同的属性或者方法,都可以使用 ...

  5. JS高级---遍历DOM树

    遍历DOM树  第一个函数: 给我根节点, 我会找到所有的子节点: forDOM(根节点)  获取这个根节点的子节点  var children=根节点的.children  调用第二个函数  第二个 ...

  6. 遍历DOM树

    遍历DOM在jQuery中是非常重要的技术. 遍历DOM之前,需要对DOM有清晰的认识,了解文档节点.元素节点.属性节点.文本节点等相关概念.不清楚可以温习下<JavaScript教程.DOM树 ...

  7. 遍历DOM树，each()遍历

    在<jQuery教程/理解选取更新范围>一节中,我们知道:当选择器返回了多个元素时,可以使用一个方法来更新所有的元素,不再需要使用循环. 然后有的时候需要遍历元素,怎么办? 使用each( ...

  8. JavaScript 算法应用: 遍历DOM树的两种方式

    1 常见的DOM树结构: 2  DOM数遍历有两种方式: 3 广度优先代码: 4 深度优先遍历代码

  9. 遍历DOM树，链式操作

    如果需要在同一个选取结果上使用多个jQuery方法,可以同时列出这些方法,并用.隔开,如下面的代码. 1 $("#one").hide().delay(500).fadeIn(15 ...

随机推荐

  1. SCCM2012 R2实战系列之七：软件分发（exe）

    在上一章节中,我们完成了SCCM 2012客户端代理软件的安装,现在就可以为客户端来部署应用程序了. SCCM2012增加了应用程序分发,同时保留了SCCM 2007里的包分发.应用程序分发可以直接对 ...

  2. String，StringBuilder和StringBuffer区别

    String字符串常量 StringBuilder 字符串变量(非线程安全) StringBuffer  字符串变量(线程安全) 1.String String是字符串常量,为不可改变对象 Strin ...

  3. 注册ActiveX控件

    简单了解一下ActiveX控件的知识,ActiveX控件:简单来说,就是利用封装性的原理,把一些功能封装起来,我们可以再其他程序中使用,进而达到方便的目的.但是要注意ActiveX控件必须要注册后才可 ...

  4. centos7 安装后静态ip的配置

    centos7 想到于centos6.5来说界面上看起来更加炫一点,但是在配置静态ip上来说是差不多的 首先看一下centos7的安装界面,相对来说简洁好看一些 先打开终端 可以看到centos7默认 ...

  5. C# 运用反射把实体类反射成你所想要的格式

    下面是要转换成的Xml格式 <?xml version="1.0" encoding="UTF-8" ?> <NDEML templateVe ...

  6. Bootstrap如何关闭弹窗

    1.layer.closeAll()无法关闭弹窗的解决办法 使可以使用:parent.layer.closeAll() 2.layer.close()或者layer.closeAll()失效的情况下强 ...

  7. 输入框占位符placeholder

    占位符placeholder的益处不用多说,但是很不幸的是,在IE8之前的浏览器里是无法实现placeholder这一属性的,所以在需要兼容IE8之前的浏览器的情况下,我们不得不想办法模拟实现plac ...

  8. nodejs学习笔记<七> 路由

    // 引用模块(与C#中命名空间,Java中引用包同理) var http = require("http"); var path = require("path&quo ...

  9. IDEA 快捷操作 Windows

    1.查找Action  ctrl+shift+A :可通过其查询其他操作快捷键等. 2.项目之间跳转:ctrl+shift+[ 与  ctrl+shift+] 3.alt + 数字 展开对应窗口 4. ...

  10. ROS进阶学习笔记（10）- 搭建自己的Turtlebot(5) - Interactive Makers

    用interactive_makers控制Turtlebot移动 interactive_makers 是Willow Garage公司开发的一个虚拟控制工具,可通过鼠标在虚拟环境中的操作,完成实际机 ...