根据可见性 属性 匹配元素

<!doctype html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>jquery</title>

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

<script type="text/javascript">

$(function(){

    //选择器 内容

    $('ul li:contains(1)').css('color','red');//选中内容中含有1的元素

    $('ul li:empty').css('color','red');//选中空元素

    $('div:has(p)').css('color','red');//选中有指定子元素的元素

    $('ul li:parent').css('color','green');//匹配含有元素或文本的元素，与empty相反

    //可见性

    $('ul li:hidden');//匹配所有不可见元素

    $('ul li:visible');//匹配所有可见元素

    $('ul li[id]').css('color','yellow');//含有id属性的元素

    $('ul li[id="one"]');//匹配id是one的元素

    $('ul li[id!="one"]');//匹配id不是one的li元素

    $('ul li[id^="on"]');//匹配id以on开头的li元素one符合要求

    $('li[id$="ne"]');//匹配id以ne结尾的li元素

    $('li[id*="n"]');//匹配id包含n的li元素

    //以上功能可以重复写多个

})

</script>

</head>

<body>

<ul>

    <li>1</li>

    <li id="one">2</li>

    <li>3</li>

    <li>4</li>

    <li></li>

</ul>

<div>

    <p>我是div里的p标签</p>

</div>

<div>

    我是div标签

</div>    

</body>

</html>

