Taggar attribut som egenskaper i JavaScript
Låt oss nu lära oss att hämta attribut för taggar. Följande regel gäller här: varje tagg-attribut har en motsvarande DOM-egenskap med samma namn.
Låt oss titta på ett exempel. Låt oss säga att vi har följande tagg:
<input id="elem" type="text">
Låt oss få en referens till vårt element i en variabel:
let elem = document.querySelector('#elem');
Låt oss skriva ut värdena för de attribut vi behöver:
console.log(elem.id); // skriver ut 'elem'
console.log(elem.type); // skriver ut 'text'
Och låt oss nu som ett exempel ändra attributets värde:
elem.type = 'submit';
Följande inmatningsfält är givet:
<input id="elem" type="email">
En knapp är också given. Vid klick på knappen, skriv ut
innehållet i attributet type
för ovanstående inmatningsfält på skärmen.
Följande inmatningsfält är givet:
<input id="elem" type="email">
En knapp är också given. Vid klick på knappen, sätt
i attributet type värdet submit.
Låt oss säga att du har en länk i form av en a-tagg,
en knapp och ett stycke. Vid klick på knappen, skriv ut
innehållet i länkens attribut href i stycket.
Låt oss säga att du har en länk och en knapp. Vid klick
på knappen, lägg till i slutet av länktexten
innehållet i dess attribut href inom runda
parenteser.
Låt oss säga att du har en bild. Placera den
på sidan med hjälp av taggen img.
Låt oss säga att en knapp och ett stycke också är givna. Gör
så att vid klick på knappen i stycket skrivs
sökvägen till bilden från dess attribut src.
En bild i taggen img och en knapp är given.
Vid klick på knappen, sätt i attributet width
värdet 300.
En bild i taggen img och en knapp är given.
Låt oss säga att i attributet width är en viss
bredd satt. Gör en knapp som, vid klick, ökar
bildens bredd med 2
gånger.
Låt oss säga att du har två bilder. Skapa på
sidan en img-tagg och två knappar. Vid
klick på den första knappen, sätt i attributet
src sökvägen till den första bilden, och vid klick
på den andra - sökvägen till den andra bilden.