Copy codeThe Code is as follows:
<! 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 = GBK">
<Link rel = "stylesheet" type = "text/css" href = "table.css">
<Title> </title>
<Script src = "../jquery-1.7.2.js" type = "text/javascript"> </script>
<Style type = "text/css">
</Style>
<Script type = "text/javascript">
$ (Function ()
{
// Next () Find the next adjacent node next ("# x") Find the next adjacent node with id x
$ ("# D4" ).next().css ("background-color", "red ");
// All nodes after nextAll (). All div labels after nextAll ("div ")
$ ("# D4" ).nextAll().css ("background-color", "red ");
// Previous adjacent nodes
$ ("# D4" 2.16.prev(2.16.css ("background-color", "red ");
// All previous nodes
$ ("# D4" 2.16.prevall(2.16.css ("background-color", "red ");
// Search for all sibling nodes
$ ("# D4" ).siblings().css ("background-color", "red ");
// Find the current node and the node after the current node. end () returns the status before the last jQuery object is destroyed.
$ ("# D4" ).nextAll().css ("background-color", "red" ).end().css ("background-color", "red ");
$ ("# D4" ).nextAll().andSelf().css ("background-color", "red ");
$ ("# D4" ).nextAll().andSelf().end().css ("background-color", "red ");
});
</Script>
</Head>
<Body>
& Lt; div & gt; 11111111 & lt;/div & gt;
& Lt; div & gt; 22222222 & lt;/div & gt;
& Lt; div & gt; 33333333 & lt;/div & gt;
<Div id = "d4"> 44444444 </div>
<P> 55555555 </p>
& Lt; div & gt; 66666666 & lt;/div & gt;
& Lt; div & gt; 77777777 &
& Lt; div & gt; 88888888 &
& Lt; div & gt; 99999999 &
</Body>
</Html>