先看代码,后面详细解释:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script type="text/javascript" src="js/jquery-1.9.1.js" ></script>
<script>
$(function(){
//选择type类型进行更改
$("input[type=text]").css("background-color","aquamarine"); //选择name属性以z开头的
$("input[name^=z]").css("background-color","aquamarine"); //选择name属性以e结尾
$("input[name$=e]").css("background-color","aquamarine"); //选择name属性中有p
$("input[name*=p]").css("background-color","aquamarine"); //选择复合器,同时符合多种条件多种
$("input[type=text][name*=n]").css("background-color","aquamarine"); }) </script>
</head>
<body>
<center>
<h3>注册页面</h3>
<hr />
<form action="" method="get">
<table border="1px">
<tr height="35px">
<td width="150px">用户名:</td>
<td width="400px">
<input type="text" name="zuname" id="uname" value="" alt="用户名" οnblur="checkName()"/>
<span id="uname_span">*用户名必须是3-5位的汉字</span>
</td>
</tr>
<tr height="35px">
<td>密码:</td>
<td>
<input type="password" name="zpwd" id="pwd" value="" alt="密码" οnblur="checkPwd()"/>
<span id="pwd_span"></span> </td>
</tr>
<tr height="35px">
<td>手机号:</td>
<td>
<input type="text" name="zphone" id="phone" value="" alt="手机号" />
<span id="phone_span"></span>
</td>
</tr>
<tr height="35px">
<td>邮箱:</td>
<td>
<input type="text" name="email" id="email" value="" alt="邮箱" οnblur="checkEmail()" />
<span id="email_span"></span>
</td>
</tr>
<tr height="35px">
<td>颜色:</td>
<td>
<input type="color" name="scolor" id="" />
</td>
</tr>
<tr height="35px">
<td>爱好:</td>
<td>
<input type="checkbox" name="fav" id="" value="1" />唱歌
<input type="checkbox" name="fav" id="" value="2" />睡觉
<input type="checkbox" name="fav" id="" value="3" />LOL<br />
<input type="checkbox" name="fav" id="" value="4" />旅游
<input type="checkbox" name="fav" id="" value="5" />高尔夫
<input type="checkbox" name="fav" id="" value="6" />篮球 </td>
</tr>
<tr height="35px">
<td>籍贯:</td>
<td>
<select name="adress" id="sel" οnchange="checkAdress()">
<option value="0">--请选择--</option>
<option value="1">河南</option>
<option value="2">湖南</option>
<option value="3">海南</option>
<option value="4">云南</option>
</select> <span id="sel_span"></span>
</td>
</tr> <tr height="35px">
<td>验证码</td>
<td>
<input type="number" name="" id="yzm" value="" οnblur="checkYZM()"/>
<span id="yzm_span"></span>
<span id="yzm2_span"></span>
</td>
</tr> <tr height="35px">
<td>个人介绍:</td>
<td>
<textarea name="intro" rows="8" cols="30"></textarea>
</td>
</tr> <tr height="35px">
<td colspan="2" align="center">
<input type="checkbox" name="" id="check" value="" οnclick="checkAgree()">是否同一本公司协议
</td>
</tr>
<tr height="35px">
<td colspan="2" align="center">
<input type="submit" id="sub" value="注册" disabled="true"/>
</td>
</tr>
</table>
</form>
</center> </body>
</html>

选择type属性是text的标签:(类似于 $(":text"))

$("input[type=text]").css("background-color","aquamarine");

选择name属性以z开头的:(开头符号 ^)

$("input[name^=z]").css("background-color","aquamarine");

选择name属性以e结尾:(结尾符号 $)

$("input[name$=e]").css("background-color","aquamarine");

选择name属性中有p:(包含,含有 符号:*)

$("input[name*=p]").css("background-color","aquamarine");

选择复合器,同时符合多种条件多种:

