jQuery prev ~ siblings选择器使用介绍
2013-08-09 00:00
721 查看
1、prev ~ siblings:匹配 prev 元素之后的所有 siblings 元素
2、
(1)prev:任何有效选择器
(2)siblings:一个选择器,并且它作为第一个选择器的同辈
3、示例
(1)源码
siblings.html
(2)显示结果如下
2、
(1)prev:任何有效选择器
(2)siblings:一个选择器,并且它作为第一个选择器的同辈
3、示例
(1)源码
siblings.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>prev ~ siblings选择器</title> <script type="text/javascript" src="jquery-2.0.3.js"></script> <style type="text/css"> body{ width:100%; height:100%; font-size:18px; color:#00FF00; } </style> <script type="text/javascript"> $(function(){ //匹配所有元素 $("*").css("background-color","#FFE4E1"); //prev ~ siblings选择器运用 $("label ~ input").css("font-size","30px"); //点击事件,prev ~ siblings选择器运用 $("#pwd").click(function(){ alert("我被选中!"); }); }); </script> </head> <body> <form id="form_body"> <label class="username">用户名:</label> <input type="text" id="username" name="username"/> <label class="password">密 码:</label> <input type="password" id="password" name="password"/> <input type="button" id="login" name="login" value="登录"/> <input type="reset" id="reset" name="reset" value="重置"/> <input type="checkbox" id="pwd" name="pwd"/>记住密码 </form> </body> </html>
(2)显示结果如下
相关文章推荐
- JQuery基本方法介绍和使用
- JQuery中extend使用介绍
- jQuery的prev~siblings选择器
- jQuery基本选择器选择元素使用介绍
- js弹出框轻量级插件jquery.boxy使用介绍
- jquery.validate的使用说明介绍
- jquery组件 bxslider 的使用介绍
- jquery $.trim()方法使用介绍
- JQuery的Alert消息框插件使用介绍
- jquery中页面Ajax方法$.load的功能使用介绍
- jQuery :first选择器使用介绍
- Jquery 数据选择插件Pickerbox使用介绍
- AMD异步模块定义介绍和Require.js中使用jQuery及jQuery插件的方法
- jquery.cookie.js使用介绍
- 【jQuery】prev ~ siblings选择器
- jQuery的选择器中的通配符使用介绍
- (转)passwordStrength 基于jquery的密码强度检测代码使用介绍
- jquery键盘事件使用介绍
- jquery $(this).attr $(this).val方法使用介绍
- 关于jquery中全局函数each使用介绍