Tag Kenmerke as Eienskappe in JavaScript
Laat ons nou leer hoe om die kenmerke van tags te verkry. Die volgende reël geld hier: elke kenmerk van 'n tag het 'n ooreenstemmende eienskap met dieselfde naam in die DOM-element.
Kom ons kyk na 'n voorbeeld. Gestel ons het die volgende tag:
<input id="elem" type="text">
Laat ons 'n verwysing na ons element in 'n veranderlike kry:
let elem = document.querySelector('#elem');
Laat ons die waardes van die kenmerke wat ons benodig, uitskryf:
console.log(elem.id); // sal 'elem' uitskryf
console.log(elem.type); // sal 'text' uitskryf
En nou, as voorbeeld, laat ons die waarde van die kenmerk verander:
elem.type = 'submit';
Die volgende invoerveld word gegee:
<input id="elem" type="email">
'n Knoppie word ook gegee. Wanneer op die knoppie gedruk word, vertoon
die inhoud van die type-kenmerk
van bogenoemde invoerveld op die skerm.
Die volgende invoerveld word gegee:
<input id="elem" type="email">
'n Knoppie word ook gegee. Wanneer op die knoppie gedruk word, skryf
die waarde submit in die type-kenmerk.
Gestel jy het 'n skakel in die vorm van 'n a-tag,
'n knoppie en 'n paragraaf. Wanneer op die knoppie gedruk word, vertoon
die inhoud van die skakel se href-kenmerk in die paragraaf.
Gestel jy het 'n skakel en 'n knoppie. Wanneer op
die knoppie gedruk word, voeg die inhoud van sy href-kenmerk by die einde van die skakelteks
in ronde hakies.
Gestel jy het 'n prent. Plaas dit
op die bladsy met behulp van die img-tag.
Gestel daar is ook 'n knoppie en 'n paragraaf. Maak
dit so dat wanneer op die knoppie geklik word, die
pad na die prent vanuit sy src-kenmerk in die paragraaf geskryf word.
'n Prent word gegee in die img-tag en 'n knoppie.
Wanneer op die knoppie gedruk word, skryf die waarde 300
in die width-kenmerk.
'n Prent word gegee in die img-tag en 'n knoppie.
Gestel 'n sekere breedte is in die width-kenmerk gespesifiseer.
Maak 'n knoppie wat, wanneer dit gedruk word,
die breedte van die prent met 2 keer sal vergroot.
Gestel jy het twee prente. Maak 'n
img-tag op die bladsy en twee knoppies. Wanneer
op die eerste knoppie gedruk word, skryf die pad na die eerste prent in die
src-kenmerk, en wanneer op die tweede gedruk word - die pad na die tweede prent.