<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title>属性选择器</title>

        <script src="js/jquery.js"></script>

        <script type="text/javascript">

        $(function(){

        //选择input标签 下类型属性为text和password的输入框

         $("input[type='text']").css("border","1px solid red");

         $("input[type='password']").click(function(){

             alert("点击事件!")

         });

        //利用尾匹配完成对.cn结尾的超链接筛选

        //$=代表以XXX结尾的情况

        $("a[href$='.cn']").css("border","1px solid green");    

        //^=代表头匹配，筛选http://开头的超链接

        $("a[href^='http://']").css("border","1px solid red");    

        //*=代表任意属性匹配,标签中任意属性值包含有'input'都会被选中

        $("*[value*='input']").css("border","2px solid red");

        //选择拥有rows属性的组建

        $("*[rows]").css("border","2px solid red");

        //选择 选中的单选框 多条件组合

        $("input[type='radio'][checked='checked']").css("width","100px");

        $("input[type='checkbox'][checked='checked']").css("width","100px");

        //被禁用的文本框

        $("input[type='text'][disabled='disabled']").css("border","1px solid blue");

        });

       </script>

    </head>

    <body>

        <div>

            <input type="text"  value=""></input>

            <br>

            <input type="text"  value="input111"></input>

            <br>

            <input type="text"  value=""></input>

            <br>

            <input type="password"  ></input>

            <br>

            <input type="text"  disabled="disabled"  value="diididid"></input>

            <br>

            <br><!--[if IE]>

            <![endif]-->

            <a href="www.sina.com.cn">sina</a>

            <br />

                <a href="http://baidu.com">baidu</a>

                    <br />

             <textarea rows="" ></textarea>

                 <br />

             <input type="radio"  checked="checked" />女

                 <input type="radio" />男

                 <br />

             <input type="checkbox"  checked="checked" />

             <input type="checkbox" />

             <input type="checkbox" />

        </div> 

    </body>

</html>

jQuery学习-属性选择器的更多相关文章

  1. jquery 学习(一) - 选择器

    基本选择器(html) <div>123</div> <div id="n1">123</div> <span>321& ...

  2. jquery学习：选择器&dom操作

    分类; 1.基本选择器 1.标签选择器(元素选择器) *  语法:$("html标签名”) 获得所有匹配标签名称的元素 2.id选择器 *  语法:$("#id的属性值" ...

  3. jQuery学习(三)——选择器总结

    1.基本选择器 id选择器:$(“#id名称”); 元素选择器:$(“元素名称”); 类选择器:$(“.类名”); 通配符:* 多个选择器共用(并集) 案例代码: <!DOCTYPE html& ...

  4. jquery学习--属性操作

    学习jquery很长一段时间了,知道对属性操作的方式为: $("#xx1").attr("xx2"); //获取属性值 $("#xx1"). ...

  5. jQuery学习之------选择器

    a.id选择器 <div id=”test1”></div> var div1=$(“#test1”);                //同css的写法一样id选择器用#号实 ...

  6. jQuery学习- 子选择器与可见性选择器

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  7. jQuery学习- 内容选择器

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  8. jQuery学习- 层叠选择器

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  9. jQuery学习- 位置选择器

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

随机推荐

  1. EF实体对象解耦 - 泛型联表查询

    为了达到模块间最小耦合,单模块业务数据不与其他模块发生关系.在操作数据库的时候,采用EF泛型操作.但泛型操作不好实现联表,经过一晚的试验发现了一种定义数据库上下文并联表的方式. 1.实体对象定义.实体 ...

  2. 记开发个人图书收藏清单小程序开发（七）DB设计

    前面的书房初始化的前端信息已经完善,所以现在开始实现DB的Script部分. 新增Action:Shelf_Init.sql svc.sql CREATE SCHEMA [svc] AUTHORIZA ...

  3. [翻译] WPAttributedMarkup

    WPAttributedMarkup https://github.com/nigelgrange/WPAttributedMarkup WPAttributedMarkup is a simple ...

  4. 封装NSMapTable并简易的使用

    封装NSMapTable并简易的使用 NSMapTable是弱引用的字典,可以用来存储对象,该对象消失了也没有关系,对于控制器越级跳转相当有用:) WeakDictionary.h 与 WeakDic ...

  5. 有序字典（OrderedDict）、默认字典（defaultdict）内置函数

    http://www.cnblogs.com/wupeiqi/articles/5115190.html import collections do = collections.OrderedDict ...

  6. cxfreeze打包python程序的方法说明（生成安装包，实现桌面快捷方式、删除快捷方式）

    一.cxfreeze基础 1.cxfreeze功能 python代码文件转exe方法有三种,分别是cx_freeze,py2exe,PyInstaller,这三种方式各有千秋,本人只用过py2exe和 ...

  7. How HashMap works in Java

    https://www.javainterviewpoint.com/hashmap-works-internally-java/ How a HashMap Works internally has ...

  8. memcache知识梳理

    定义: memcache是一套分布式的高速缓存系统,由LiveJournal的Brad Fitzpatrick开发,但目前被许多网站使用以提升网站的访问速度,尤其对于一些大型的.需要频繁访问数据库的网 ...

  9. zabbix日常监控项nginx（五）

    1.开启nginx监控 2.编写脚本来进行数据采集 3.设置用户自定义参数 4.重启zabbix-agent 5.添加item.创建图形.创建触发器 6.创建模板 注:第一次使用可以按需求制定好模板, ...

  10. (1)网络编程的常识 (2)基于tcp协议的编程模型 (3)tcp协议和udp协议的比较 (4)基于udp协议的编程模型

    1.网络编程的常识 目前主流的网络通讯软件有:微信.QQ.YY.陌陌.探探.飞信.阿里旺旺.... 在吗? 1.1 七层网络模型(熟悉) 为了保证数据传递的可靠安全等等,ISO(国际标准委员会组织)将 ...