jquery选择器排除某个DOM元素的方法(实例演示)


Posted in Javascript onApril 25, 2014

jquery选择器众多,使用选取某个DOM的方法有很多种,如何在选取的某个元素集上面做一些排除呢?下面通过几个实例说明:

1.选择所有的img元素,排除class=phpernote的元素的个数:

$('img:not(.phpernote)').length();//或者$('img').not('.phpernote').length();

2.获取id=phpernote下面所有没有class=com的li元素的个数
$('#phpernote li:not(.com)').size();//或者$('#phpernote li').not('.com').length();

3.设置id=phpernote下面所有奇数行的li元素的背景
$('#phpernote li').not(':even').css('background-color', 'red');

附实例:jQuery中排除指定元素,同时选择剩下的所有元素

场景:某页面用了js延时加载技术处理所有图片,以改善用户体验,但是有几个图片不想延时加载,要求把它们单独挑出来。
研究了一下jQuery的API文档,搞掂了,jQuery真的很方便,贴在这里备份:

<!doctype html>
<html>
 <head>
  <title>菩提树下的杨过</title>
  <script type="text/javascript" src="http://img.24city.com/js/jquery-1.4.3.min.js"></script>
  <script type="text/javascript">
   $().ready(function(){
    $("div:not([delay='false'])").css("color","#f00"); 
   })
  </script>
 </head>
 <body>
  <div>div 1</div>
  <div delay="false">div 2</div>
  <div>div 3</div>
 </body>
</html>

上面的代码,将把有附加属性"delay",且等于"false"的div排除掉,然后把剩下的div全选中,并设置为红色字体。
Javascript 相关文章推荐
Apply an AutoFormat to an Excel Spreadsheet
Jun 12 Javascript
JavaScript打开word文档的实现代码(c#)
Apr 16 Javascript
关于锚点跳转及jQuery下相关操作与插件
Oct 01 Javascript
javascript之典型高阶函数应用介绍
Jan 10 Javascript
jquery select多选框的左右移动 具体实现代码
Jul 03 Javascript
js实现图片从左往右渐变切换效果的方法
Feb 06 Javascript
微信小程序实现根据字母选择城市功能
Aug 16 Javascript
简单的Vue异步组件实例Demo
Dec 27 Javascript
详解如何用babel转换es6的class语法
Apr 03 Javascript
取消Bootstrap的dropdown-menu点击默认关闭事件方法
Aug 10 Javascript
webpack多入口多出口的实现方法
Aug 17 Javascript
使用vuex存储用户信息到localStorage的实例
Nov 11 Javascript
js动态移动滚动条至底部示例代码
Apr 24 #Javascript
javaScript如何处理从java后台返回的list
Apr 24 #Javascript
jquery如何扑捉回车键触发的事件
Apr 24 #Javascript
用unescape反编码得出汉字示例
Apr 24 #Javascript
标题过长使用javascript按字节截取字符串
Apr 24 #Javascript
JS对img标签进行优化使用onerror显示默认图像
Apr 24 #Javascript
原生javascript模仿win8等待提示圆圈进度条
Apr 24 #Javascript
You might like
isset和empty的区别
2007/01/15 PHP
PHP MSSQL 存储过程的方法
2008/12/24 PHP
PHP面向对象——访问修饰符介绍
2012/11/08 PHP
解析link_mysql的php版
2013/06/30 PHP
php实现与erlang的二进制通讯实例解析
2014/07/23 PHP
php实现上传图片文件代码
2015/07/19 PHP
Yii编程开发常见调用技巧集锦
2016/07/15 PHP
php pdo操作数据库示例
2017/03/10 PHP
laravel5.4利用163邮箱发送邮件的步骤详解
2017/09/22 PHP
JavaScript 调试器简介
2009/02/21 Javascript
关于window.pageYOffset和document.documentElement.scrollTop
2011/04/05 Javascript
判断ie的两种简单方法
2013/08/12 Javascript
基于Jquery实现仿百度百科右侧导航代码附源码下载
2015/11/27 Javascript
js实现简单的省市县三级联动效果实例
2016/02/18 Javascript
javascript事件冒泡简单示例
2016/06/20 Javascript
老生常谈js动态添加事件--- 事件委托
2016/07/19 Javascript
微信小程序 解决请求服务器手机预览请求不到数据的方法
2017/01/04 Javascript
ajax实现动态下拉框示例
2017/01/10 Javascript
浅谈Node.js轻量级Web框架Express4.x使用指南
2017/05/03 Javascript
Vue精简版风格概述
2018/01/30 Javascript
Django+Vue实现WebSocket连接的示例代码
2019/05/28 Javascript
Vue如何实现验证码输入交互
2020/12/07 Vue.js
[35:26]DOTA2上海特级锦标赛B组小组赛#2 VG VS Fnatic第三局
2016/02/26 DOTA
GitHub 热门:Python 算法大全,Star 超过 2 万
2019/04/29 Python
Python3 Tkinkter + SQLite实现登录和注册界面
2019/11/19 Python
Python底层封装实现方法详解
2020/01/22 Python
Python变量作用域LEGB用法解析
2020/02/04 Python
浅谈keras通过model.fit_generator训练模型(节省内存)
2020/06/17 Python
让ie浏览器成为支持html5的浏览器的解决方法(使用html5shiv)
2014/04/08 HTML / CSS
教师爱岗敬业演讲稿
2014/05/05 职场文书
学习“七一”讲话精神体会
2014/07/08 职场文书
夫妻婚内购房协议书
2014/10/05 职场文书
年终工作总结范文2014
2014/11/27 职场文书
婚礼新人答谢词
2015/01/04 职场文书
碧霞祠导游词
2015/02/09 职场文书
2015年卫生局工作总结
2015/07/24 职场文书