aaarticlea/png;base64,iVBORw0KGgoAAAANSUhEUgAAAKwAAADbCAIAAAB/dO32AAAG4UlEQVR4nO2dPXIbORBGJ2EoXUE6gkpnkE/FxOVgN/SGu6kPITPxKZjIZV/AVY6YOfo2oMUazgCNxpBoQuZ7xVLND4DpaTwCIxkmB8HVM1w6ALg8SABIAEgAQgIQEoCQAIQEICQAIQEICUBIAEICEBKAkACEBCAkACEBCAlA3UowvO80sD+SHnM9vB+QIJLucr3vfiSIpHmud792m++bzffN7teuHM1r3yNBJG1z/fLz5e7j3X54v//n/uvPr96wkCCQtrl++vS0N2D/evfpnTcsJAikba5v/roZS3D79603LCQIpG2uH/59GEvw+N+jNywkCKRtrp+/Pa8+rPYGrD6sPn/77A0LCQJpnuvtj+36y3r9Zb39sfXXQoJIOs01EkTSaa6RIBJyDUgASABCAhASgJAAhASgLiUYRi+IoLdED5ltaEhXiZ4H01V4fywBWd5JG2kjlZeXzUCCCFpn+UW6e53g7yXv8rJXkCCC1ll+On7Q8y4vk4QBYbRO9M2xBN7lZZKQIIzWiX44lsC7vAwDImmd62dp9WrASnIuL8OAUALSvZXW0lpyLi/DgGh6y3hv8VwFXSV9SL2gOWQZkACQAIQEICQAIQEICUAdSnD4f+yXDuSK6CvX477HgzA6SvSk15EgjL4+vWwMEoTR76eXIUEY3X16GQ+G8XT66WViOgik008v24MHMXT66WV7kCCGjj69bN7lSBBDR1mePA9iQBjdJZrfDuIh14AEgAQgJAAhAQgJQEgA6lkC/lQQRqeJ5u9FkfSYaL4fM5julpfx/ZjxdLe8DAni6Wt5Gf+KeBE6Wl7GkvNL0cvyMlaUXJBelpeNXRm/moYHezpaXjYBA8LoN9FIEEa/iUaCMEg0IAEgAQgJQEgAQgIQEoCQAIQEICQARUiw22mz0Waj3YIvx4QIGkvw8qK7Ow2DhkH39/pa++WYEEFjCZ6efhuwf72r+nJMCKKxBDc3RxLcVn05JgTRWIKHhyMJHus+vQxiaCzB87NWq98GrFb6XPfpZRBD+98Otlut11qvta1bXgZh8HcCQAJAAhASgJAAhAQgJAAhAQgJQEgAQgIQEoCQAIQEICQAIQEICUBIAEICEBKAkACEBCAkAJUlGIb0drJk7nVx5jEsjqq24hkv3Qxfvx52lb+H2uOLMWzLOddIAs/V36oEuVua2DCvlb6C457tlu0G7d1cmzEjQVKR/kbK0kiQ3M2ldfF0UJvZqt1kMIu7YUHh5JTaQd8fWCSBp7Czlr/MuLB/OkjuVt1X7qKeKqdfN4TU4Ol/TSqmr5A/Ph4hJ4WNUb12JJjvGmUmI3Yy7En8uTE/WbGbjh9z1pHAPx1M8h4pgdHyvICnejJa+xKdsVSCU+7E2cHG9onTgfNCxqWLd2Sf7cwDR/R24hZMHydKkKubO5tTpHjRZLH5z/nu5OrzMManOsCRwfHuZMOoWHXWHuprWzPONpVgsuHp4z5UMN9hhtrJ8sltu+TkiEeCs0wH/siL/W3EXxvJhcgkxRjfktvzU/6OUaUERkjFs4slmO86Z64FE1w49Rm0Oyx5ym55bEmxD4pB2mc9ElQNDMkWcu3759NY3BmcbxtH/NNhseLpEhhj0ryFQzyewv4Y/IUvgTnBjzMyL2AMjI3us/g0MO/s4lu2tof8E1ZVnBfF/SCTK5Dzo9cbPuIsA0+H91XJm7+BM/P2e3QB13jPMAEJAAkACUBIAEICEBKAkACEBCAkACEBCAlASABCAhASgJAAhAQgJAAVJRhGy60Gc+nVkOc8kWaiWla+RVRvF1e/HnaVT1/t8VOYqFnUDglsErnIZXNiw7xW+gKOdNstL2tzXHiuSMBw9YYojATJ3ZwEi6eD04f3YuEhNa9ded8fWCKBp7Czlr+MFr19531fdVNXQmKy9DOpmL5A/vh4cJ4UntfKvZWN2HKN0PETzjkSeFyZNzUu45HA02bxdvBgzEIJTkmi3cHFy+XcKjpaVf6qKCfO7iFjAMgNCadIMA4pGV6y8cOpSTC5QeXaKI/w493JhlGx6myu5Xm/FiXQTFA7VH+xP5jszeeG3Fy+cm9iu+TkiC2BsWE0Ylz6yvv+QPY3frkf0ZOnkhNBsqLcEtjl/bEZkVwn1Q+GdoclT9ktOx8XjEg8AdijyJXjlSA3MSeP+GfiYkVDAs/B3FkMGGNN8Ief9sOB7UcLnLOG3L+8NI22f7zPULkCOT+a5to5YIATcgdIAEgAQgIQEoCQAIQEICQAIQEICUBIAEICEBKAkACEBCAkACEBCAlASABCAhASgJAAhAQgJAAhAQgJQEgAQgIQEoCQAIQEICQAIQEICUBIAEICEBKAkACEBCDpf0n9HYa/x5fUAAAAAElFTkSuQmCC" alt="" />

