HTML DOM -metoder og egenskaper
JavaScript kan også få tilgang til HTML -dokumentobjektmodellen (DOM) som ligner på andre programmeringsspråk. Alle HTML -elementer er definert som "objekter”I DOM, der hvert objekt har et sett med metoder og egenskaper. HTML DOM -egenskapen er en verdi som kan hentes eller endres, og HTML DOM -metoden er en handling som du kan utføre for HTML -elementer, for eksempel å slette HTML -elementer.
Denne oppskrivningen vil diskutere HTML DOM-metoder og egenskaper. Videre vil vi også tilby separate lister over de mest nyttige HTML DOM -metodene og egenskapene i JavaScript. Så la oss starte!
HTML DOM -metoder
“Handlinger”Du utfører på HTML -elementer kalles HTML DOM -metoder. Du kan bruke HTML DOM -metodene som en JavaScript -nybegynner for å generere de nødvendige resultatene uten å legge inn for mye krefter og skrive en haug med kode. HTML DOM -metodene kan hjelpe deg med å forenkle oppgaven.
I den undergitte tabellen har vi samlet noen av HTML DOM-metodene som kan brukes på alle HTML-elementer:
| HTML DOM -metoder | Beskrivelse |
| AddEventListener () | “AddEventListener ()”HTML DOM -metoden brukes til å knytte en hendelsesbehandler til et bestemt element. |
| vedlegg () | “vedlegg ()”Metoden brukes til å legge til en ny barneknute for et element. |
| uklarhet() | “uklarhet()”Metode brukes til å eliminere fokus fra et HTML -element. |
| Klikk () | “Klikk ()”Metoden tar på seg et museklikk på et HTML-element. |
| Clonenode () | “Clonenode ()”Metoden brukes til å klone et element. |
| nærmest () | “nærmest ()”HTML DOM -metoden brukes til å søke i DOM -treet etter det nærmeste elementet, som samsvarer med en spesifisert CSS -velger. |
| sammenlignedokumentPosisjon () | “sammenlignedokumentPosisjon ()”HTML DOM -metode brukes for å sammenligne dokumentposisjonen til to HTMLelements. |
| ExitfullScreen () | “Eksisterende fullskjerm ()”Eiendom avbryter et element i fullskjermmodus. |
| fokus() | “fokus()”HTML DOM -metode for å tildele fokus til et HTML -element. |
| getAttribute () | “getAttribute ()”HTML DOM -metoden viser et elements attributtverdi. |
| getAttributenode () | “getAttributenode ()”HTML DOM -metoden viser den spesifiserte attributtnoden. |
| GetBoundingClientRect () | “GetBoundingClientRect ()”HTML DOM -metoden gir ut plasseringen og størrelsen på et element relatert til visningsport. |
| getElementsByClassName () | “getElementByClassName ()”HTML DOM -metode viser listen over barneelementer i en bestemt klasse. |
| getElementsByTagName () | “getElementsByTagName ()”HTML DOM -metode viser listen over barnelementer i en bestemt tag. |
| HasAttribute () | “HasAttribute ()”HTML DOM -metoden gir ut sant hvis et element har den ekstra attributtet, ellers returnerer denne metoden falsk. |
| haschildnodes () | “haschildnodes ()”HTML DOM -metoden gir ut sant hvis et bestemt element har noen barneknuter, ellers returnerer denne metoden falsk. |
| InsertadJacentElement () | “InsertadJacentElement ()”HTML DOM -metoden brukes til å sette inn et HTML -element i en bestemt posisjon relatert til det aktive elementet. |
| INSERTADJACENTHTML () | “INSERTADJACENTHTML ()”HTML DOM -metoden brukes til å sette inn en HTML -formatert tekst i en bestemt posisjon relatert til det aktive elementet. |
| INSERTADJACENTTEXT () | “INSERTADJACENTTEXT ()”HTML DOM -metoden brukes til å sette inn tekst i en bestemt posisjon relatert til det aktive elementet. |
| INSERTBEFORE () | “INSERTBEFORE ()”HTML -metode brukes til å sette inn en ny barneknute før en eksisterende barneknute. |
| ISDefaultNamespace () | “ISDefaultNamespace ()”HTML DOM -metoden gir ut sant hvis et bestemt navneområde er satt som standard, ellers gir denne metoden falsk. |
| Isequalnode () | “Isequalnode ()”Metoden brukes til å sjekke om to HTML -elementer er like eller ikke. |
| Issamenode () | “Issamenode ()”HTML DOM -metoden brukes til å verifisere om to HTML -elementer er den samme noden eller ikke. |
| utstedt () | “utstedt ()”HTML DOM -metoden gir ut sant hvis en bestemt funksjon støttes for HTML -elementet. |
| fyrstikker() | “fyrstikker()”Metode sender ut en boolsk verdi som indikerer om en spesifikk CSS -velger samsvarer med et element eller ikke. |
| normalisere () | “normalisere ()”HTML DOM -metoden brukes til å gå sammen med tilstøtende tekstnoder og for å eliminere tomme tekstnoder fra et HTML -element. |
| QuerySelector () | “QuerySelector ()”HTML DOM -metoden brukes til å sende ut det første barneelementet som blir matchet med en bestemt CSS -velger av et HTML -element. |
| QuerySelectorAll () | “QuerySelectorAll ()”Metode returnerer alle barneelementer som samsvarer med en spesifisert CSS -velger av et element. |
| fjerne() | “fjerne()”HTML DOM -metoden brukes til å fjerne et bestemt HTML -element fra DOM. |
| Fjerning () | “Fjerning ()”HTML DOM -metode brukes for å fjerne en bestemt attributt fra et HTML -element. |
| REVERINGTRIBUTENODE () | “REVERINGTRIBUTENODE ()”HTML DOM -metode eliminerer den ekstra attributtnoden og viser den som utgang. |
| Fjerning () | “Fjerning ()”HTML DOM -metode brukes for å fjerne en bestemt en barneknute fra et HTML -element. |
| RemoveEventListener () | “RemoveEventListener ()”HTML DOM -metoden brukes til å fjerne en vedlagt hendelsesbehandler. |
| erstatnings () | “erstatnings ()”HTML DOM -metode brukes til å erstatte en barneknute fra et HTML -element. |
| RequestFulLscreen () | “RequestFulLscreen () ”HTML DOM -metode brukes for å vise HTML -elementet i fullskjermmodus. |
| ScrollIntoview () | “ScrollIntoview ()”HTML DOM -metoden brukes til å bla et bestemt HTML -element i nettleserens synlige område. |
| setAttribute () | “setAttribute ()”HTML DOM -metoden brukes for å sette attributtene til merverdien. |
| setAttributenode () | “setAttributenode ()”HTML DOM -metoden brukes til å endre eller vise den spesifiserte attributtnoden. |
| toString () | “toString ()”HTML DOM -metode brukes for å konvertere et element til en streng. |
HTML DOM -egenskaper
Verdiene du kan angi eller endre HTML -elementene kalles HTML DOM -egenskaper. HTML-egenskapene er definert av DOM, som enkelt kan modifiseres ved å bruke de forhåndsdefinerte HTML DOM-egenskapene.
Nå, sjekk ut tabellen nedenfor; Vi har samlet noen av HTML DOM -egenskapene som kan brukes på alle HTML -elementer:
| HTML DOM -egenskaper | Beskrivelse |
| tilgangsnøkkel | “tilgangsnøkkel”Setter eller returnerer AccessKey HTML DOM -eiendommen. |
| attributter | “attributter”HTML DOM -egenskapen gir ut en namennodemap av attributtet til et HTML -element. |
| ActiveElement | “ActiveElement”Eiendom får elementet som for tiden er aktiv. |
| ChildelementCount | “ChildelementCount”HTML DOM -eiendom brukes til å vise det totale antallet av et HTML -elements barneelementer. |
| Barneknoder | “Barneknoder”HTML DOM -eiendom sender ut barneknutene til et HTML -element. |
| Klasseliste | “Klasseliste”HTML DOM -eiendom returnerer et elements klassenavn. |
| klassenavn | “klassenavn”HTML DOM -eiendom brukes til å endre eller vise HTML -klassens navnverdi. |
| klienthøyde | “klienthøyde”HTML DOM -egenskapen gir HTML -elementets høyde. |
| ClientLeft | “ClientLeft”HTML DOM -eiendom brukes til å vise venstre grensens bredde på et HTML -element. |
| klienttop | “klienttop”HTML DOM -eiendom brukes til å vise toppgrensens bredde på et HTML -element. |
| klientbredde | “klientbredde”Eiendom returnerer eller gir ut bredden på et element, som inkluderer polstring. |
| innholdsvis | “innholdsvis”HTML DOM -eiendommer setter eller returnerer om innholdet til et element er redigerbart eller ikke. |
| dir | “dir”HTML DOM -eiendom brukes til å endre eller vise et elements DIR -verdi. |
| første barn | “første barn”HTML DOM -eiendom brukes til å vise den første barneknoden til et HTML -element. |
| FørstelementChild | “FørstelementChild”HTML DOM -eiendom brukes til å vise det første barneelementet i et HTML -element. |
| id | “id”HTML DOM -eiendom brukes til å endre og vise et elements ID -attributtverdi. |
| indrehtml | “indrehtml”HTML DOM -eiendom brukes til å endre og vise elementets innhold. |
| Innertekst | “Innertekst”HTML DOM -eiendom brukes til å endre og vise nodens tekstinnhold og dens etterkommere. |
| iscontenteditable | “iscontenteditable”HTML DOM -eiendom brukes til å sjekke om et elements innhold er redigerbart eller ikke. |
| lang | “lang”HTML DOM -eiendom brukes til å sette LANG -attributtets verdi av et HTML -element. |
| siste barn | “siste barn”Eiendom returnerer en elements siste barneknute. |
| LastElementChild | “LastElementChild”HTML DOM -eiendom brukes til å vise et elements siste barneelement. |
| namespaceuri | “namespaceurl”HTML DOM -eiendom brukes til å sende ut navneområdet URI for et HTML -element. |
| Nextsibling | “Nextsibling”HTML DOM -eiendom brukes til å vise neste node i et trenivå. |
| nextelementsibling | “nextelementsibling”HTML DOM -eiendom brukes til å vise det neste HTML -elementet i et trenivå. |
| Nodenavn | “Nodenavn”HTML DOM -egenskap sender nodenavnet. |
| Nodetype | “Nodetype”HTML DOM -egenskap brukes til å vise nodetypen. |
| Nodevalue | “Nodevalue”HTML DOM -eiendom brukes til å vise eller endre nodeverdien. |
| Eierdokument | “Eierdokument”Eiendomssett eller returnerer rotelementet eller dokumentobjektet for et element. |
| Parentnode | “Parentnode”HTML DOM -eiendom brukes til å vise overordnede noden til et element. |
| ParentElement | “ParentElement”HTML DOM -eiendom brukes til å vise HTML -elementets overordnede element. |
| Forrige | “Forrige”HTML DOM -eiendom brukes til å vise HTML -elementets forrige søsken. |
| Tidligere elementer | “Tidligere elementer”HTML DOM -eiendom brukes til å vise søsken av det forrige HTML -elementet. |
| ScrollHeight | “ScrollHeight”HTML DOM -eiendom brukes til å vise høyden på et HTML -element. |
| stil | “stil”HTML DOM -eiendom brukes til å endre eller vise attributtets verdi av et HTML -element. |
| tabindex | “tabindex”HTML DOM -egenskap brukes til å endre eller vise attributtets faneindeksverdi for et HTML -element. |
| tagname | “tagname”HTML DOM -eiendom brukes til å vise et elements tagnavn. |
| Tekstkonkurranse | “Tekstkonkurranse”HTML DOM -eiendom brukes til å endre eller vise en nodes tekstinnhold. |
| tittel | “tittel”Brukes for å endre eller vise tittelattributts verdi av HTML -elementet. |
| skript | “skript”Eiendom brukes til å få alle skriptelementene. |
| stricterrorchecking | “stricterrorchecking”Eiendom brukes til å stille feilkontrollen til streng modus. |
| URL | “URL”HTML DOM -eiendom brukes til å få full nettadress i et HTML -dokument. |
Konklusjon
Et HTML -element definert som et objekt har noen DOM -egenskaper og metoder. HTML DOM -metoder Angi handlingen du vil utføre på HTML -elementet, mens HTML DOM -egenskapene er verdiene du ønsker å få eller angi et bestemt objekt eller HTML -element. Denne oppskrivningen diskuterte HTML DOM-metoder og egenskaper. Videre ga vi også separate lister over de mest nyttige HTML DOM -metodene og egenskapene i JavaScript.