jQuery prev ~ siblings选择器使用介绍


Posted in Javascript onAugust 09, 2013

1、prev ~ siblings:匹配 prev 元素之后的所有 siblings 元素
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 prev ~ siblings选择器使用介绍
Javascript 相关文章推荐
js操作二级联动实现代码
Jul 27 Javascript
jQuery结合PHP+MySQL实现二级联动下拉列表[实例]
Nov 15 Javascript
jquery简单实现外部链接用新窗口打开的方法
May 30 Javascript
浅谈javascript中执行环境(作用域)与作用域链
Dec 08 Javascript
详解Jquery 遍历数组之$().each方法与$.each()方法介绍
Jan 09 Javascript
Angular开发者指南之入门介绍
Mar 05 Javascript
解析jquery easyui tree异步加载子节点问题
Mar 08 Javascript
windows下vue-cli及webpack搭建安装环境
Apr 25 Javascript
JS实现移动端按首字母检索城市列表附源码下载
Jul 05 Javascript
node.js的exports、module.exports与ES6的export、export default深入详解
Oct 26 Javascript
Vue.js+Layer表格数据绑定与实现更新的实例
Mar 07 Javascript
微信小程序常用简易小函数总结
Feb 01 Javascript
jQuery怎么解析Json字符串(Json格式/Json对象)
Aug 09 #Javascript
jQuery查询数据返回object和字符串影响原因是什么
Aug 09 #Javascript
在服务端(Page.Write)调用自定义的JS方法详解
Aug 09 #Javascript
Jquery显示、隐藏元素以及添加删除样式
Aug 09 #Javascript
jquery实现文字由下到上循环滚动的实例代码
Aug 09 #Javascript
jquery 实现上下滚动效果示例代码
Aug 09 #Javascript
15条JavaScript最佳实践小结
Aug 09 #Javascript
You might like
大师制作的中短波矿石收音机
2020/04/02 无线电
解决控件遮挡问题:关于有窗口元素和无窗口元素
2007/01/28 PHP
php合并数组array_merge函数运算符加号与的区别
2008/10/31 PHP
浅析php中抽象类和接口的概念以及区别
2013/06/27 PHP
php延迟静态绑定实例分析
2015/02/08 PHP
php编写的一个E-mail验证类
2015/03/25 PHP
PHP如何实现Unicode和Utf-8编码相互转换
2015/07/29 PHP
PHP用mb_string函数库处理与windows相关中文字符及Win环境下开启PHP Mb_String方法
2015/11/11 PHP
PHP基于单例模式实现的mysql类
2016/01/09 PHP
创建无限极分类树型结构的简单方法
2017/06/20 PHP
PHP常见过waf webshell以及最简单的检测方法
2019/05/21 PHP
laravel 字段格式化 modle 字段类型转换方法
2019/09/30 PHP
一个选择最快的服务器转向代码
2009/04/27 Javascript
利用js实现在浏览器状态栏显示访问者在本页停留的时间
2013/12/29 Javascript
在Node.js中实现文件复制的方法和实例
2014/06/05 Javascript
使用node.js 获取客户端信息代码分享
2014/11/26 Javascript
JavaScript类继承及实例化的方法
2015/07/25 Javascript
javascript基础语法学习笔记
2016/01/04 Javascript
AngularJs学习第八篇 过滤器filter创建
2016/06/08 Javascript
js提示框替代系统alert,自动关闭alert对话框的实现方法
2016/11/07 Javascript
Vue计算属性的学习笔记
2017/03/22 Javascript
vue+elementUI组件table实现前端分页功能
2020/11/15 Javascript
基于Vue3.0开发轻量级手机端弹框组件V3Popup的场景分析
2020/12/30 Vue.js
[01:04:48]VGJ.S vs TNC Supermajor 败者组 BO3 第一场 6.6
2018/06/07 DOTA
在Python中操作文件之seek()方法的使用教程
2015/05/24 Python
利用Python模拟登录pastebin.com的实现方法
2019/07/12 Python
python list转置和前后反转的例子
2019/08/26 Python
python 函数嵌套及多函数共同运行知识点讲解
2020/03/03 Python
django 取消csrf限制的实例
2020/03/13 Python
用Python开发app后端有优势吗
2020/06/29 Python
HTML5实现获取地理位置信息并定位功能
2015/04/25 HTML / CSS
Kathmandu美国网站:新西兰户外运动品牌
2019/03/23 全球购物
嘻哈珠宝品牌:KRKC&CO
2020/10/19 全球购物
金融专业个人求职信
2013/09/22 职场文书
Python Django 后台管理之后台模型属性详解
2021/04/25 Python
MySQL中LAG()函数和LEAD()函数的使用
2022/08/14 MySQL