వెబ్ పేజీలోని కంటెంట్ను మార్చటానికి మేము జావాస్క్రిప్ట్ను ఉపయోగించవచ్చని మీకు తెలుసా? ఆసక్తికరంగా అనిపిస్తుందా? డాక్యుమెంట్ ఆబ్జెక్ట్ మోడల్ అంటే ఏమిటో అర్థం చేసుకుందాం. కింది పద్ధతిలో జావాస్క్రిప్ట్లో DOM:
- జావాస్క్రిప్ట్లో DOM అంటే ఏమిటి?
- జావాస్క్రిప్ట్లో DOM యొక్క చర్యలు
- DOM ని ప్రశ్నిస్తోంది
- ఈవెంట్స్ వినడం
- ఫారమ్లతో ఇంటరాక్ట్ అవుతోంది
- HTML ఎలిమెంట్లను సృష్టిస్తోంది
- CSS కలుపుతోంది
జావాస్క్రిప్ట్లో DOM అంటే ఏమిటి?
వెబ్పేజీ లోడ్ అయినప్పుడు బ్రౌజర్ చేత డాక్యుమెంట్ ఆబ్జెక్ట్ మోడల్ లేదా DOM సృష్టించబడుతుంది. గ్రాఫికల్ రూపంలో, ఇది మూలకాల చెట్టు లాంటిది, దీనిని నోడ్స్ అని కూడా పిలుస్తారు, ఇవి పేజీలోని ప్రతి మూలకాన్ని సూచించడానికి ఉపయోగిస్తారు.
మా వెబ్పేజీలోని అన్ని DOM డాక్యుమెంట్ ఆబ్జెక్ట్ లోపల ఉంటుంది. క్రమపద్ధతిలో, ఈ నమూనా మా పేజీ యొక్క కంటెంట్ను చదవడానికి లేదా మార్చడానికి కూడా అనుమతిస్తుంది . ఇది బాగుంది కదా?
జావాస్క్రిప్ట్లో DOM యొక్క చర్యలు
ఈ నమూనాతో మనం చేయగల కొన్ని చర్యలు:
పేజీలోని DOM లో HTML మూలకాలను మార్చండి / తొలగించండి.
మూలకాలకు CSS శైలులను మార్చండి మరియు జోడించండి
జావా మార్గాన్ని ఎలా సెట్ చేయాలి
లక్షణాలను చదవండి మరియు మార్చండి (href, src, alt), మొదలైనవి.
క్రొత్త అంశాలను సృష్టించండి మరియు వాటిని DOM / పేజీలో చేర్చండి.
ఈవెంట్ శ్రోతలను మూలకాలకు అటాచ్ చేయండి (క్లిక్ చేయండి, కీప్రెస్, సమర్పించండి)
జావాస్క్రిప్ట్లో DOM ని ప్రశ్నిస్తోంది
ఒక HTML మూలకాన్ని పట్టుకోవడం లేదా జోడించడానికి / మార్చడానికి లేదా కంటెంట్ను పట్టుకోవడం ప్రశ్న అని పిలుస్తారు.
HTML కోడ్:
జావా వెబ్ అప్లికేషన్లో సెషన్ నిర్వహణ
జావాస్క్రిప్ట్ మరియు DOM h1 {font-size: 60px}
జావాస్క్రిప్ట్ కోడ్:
var title = document.getElementById ('title') // cgangin color to red title.style.color = 'red' var body = document.getElementById ('body') // నేపథ్య రంగును లేత నీలం రంగు బాడీగా మార్చడం. backgroundColor = 'లైట్బ్లూ'
మేము జావాస్క్రిప్ట్ ఉపయోగించి టైటిల్ యొక్క టెక్స్ట్ రంగును నలుపు నుండి ఎరుపుకు మార్చాము. మేము దీనిని ఉపయోగించి సాధించాము .శైలి ఆస్తి అప్పుడు విలువను మార్చింది రంగు to equal to నెట్ .
ఇప్పుడు శరీర మూలకం యొక్క నేపథ్య రంగును మారుద్దాం లేత నీలం .
మాస్టర్స్ డిగ్రీ పోస్ట్ గ్రాడ్యుయేట్
దీనితో, మేము జావాస్క్రిప్ట్ వ్యాసంలో ఈ DOM యొక్క ముగింపుకు వచ్చాము. డాక్యుమెంట్ ఆబ్జెక్ట్ మోడల్స్ ఎలా పని చేస్తాయో మరియు జావాస్క్రిప్ట్లో అదే DOM ను ఎలా అమలు చేయాలో మీకు అవగాహన వచ్చిందని నేను ఆశిస్తున్నాను.
జావాస్క్రిప్ట్లో DOM గురించి ఇప్పుడు మీకు తెలుసు, చూడండి ఎడురేకా చేత. HTML5, CSS3, Twitter బూట్స్ట్రాప్ 3, j క్వెరీ మరియు గూగుల్ API లను ఉపయోగించి ఆకట్టుకునే వెబ్సైట్లను ఎలా సృష్టించాలో తెలుసుకోవడానికి మరియు దానిని అమెజాన్ సింపుల్ స్టోరేజ్ సర్వీస్ (S3) కు అమర్చడానికి వెబ్ డెవలప్మెంట్ సర్టిఫికేషన్ శిక్షణ మీకు సహాయం చేస్తుంది.
మాకు ప్రశ్న ఉందా? దయచేసి దీనిని “జావాస్క్రిప్ట్లోని DOM” యొక్క వ్యాఖ్యల విభాగంలో పేర్కొనండి మరియు మేము మిమ్మల్ని సంప్రదిస్తాము.