手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >jQuery prev ~ siblings选择器使用介绍
jQuery prev ~ siblings选择器使用介绍
摘要:1、prev~siblings:匹配prev元素之后的所有siblings元素2、(1)prev:任何有效选择器(2)siblings:一个...

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>用户名:</label>

<input type="text" id="username" name="username"/>

<label>密 码:</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)显示结果如下

1

【jQuery prev ~ siblings选择器使用介绍】相关文章:

jquery表单对象属性过滤选择器用法

JQuery中属性过滤选择器用法

JQuery中基础过滤选择器用法

jQuery预加载图片常用方法

javascript中DOM复选框选择用法实例

Javascript 高阶函数使用介绍

jQuery zTree加载树形菜单功能

jQuery中 prop() attr()使用详解

showModelessDialog()使用详解

JQuery中层次选择器用法实例详解

精品推荐
分类导航