A címke attribútumok tulajdonságként JavaScriptben

Most pedig tanuljuk meg, hogyan kell elérni a címkék attribútumait. Itt a következő szabály érvényes: minden címke attribútumnak megfelel egy azonos nevű tulajdonság a DOM elemben.

Nézzük ezt egy példán keresztül. Tegyük fel, hogy van egy ilyen címkénk:

<input id="elem" type="text">

Kapjunk hivatkozást az elemünkre egy változóba:

let elem = document.querySelector('#elem');

Írjuk ki a szükséges attribútumok értékeit:

console.log(elem.id);   // kiírja 'elem'-et
console.log(elem.type); // kiírja 'text'-et

És most példaként változtassuk meg az attribútum értékét:

elem.type = 'submit';

Adott a következő input:

<input id="elem" type="email">

Adott egy gomb is. A gomb megnyomásakor írja ki a képernyőre a fenti input type attribútumának tartalmát.

Adott a következő input:

<input id="elem" type="email">

Adott egy gomb is. A gomb megnyomásakor írja a type attribútumba a submit értéket.

Tegyük fel, hogy van egy linke a a címke formájában, egy gombja és egy bekezdése. A gomb megnyomásakor írja ki a bekezdésbe a link href attribútumának tartalmát.

Tegyük fel, hogy van egy linke és egy gombja. A gomb megnyomásakor adja hozzá a link szövegéhez annak href attribútumának tartalmát kerek zárójelek között.

Tegyük fel, hogy van egy képe. Helyezze el a weboldalon a img címke segítségével. Tegyük fel, hogy adott egy gomb és egy bekezdés is. Tegye úgy, hogy a gombra kattintáskor a bekezdésbe a kép src attribútumából származó útvonal kerüljön.

Adott egy kép a img címkében és egy gomb. A gomb megnyomásakor a width attribútumba írja a 300 értéket.

Adott egy kép a img címkében és egy gomb. Tegyük fel, hogy a width attribútumban meg van adva egy bizonyos szélesség. Készítsen egy gombot, amelyre kattintva a kép szélessége 2 szorosára nő.

Tegyük fel, hogy két képe van. Készítsen a weboldalon egy img címkét és két gombot. Az első gomb megnyomásakor írja a src attribútumba az első kép útvonalát, a második gomb megnyomásakor pedig a második kép útvonalát.