1, prev ~ siblings: All siblings elements after matching prev element
2,
(1) Prev: Any valid selector
(2) Siblings: A selector, and it as the peer of the first selector
3, example
(1) Source code
Siblings.html
Copy Code code as follows:
<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
<meta http-equiv= "Content-type" content= "text/html; charset=gb2312 "/>
<title>prev ~ Siblings Selector </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 () {
Match all elements
$ ("*"). CSS ("Background-color", "#FFE4E1");
Prev ~ Siblings Selector Application
$ ("Label ~ input"). CSS ("Font-size", "30px");
Click event, prev ~ Siblings Selector Application
$ ("#pwd"). Click (function () {
Alert ("I was chosen!") ");
});
});
</script>
<body>
<form id= "Form_body" >
<label class= "username" > Username:</label>
<input type= "text" id= "username" name= "username"/>
<label class= "password" > Password:</label>
<input type= "password" id= "password" name= "password"/>
<input type= "button" id= "Login" name= "login" value= "Log In"/>
<input type= "reset" id= "reset" name= "reset" value= "reset"/>
<input type= "checkbox" id= "pwd" name= "pwd"/> Remember password
</form>
</body>
(2) display the results as follows