学习笔记，记录下学习中遇到的问题。

使用jQuery中的prevAll可以查找当前元素之前所有的同辈元素，但是却存在一个问题：得到的同辈元素的为正常顺序的反方向。

举个例子：

<!doctype html>

<html>

<head>

<meta charset="utf-8">

<title>无标题文档</title>

    <script type="text/javascript" src="jquery-1.12.3.js"></script>

    <script>

        $(function(){

            var test=$("#li5").prevAll();

            console.log(test.length);

            test.each(function(){

                console.log($(this).html());

            })

        })

    </script>

</head>

<body>

    <ul id="ul1">

        <li id="li1">li_1</li>

        <li id="li2">li_2</li>

        <li id="li3">li_3</li>

        <li id="li4">li_4</li>

        <li id="li5">li_5</li>

    </ul>

</body>

</html>

运行如上代码，会得到如下输出顺序：

很明显，得到的同辈元素与原顺序相比是相反的。

jQuery中prevAll得到的DOM元素顺序问题的更多相关文章

  1. 使用jQuery匹配文档中所有的li元素，返回一个jQuery对象，然后通过数组下标的方式读取jQuery集合中第1个DOM元素，此时返回的是DOM对象，然后调用DOM属性innerHTML,读取该元素 包含的文本信息

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  2. jQuery支持移动Mobile的DOM元素移动和缩放插件

    jQuery Panzoom是一款很有用的HTML DOM元素平移和缩放jQuery和CSS3插件. Panzoom利用CSS transforms 和 matrix函数来为浏览器进行硬件(GPU)加 ...

  3. jquery学习笔记(二)：DOM元素操作

    内容来自[汇智网]jquery学习课程 2.1 元素属性操作 1.获取元素的属性 语法:attr(name) 参数name表示属性的名称 2.设置元素的属性 单个属性设置语法:attr(key,val ...

  4. jquery中为动态增加的元素添加事件

    // html代码 <ul id="main"> </ul> // js代码 $(function(){ // 动态添加html代码 $("#ma ...

  5. 浅谈jQuery中的eq()与DOM中element.[]的区别

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  6. jquery给动态添加的dom元素绑定事件

    $('input').click(function () { //处理代码 }); 这只能是对已经加载好的元素定义事件,那些后来添加插入的元素则需要另行绑定,对于页面中动态添加的元素,在页面加载完成后 ...

  7. vue中mounted中无法获取到dom元素

    一.解决方案: 加上异步setTimeout,延迟获取dom的代码的执行 mounted() { // debugger this.$nextTick(()=> { setTimeout(()= ...

  8. jQuery 中 on 方法-----给未来元素添加事件

    <li class='clear dir-li'> <div class='left title'> 添加到目录:</div> <div class='lef ...

  9. jquery中，使用append增加元素时，该元素的绑定监听事件失效

    举例:如果在一个<div id="resultArea"></div>中,通过append添加一个id="checkOutTip"的文本 ...

随机推荐

  1. 解决Idea配置文件不显示中文的问题

    1.首先我们的IDEA文件编码一般都修改为utf-8(setting-->file encodings--->Global Encoding 和 Project Encoding 都设置为 ...

  2. 小米Note 10 Lite海外发布 无缘中国市场

    [TechWeb]5月1日消息,昨日晚间,小米Note 10 Lite在海外亮相.小米市场部副总经理臧智渊在微博透露,小米Note 10 Lite 6GB+64GB版售价349欧元(约合人民币2700 ...

  3. 自动获取时间html代码

    <button type="button" onclick="document.getElementById('demo').innerHTML = Date()& ...

  4. C6 C7的开机启动流程

    C6开机启动流程 1.内核引导,加电自检(通电后检查内核):检查bios的配置,检测硬件 装好系统之后才会进行以下内容 MBR 引导 (3.2.1...) GRUB菜单 (选择不同的系统)(按e,进入 ...

  5. Jenkins 部署（基于 Linux）

    1.安装 JDK  我不列出来了,自行百度 java -version 2.安装 tomcat (1)创建目录 tomcat8 (2)导入 tomcat 文件到 tomcat8 录中并解压 (3)启动 ...

  6. Centos7.x 装机优化

    Linux 服务器装机后优化 参考 https://blog.csdn.net/u010133338/article/details/81055475 优化初始化脚本 vim init_optimiz ...

  7. MySQL 中 on与where筛选条件的区别

    在两张表连接的时候才会有on的筛选条件,那么on和where的区别是什么呢? 在inner join中是没有区别的,但是在左连接和右连接中,区别就体现出来了,下面以左连接为例: 1.用on的时候,只对 ...

  8. Jmeter简单压测之服务器监控

    此篇为最近工作需要到内容,故现在做一个总结. 最近家里电脑坏了,等待会公司空闲在编写. 文章构思中,敬请期待.......

  9. Git 中 “fatal: Not a valid object name: 'master'.”

    报错: fatal: Not a valid object name: 'master'. 问题主要是,master并不合法,也就是没有 git commit -m "" 提交一个 ...

  10. 王颖奇 20171010129《面向对象程序设计（java）》第十三周学习总结

      实验十三  图形界面事件处理技术 实验时间 2018-11-22 1.实验目的与要求 (1) 掌握事件处理的基本原理,理解其用途: (2) 掌握AWT事件模型的工作机制: (3) 掌握事件处理的基 ...