jqery选择器的更多相关文章

  1. 19 01 13 JQery 加载 选择器 样式操作

    在Javascript   中应该用下方法经行编辑 <script type="text/javascript" src="js/jquery-1.12.4.min ...

  2. JS 与 jQery 的区别主要在于 DOM

    //目前正在学习前端阶段,把知识点整理.保存下来以便日后查看 首先引入jQery: 需要先引入css,再引入js: jQery需要在js前引入,再引入框架,最后才是js的引入:css也相同,先引入框架 ...

  3. jQuery学习之开篇

    吐槽 近期比較烦,对于一个前端白痴来说,工作方向突然转向前端这块着实让人蛋疼无比.前段时间简单的学习了下EasyUI,算是对其有一个简单的认知了吧.EasyUI的研究过程中发现,假设没有掌握JS.JQ ...

  4. 表格可拖拉列改变列大小（使用的时候将youElement全部替换称你要添加这个效果的元素，需是jqery的选择器格式，如：$("table th/td")）

    $(function () { var isMouseDown = false; var currentTh = null; youElement.bind({ mousedown: function ...

  5. jQuery学习笔记（三）：选择器总结

    这一节详细的总结jQuery选择器. 一.基础选择器 $('#info'); // 选择id为info的元素,id为document中是唯一的,因此可以通过该选择器获取唯一的指定元素$('.infoC ...

  6. jQuery的选择器小总结

      这一节详细的总结jQuery选择器. 一.基础选择器 $('#info'); // 选择id为info的元素,id为document中是唯一的,因此可以通过该选择器获取唯一的指定元素 $('.in ...

  7. JQuery第一天——入门概述与选择器

    一.什么是JQuery 一个流行的js库 核心理念:write less , do more 优势:  轻量级 强大的选择器 出色的 DOM 操作的封装 可靠的事件处理机制 完善的 Ajax 出色的浏 ...

  8. jQuery - 01. jQuery特点、如何使用jQuery、jQuery入口函数、jQuery和DOM对象的区别、jQuery选择器、

    this指的是原生js的DOM对象 .css(“”):只写一个值是取值,写俩值是赋值 window.onload   ===   $(document).ready(); $(“”):获取元素   标 ...

  9. 前端极易被误导的css选择器权重计算及css内联样式的妙用技巧

    记得大学时候,专业课的网页设计书籍里面讲过css选择器权重的计算:id是100,class是10,html标签是5等等,然后全部加起来的和进行比较... 我只想说:真是误人子弟,害人不浅! 最近,在前 ...

随机推荐

  1. 使用 ASR 和 Azure Pack 为 IaaS 工作负荷提供托受管 DR

    Ashish Gangwar 云 + Enterprise项目经理 几周前,我们宣布了在 Azure Site Recovery 中提供一些新功能,这些新功能适用于不同场景,可以让服务提供商在 A ...

  2. weblogic配置数据源出错

    Connection test failed. Listener refused the connection with the following error: ORA-12505, TNS:lis ...

  3. 让ASP.NET MVC页面返回不同类型的内容

    在ASP.NET MVC的controller中大部分方法返回的都是ActionResult,更确切的是ViewResult.它返回了一个View,一般情况下是一个HTML页面.但是在某些情况下我们可 ...

  4. POJ1456 Supermarket 贪心

    贪心策略:一定先卖价值最大的,然后考虑卖当前的物品,卖的日期越靠后,越优,可以为以后的物品提供机会 #include <stdio.h> #include <string.h> ...

  5. Nginx反向代理+DNS轮询+IIS7.5 千万PV 百万IP 双线 网站架构案例

    原文地址:http://www.jb51.net/article/31844.htm Nginx  ("engine x") 是一个高性能的 HTTP 和反向代理服务器,也是一个 ...

  6. oracle rac存储安装

    oracle rac 10.2 的在 linux 上的存储选项 博客分类: Oracle OracleLinux项目管理配置管理  Oracle 集群需要存储的软件和数据 项目 内容 最少磁盘空间 C ...

  7. scp 详细总结

    转自:http://www.ha97.com/4169.html scp命令跟cp命令类似,只不过cp命令是在同一台机器上用的,scp是在两台机器上复制传输数据的命令.scp实质相当于利用SSH协议来 ...

  8. NOIP2002 均分纸牌

    题一 均分纸牌 (存盘名: NOIPG1) [问题描述] 有 N 堆纸牌,编号分别为 1,2,…, N.每堆上有若干张,但纸牌总数必为 N 的倍数.可以在任一堆上取若于张纸牌,然后移动. 移牌规则为: ...

  9. 搭建Windows Azure开发环境-环境搭建

    虚拟机中运行 练习1:使用远程桌面连接到虚拟机 在本节中,你会登录到Windows Azure的门户网站,并使用Windows Azure库创建的Azure虚拟机. 任务1 -配置的Visual St ...

  10. HW2.9

    import java.util.Scanner; public class Solution { public static void main(String[] args) { Scanner i ...