ఈ కథనం జావాస్క్రిప్ట్‌లోని జాబితా అంశంలోని యాంకర్ మూలకం యొక్క IDని తిరిగి పొందే విధానాన్ని అందిస్తుంది.
జావాస్క్రిప్ట్‌లో జాబితా అంశం లోపల యాంకర్ యొక్క IDని ఎలా తిరిగి పొందాలి?
మూలకం యొక్క ID లక్షణం అనేది జావాస్క్రిప్ట్ ఫంక్షన్‌లో ఆ మూలకాన్ని మార్చడానికి మరియు ఉపయోగించడానికి ఉపయోగించే ఒక ప్రత్యేక ఐడెంటిఫైయర్. వినియోగదారులు వివిధ పద్ధతుల ద్వారా దాని IDని ఉపయోగించి మూలకాన్ని పొందవచ్చు. అయినప్పటికీ, HTML మూలకం యొక్క IDని తిరిగి పొందడం కష్టం కావచ్చు. అయినప్పటికీ, HTML మూలకం యొక్క ID లక్షణాన్ని తిరిగి పొందడం కొంచెం క్లిష్టంగా ఉండవచ్చు.
అదేవిధంగా, ఒక “లోపల యాంకర్ మూలకాల విషయంలో జాబితా అంశం ”, వినియోగదారు నేరుగా యాంకర్ ఎలిమెంట్‌కు కాల్ చేసి దాని IDని పొందలేరు ఎందుకంటే అవి జాబితాలో ఉన్నందున బహుళ యాంకర్ ఎలిమెంట్‌లు ఉంటాయి. ఈ పరిస్థితి కోసం, దిగువ అందించిన ప్రదర్శన జాబితా అంశంలోని యాంకర్ మూలకం యొక్క IDని ఎలా తిరిగి పొందాలో చూపుతుంది:
< html >
< శరీరం >
< div >
< ఉల్ id = 'జాబితా' >
< అని >
< a id = 'యాంకర్1' href = '#' > యాంకర్ ఎలిమెంట్ 1 < / a >
< / అని >
< అని >
< a id = 'యాంకర్2' href = '#' > యాంకర్ ఎలిమెంట్ 2 < / a >
< / అని >
< అని >
< a id = 'యాంకర్ 3' href = '#' > యాంకర్ ఎలిమెంట్ 3 < / a >
< / అని >
< / ఉల్ >
< / div >
< p > పై జాబితా నుండి యాంకర్ ఎలిమెంట్స్ యొక్క IDలను పొందడానికి క్రింది బటన్‌పై క్లిక్ చేయండి! < / p >
< బటన్ క్లిక్ చేయండి = 'myFunction()' > IDలను పొందండి < / బటన్ >
< p id = 'మూలం' >< / p >
< స్క్రిప్ట్ >
ఫంక్షన్ myFunction() {
listItems = document.querySelectorAll('#list a[id]');
కోసం (నేను = 0; i < listItems.length; i++ ) {
వీలు id = జాబితా అంశాలు [ i ] . id ;
document.getElementById ( 'మూలం' ) .innerHTML + =
'యాంకర్ ఎలిమెంట్ యొక్క ID' + ( నేను + 1 ) + ' అంటే: ' + id + '
';
}
}
< / స్క్రిప్ట్ >
< / శరీరం >
< / html >
పై కోడ్ యొక్క వివరణ క్రింది విధంగా ఉంది:
- IDతో ఆర్డర్ చేయని జాబితా ' జాబితా 'లో సృష్టించబడింది మరియు కలిగి ఉంది ' టాగ్లు.
- జాబితా అంశాలలో మూడు యాంకర్ ట్యాగ్‌లు సృష్టించబడ్డాయి మరియు IDలతో అందించబడతాయి ' యాంకర్1 ',' యాంకర్2 ', మరియు' యాంకర్ 3 ” వరుసగా.
- తరువాత, ఒక ' ” మూలకం సృష్టించబడింది మరియు కొంత వచన కంటెంట్‌ని కలిగి ఉంది.
- తరువాత, బటన్ మూలకం “ని ఉపయోగించి సృష్టించబడుతుంది <బటన్> ' టాగ్లు. ది ' onclick() 'బటన్ యొక్క లక్షణం' అనే ఫంక్షన్‌తో అందించబడింది. myFunction() ”.
- ఖాళీ' 'ID తో మూలకం' కోసం ” సృష్టించబడింది.
- తరువాత, లోపల ' <స్క్రిప్ట్> 'ట్యాగ్‌లు, ' పేరుతో ఒక ఫంక్షన్ myFunction() ” సృష్టించబడింది.
- ఫంక్షన్ లోపల, ఒక స్థిరమైన పేరు ' జాబితా అంశాలు ” సృష్టించబడింది.
- ఈ స్థిరాంకం 'ని ఉపయోగించి అన్ని యాంకర్ మూలకాల IDలతో అందించబడుతుంది document.querySelectorAll() ” పద్ధతి. ఈ పద్ధతి జాబితా యొక్క ఐడితో అందించబడింది మరియు '' a[id] ”.
- అప్పుడు, ఒక ' కోసం 'లూప్' ద్వారా లూప్ చేయడానికి సృష్టించబడింది జాబితా అంశాలు ” స్థిరమైన.
- యాంకర్ మూలకాల యొక్క IDలు '' స్థానంలో ముద్రించబడతాయి. p 'ID తో మూలకం' కోసం ”. ఇది 'ని ఉపయోగించి చేయబడుతుంది document.getElementById().innerHTML ” పద్ధతి.
అవుట్‌పుట్:
దిగువ అవుట్‌పుట్ నుండి, యాంకర్ ఎలిమెంట్‌లు జాబితాలో ఉన్నాయి మరియు వినియోగదారు “పై క్లిక్ చేయడం ద్వారా వారి ఐడిలను పొందవచ్చు. IDలను పొందండి ” బటన్.
లిస్ట్ ఐటెమ్‌లలోని యాంకర్ ఎలిమెంట్‌ల IDలను తిరిగి పొందడం అంటే అంతే.
ముగింపు
జాబితా అంశంలోని యాంకర్ మూలకం యొక్క IDని తిరిగి పొందడానికి, అంతర్నిర్మిత JavaScript ' document.querySelectorAll() ” పద్ధతిని ఉపయోగించవచ్చు. అదనంగా, ఈ యాంకర్ మూలకాల యొక్క పొందిన IDలను అంతర్నిర్మిత జావాస్క్రిప్ట్ ఉపయోగించి వెబ్‌పేజీలో ముద్రించవచ్చు ' .innerHTML() ” పద్ధతి. ఈ కథనం జావాస్క్రిప్ట్‌లోని జాబితా అంశంలోని యాంకర్ మూలకం యొక్క IDని తిరిగి పొందే విధానాన్ని అందించింది.