[网页编程]-04 jQuery 属性选择器
jQuery的属性选择器区别于JavaScript
核心代码
$(function(){
// 更改type 属性为text的背景颜色
// $("input[type=text]").css("background-color","red");
//更改 name 属性以z开头的背景颜色
//$("input[name^=z]").css("background-color","yellow");
//更改 name 属性以d结尾的背景颜色
//$("input[name$=d]").css("background-color","blue");
//更改name 属性中含有p的元素的背景颜色
//$("input[name*=p]").css("background-color","orange");
//复合条件选择器 需要满足多个条件才可以使用
$("input[type=text][name^=z]").css("background-color","orange");
})
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script src="js/jquery-1.9.1.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
$(function(){
// 更改type 属性为text的背景颜色
// $("input[type=text]").css("background-color","red");
//更改 name 属性以z开头的背景颜色
//$("input[name^=z]").css("background-color","yellow");
//更改 name 属性以d结尾的背景颜色
//$("input[name$=d]").css("background-color","blue");
//更改name 属性中含有p的元素的背景颜色
//$("input[name*=p]").css("background-color","orange");
//复合条件选择器 需要满足多个条件才可以使用
$("input[type=text][name^=z]").css("background-color","orange");
})
</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="用户名" onblur="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="密码" onblur="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="邮箱" onblur="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">
<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=""/>
<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="" onclick="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>网站声明：如果转载，请联系本站管理员。否则一切后果自行承担。
赞同 0
评论 0 条
- 上周热门
- 如何使用 StarRocks 管理和优化数据湖中的数据？ 2956
- 【软件正版化】软件正版化工作要点 2875
- 统信UOS试玩黑神话：悟空 2839
- 信刻光盘安全隔离与信息交换系统 2733
- 镜舟科技与中启乘数科技达成战略合作，共筑数据服务新生态 1267
- grub引导程序无法找到指定设备和分区 1231
- 华为全联接大会2024丨软通动力分论坛精彩议程抢先看！ 165
- 2024海洋能源产业融合发展论坛暨博览会同期活动-海洋能源与数字化智能化论坛成功举办 163
- 点击报名 | 京东2025校招进校行程预告 163
- 华为纯血鸿蒙正式版9月底见！但Mate 70的内情还得接着挖... 159
- 本周热议
- 我的信创开放社区兼职赚钱历程 40
- 今天你签到了吗？ 27
- 如何玩转信创开放社区—从小白进阶到专家 15
- 信创开放社区邀请他人注册的具体步骤如下 15
- 方德桌面操作系统 14
- 用抖音玩法闯信创开放社区——用平台宣传企业产品服务 13
- 我有15积分有什么用? 13
- 如何让你先人一步获得悬赏问题信息？（创作者必看） 12
- 2024中国信创产业发展大会暨中国信息科技创新与应用博览会 9
- 信创再发力！中央国家机关台式计算机、便携式计算机批量集中采购配置标准的通知 8
热门标签更多
