<!DOCTYPE HTML><HTML><Head> <title>Using the jquery hierarchy selector</title> <Scriptsrc= "Http://libs.baidu.com/jquery/1.9.0/jquery.js"></Script></Head><Body> <Divclass= "Clsfraa">Left</Div> <Divclass= "Clsfraa"ID= "Divmid"> <DivID= "NUM1">1</Div> <Div>2<span>haha</span></Div> <span><spanclass= "Clsfrac"ID= "Span2">Span</span></span> </Div> <Divclass= "Clsfraa">Right_1</Div> <Divclass= "Clsfraa">Right_2</Div></Body></HTML>
$ (function () { //jquery code $ ("#divMid"). Next (). CSS ("display", "none") // div for the same sibling; Right_1 Div is hidden, equivalent to =$ ("#divMid + div"). CSS ("display", "none"),$ ("#divMid span"). CSS ("display", "none" ); // hidden for all Span tags inside div; (span,haha text all hidden) $ ("#divMid >span"). CSS ("display", "none"); // hide the span tag for child elements inside div; (span text hidden)
$ ("#divMid ~ div"). CSS ("display", "none"); The div tag behind the sibling element of the Div is hidden; (right_1,right_2 text hidden)
Equivalent to = $ ("#divMid"). Nextall (). CSS ("display", "none");
$ ("#divMid"). Siblings ("div"). CSS ("display", "none"); The div tag that is adjacent to the sibling of the Div is hidden; (left,right_1,right_2 text hidden)
});
JQuery Hierarchy Selector