在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. 在linux下,去除^M,将windows格式文件(dos文件)改为unix格式文件

    在Windows系统下编辑的文件,换行符回车的格式为'\r\n',在linux系统下,回车的格式为'\n',在Windows下编辑的文本文件在上传至linux服务器时,回车'\r\n'就显示成^M+' ...

  2. OpenJudge 兔子与樱花

    [题解] 求任意两点间的最短路径.此题数据量较小,用Floyd算法,时间复杂度为O(n^3). 参考https://blog.csdn.net/qq_34594236/article/details/ ...

  3. Elasticsearch的JavaAPI

    获取客户端对象 public class App { private TransportClient client; //获取客户端对象 @Before public void getClinet() ...

  4. Java 8- Java 分支结构 - if…else/switch

    Java 分支结构 - if...else/switch 顺序结构只能顺序执行,不能进行判断和选择,因此需要分支结构. Java有两种分支结构: if语句 switch语句 if语句 一个if语句包含 ...

  5. 小朋友学C语言(1):Hello World

    首先,需要一款C语言的编译器,可以使用在线编译器,也可以在本地安装编译器,比如Mac电脑可以安装Xcode,PC可以安装Dev C++. 若是第一次编写程序,建议使用在线编译器,推荐 菜鸟编译器 编写 ...

  6. Linux最大线程数限制及当前线程数查询

    常用配置 echo > /proc/sys/kernel/pid_max a) 当前环境生效 ulimit -d unlimited ulimit -m unlimited ulimit -s ...

  7. JVM总结-虚拟机加载类

    从 class 文件到内存中的类,按先后顺序需要经过加载.链接以及初始化三大步骤.其中,链接过程中同样需要验证:而内存中的类没有经过初始化,同样不能使用.那么,是否所有的 Java 类都需要经过这几步 ...

  8. 【Linux】【Jmeter】配置Jmeter服务器和运行Jmeter

    以前整理过Linux下的Jmeter知识,所以此处看可以参考以下链接: 参考链接:http://www.cnblogs.com/conquerorren/p/7880604.html [root@-- ...

  9. 怎么转化为LPCWSTR

    wstring a = L"hello ,中国"; LPCWSTR b; b =(LPCWSTR) a.c_str(); RemoveDirectory(b); C++中L和_T( ...

  10. 安装nodejs

    1.安装epel   是yum的一个软件源,里面包含了许多基本源里没有的软件. yum install epel-release  (需要root用户)     yum  是一个在Fedora和Red ...