Home > Developer > Web Develop
:p the definition and usage of the arent selector:
This selector matches elements that contain child elements or text.
Note: Spaces also count as elements.
Syntax structure:
$ (":p arent")This selector is typically used in conjunction with other selectors, such as class selectors and element selectors , and so on. For example:
$ ("Div:parent"). Animate ({width: "300px"})The above code can set the width of the div containing text or elements to 300px.
If not used with other selectors, the default state is used with the * selector, such as $ (":p arent") equivalent to $ ("*:p arent").
Instance code:
Example one:
<!DOCTYPE HTML> <HTML> <Head> <MetaCharSet= "Utf-8"> <Metaname= "Author"content= "http://www.softwhy.com/" /> <title>Ant Tribe</title> <styletype= "Text/css">Div{List-style-type:None;width:150px;Height:30px;Border:1px solid Red; } </style> <Scripttype= "Text/javascript"src= "Mytest/jquery/jquery-1.8.3.js"></Script> <Scripttype= "Text/javascript">$ (document). Ready (function(){ $("Button"). Click (function(){ $("div:parent"). Animate ({width:"300px"}) }) }) </Script> </Head> <Body> <Div>I am the text</Div> <Div></Div> <Button>Click to view Effects</Button> </Body> </HTML>
The above code can set the width of a div containing text or elements to a custom animation of 300.
Example two:
<!DOCTYPE HTML> <HTML> <Head> <MetaCharSet= "Utf-8"> <Metaname= "Author"content= "http://www.softwhy.com/" /> <title>Ant Tribe</title> <styletype= "Text/css">Div{List-style-type:None;width:150px;Height:30px;Border:1px solid Red; }span{Border:1px solid Green;} </style> <Scripttype= "Text/javascript"src= "Mytest/jquery/jquery-1.8.3.js"></Script> <Scripttype= "Text/javascript">$ (document). Ready (function(){ $("Button"). Click (function(){ $("*:p arent"). Animate ({width:"300px"}) }) }) </Script> </Head> <Body> <Div>I am the text</Div> <Div></Div> <span>Hello everyone</span> <Button>Click to view Effects</Button> </Body> </HTML>
Since the code above does not specify a selector for use with the parent selector, it is used with the default and the * selector, so the code can set the width of the element containing the text and elements in a custom animated manner to 300px.
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
