Home > Developer > Web Develop
1, First-child
First-child matches the first child element for each parent element and can match multiple elements:
Example Code:
<!DOCTYPE HTML><HTMLLang= "zh"> <Head> <MetaCharSet= "UTF-8" /> <title>The difference between First-child and first selector in jquery</title> </Head> <Body> <ul> <Li>John</Li> <Li>Karl</Li> <Li>Brandon</Li> </ul> <ul> <Li>Glen</Li> <Li>Tane</Li> <Li>Ralph</Li> </ul> <Scriptsrc= "https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></Script> <Scripttype= "text/javascript"> //2 elements were selected: //:<li>john</li> and <li>Glen</li>, respectively //First-child matches the first child element for each parent element and can match multiple elements $("Li:first-child"). css ('Color', 'Red'); </Script> </Body></HTML>
Effect:
2. First
First-child to get the first element that matches, only one element is Matched.
Example Code:
<!DOCTYPE HTML><HTMLLang= "zh"> <Head> <MetaCharSet= "UTF-8" /> <title>The difference between First-child and first selector in jquery</title> </Head> <Body> <ul> <Li>John</Li> <Li>Karl</Li> <Li>Brandon</Li> </ul> <ul> <Li>Glen</Li> <Li>Tane</Li> <Li>Ralph</Li> </ul> <Scriptsrc= "https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></Script> <Scripttype= "text/javascript"> //1 elements were selected: //it's:<li>john</li> . //First-child to get the first element of the match, only one element is matched $("Li:first"). css ('Color', 'Red'); </Script> </Body></HTML>
Effect:
In the use of the process to pay attention to the difference between the Two.
The difference between First-child and first selector in jquery
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