$("input[type=text][name*=n]").css("background-color","aquamarine");
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script type="text/javascript" src="js/jquery-1.9.1.js" ></script>
<script>
$(function(){ //获取form表单的所有表单项
var inp=$(":input").length;
//alert(inp); //获取input标签中type属性是text
$(":text").css("background-color","darkblue");
//等同于:
$("input[type=text]").css("background-color","darkblue"); //获取input标签中checked属性
var val=$("input:checked");
//alert(val.val()); //获取input标签中属性disabled
var dd=$("input:disabled");
alert(dd.val()); //获取select中有selected属性。
var val=$("select option:selected");
//alert(val.val()); }) </script>
</head>
<body>
<center>
<h3>注册页面</h3>
<hr />
<form action="" method="get">
<table border="1px">
<tr height="35px">
<td width="150px">用户名:</td>
<td width="400px">
<input type="text" name="zuname" id="uname" value="" alt="用户名" οnblur="checkName()"/>
<span id="uname_span">*用户名必须是3-5位的汉字</span>
</td>
</tr>
<tr height="35px">
<td>密码:</td>
<td>
<input type="password" name="zpwd" id="pwd" value="" alt="密码" οnblur="checkPwd()"/>
<span id="pwd_span"></span> </td>
</tr>
<tr height="35px">
<td>手机号:</td>
<td>
<input type="text" name="zphone" id="phone" value="" alt="手机号" />
<span id="phone_span"></span>
</td>
</tr>
<tr height="35px">
<td>邮箱:</td>
<td>
<input type="text" name="email" id="email" value="" alt="邮箱" οnblur="checkEmail()" />
<span id="email_span"></span>
</td>
</tr>
<tr height="35px">
<td>颜色:</td>
<td>
<input type="color" name="scolor" id="" />
</td>
</tr>
<tr height="35px">
<td>爱好:</td>
<td>
<input type="checkbox" name="fav" id="" value="0"/>唱歌
<input type="checkbox" name="fav" id="" value="1" checked="checked"/>睡觉
<input type="checkbox" name="fav" id="" value="2"/>LOL
<input type="checkbox" name="fav" id="" value="3"/>旅游
<input type="checkbox" name="fav" id="" value="4"/>高尔夫
<input type="checkbox" name="fav" id="" value="5"/>篮球 </td>
</tr>
<tr height="35px">
<td>籍贯:</td>
<td>
<select name="adress" id="sel" οnchange="checkAdress()">
<option value="0">--请选择--</option>
<option >河南</option>
<option >湖南</option>
<option selected="selected">海南</option>
<option >云南</option>
</select> <span id="sel_span"></span>
</td>
</tr> <tr height="35px">
<td>验证码</td>
<td>
<input type="number" name="" id="yzm" value="" οnblur="checkYZM()"/>
<span id="yzm_span"></span>
<span id="yzm2_span"></span>
</td>
</tr> <tr height="35px">
<td>个人介绍:</td>
<td>
<textarea name="intro" rows="8" cols="30"></textarea>
</td>
</tr> <tr height="35px">
<td colspan="2" align="center">
<input type="checkbox" name="" id="check" value="" οnclick="checkAgree()">是否同一本公司协议
</td>
</tr>
<tr height="35px">
<td colspan="2" align="center">
<input type="submit" id="sub" value="注册" disabled="true"/>
</td>
</tr>
</table>
</form>
</center> </body>
</html>

获取form表单的所有表单项和   $("input")   进行区别开, $("input") 表示获取表单元素是input的。

$(":input")

获取input标签中type属性是text:

$(":text").css("background-color","darkblue");

获取input标签中checked属性:

$("input:checked");

获取input标签中属性disabled:

$("input:disabled");

获取select中有selected属性:

$("select option:selected");

jQuery中的属性选择器的更多相关文章

  1. js进阶 10-6 jquery中的属性选择器有哪些

    js进阶 10-6 jquery中的属性选择器有哪些 一.总结 一句话总结: 1.第一遍能学会么? 一遍是肯定学不会的,要多学几遍,所以想着怎么加快速度,减少学习的遍数 2.属性选择器是干嘛的? 选择 ...

  2. jQuery入门(1)jQuery中万能的选择器

    jQuery入门(1)jQuery中万能的选择器 jQuery入门(2)使用jQuery操作元素的属性与样式 jQuery入门(3)事件与事件对象 jQuery入门(4)jQuery中的Ajax()应 ...

  3. jquery笔记之属性选择器 查找以某种条件开头的页面元素

    jquery笔记之属性选择器 查找以某种条件开头的页面元素 转载:http://www.blogbus.com/amyqiong-logs/78340326.html $("div[id]& ...

  4. js进阶 10-5 jquery中的层级选择器有哪些

    js进阶 10-5 jquery中的层级选择器有哪些 一.总结 一句话总结: 1.jquery中的层级选择器有哪些? 四种,后代,子代,兄弟,相邻兄弟 2.如何区别jquery中的层级选择器? 记住这 ...

  5. jquery中的属性和css

    jQuery中的属性用于获取或设置元素的属性 1.attr(),获取或设置所有相匹配的元素的属性值:removeAttr("attr"),移除所有相匹配的元素的属性 //html ...

  6. jQuery中的:input选择器

    jQuery中的:input选择器 jQuery中的:input选择器包含input, textarea, select 和 button这些标签. <!DOCTYPE html> < ...

  7. js进阶 11-3 jquery中css属性如何操作

    js进阶 11-3  jquery中css属性如何操作 一.总结 一句话总结:通过css()方法 1.attr和css是有交叉的,比如width,两者中都可以设置,那么他们的区别是什么? 其实通俗一点 ...

  8. jQuery中的属性过滤选择器(四、五):[attribute] 、[attribute=value]、[attribute!=value] 、[attribute^=value] 等

    <!DOCTYPE html> <html> <head> <title>属性过滤选择器</title> <meta http-equ ...

  9. jQuery选择器之属性选择器Demo

    测试代码: 06-属性选择器.html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" &quo ...

随机推荐

  1. Windows对python文件加密

    最近项目需要对部分python文件加密,调研了部分方法都觉得不可行,最后采用了将python转换成so文件.pyd文件的方法.so文件,为liunx下的动态链接库文件,在windows下为dll文件, ...

  2. Linux跨网段通信小实验

    一.实验场景. 实验准备,Linux主机4台.分别是主机A,路由主机R1,路由主机R2,主机 C,主机A的ip是192.168.56.66/24,且只有一块网卡eth0:路由主机R1有两块网卡eth0 ...

  3. UEFI+GPT电脑Win10下安装openSUSE Leap 42.2双系统

    安装过程仅供参考,最后实现方式不完美. 1       准备工具,一个8G以上U盘,已装好win10的UEFI+GPT电脑(本机为SSD+HDD双硬盘) 2       所需软件: 2.1       ...

  4. 领扣(LeetCode)两个数组的交集II 个人题解

    给定两个数组,编写一个函数来计算它们的交集. 示例 1: 输入: nums1 = [1,2,2,1], nums2 = [2,2] 输出: [2,2] 示例 2: 输入: nums1 = [4,9,5 ...

  5. 7. SOFAJRaft源码分析—如何实现一个轻量级的对象池?

    前言 我在看SOFAJRaft的源码的时候看到了使用了对象池的技术,看了一下感觉要吃透的话还是要新开一篇文章来讲,内容也比较充实,大家也可以学到之后运用到实际的项目中去. 这里我使用Recyclabl ...

  6. ubuntu 16.04上源码编译glog和gflags 编写glog-config.cmake和gflags-config.cmake | compile glog and glags on ubuntu 16.04

    本文首发于个人博客https://kezunlin.me/post/977f5125/,欢迎阅读! compile glog and glags on ubuntu 16.04 Series comp ...

  7. 一篇很好的学习查看Java源代码的文章

    目录: 一. ArrayList概述 二. ArrayList的实现 1) 私有属性 2) 构造方法 3) 元素存储 4) 元素读取 5) 元素删除                 6) 调整数组容量 ...

  8. 2019-11-19:xxe漏洞利用,笔记

    xxe,也就是xml,外部实体注入攻击,漏洞是对非安全的外部实体数据进行处理时引发的安全问题,要了解xxe,就必须懂得xml的一些规则xml是用于标记电子文件使其具有结构性的标记语言,可以用来标记数据 ...

  9. Tensorflow常用函数说明

    1.矩阵操作 1.1矩阵生成 这部分主要将如何生成矩阵,包括全0矩阵,全1矩阵,随机数矩阵,常数矩阵等 sess=tf.InteractiveSession() #x=tf.ones([2,3],tf ...

  10. UINavigationController-自定义导航栏标题按钮.

    见视频0416 自定义导航栏标题按钮,在Bar Button Item中加入UIButton,设置UIButton的图片和标题,还可以自定义自定义UIButton实现特效按钮.