Werk met teksvelde in JavaScript
Nou sal ons leer hoe om teks van gebruikers van ons webwerf te kry. Hiervoor is daar 'n spesiale HTML-tag input, wat 'n teksveld vir data-invoer verteenwoordig.
<input>
Hierdie tag het 'n spesiale attribuut value, wat die aanvanklike teks stel wat in die invoerveld sal verskyn wanneer die bladsy gelaai word:
<input value="text">
Die gebruiker van ons webwerf kan die teks in die invoerveld verander nadat die bladsy gelaai is. As ons 'n veranderlike het wat na hierdie invoerveld verwys, sal die value-eienskap van daardie veranderlike altyd die huidige tekswaarde van die invoerveld bevat.
Laat ons dit in die praktyk probeer. Gestel ons het 'n invoerveld met die attribuut value:
<input id="elem" value="text">
Laat ons 'n verwysing na hierdie invoerveld in 'n veranderlike kry:
let elem = document.querySelector('#elem');
En nou, laai ons die huidige teks van die invoerveld op die skerm:
console.log(elem.value);
En nou, verander ons die teks van die invoerveld na 'n ander een:
elem.value = 'new text';
Gegee 'n invoerveld en 'n knoppie. Wanneer die knoppie gedruk word, skryf enige teks in die invoerveld.
Gegee 'n invoerveld, 'n paragraaf en 'n knoppie. Wanneer die knoppie gedruk word, skryf die teks van die invoerveld in die paragraaf.
Gegee twee invoervelde en 'n knoppie. In die eerste invoerveld voer die gebruiker 'n nommer in. Wanneer die knoppie gedruk word, skryf die kwadraat van die ingevoerde nommer in die tweede invoerveld.
Gegee twee invoervelde en 'n knoppie. Wanneer die knoppie gedruk word, skryf die waarde van die tweede invoerveld in die eerste invoerveld, en die waarde van die eerste invoerveld in die tweede invoerveld. Jou kode moet universeel werk, vir enige waardes van die invoervelde.
Gegee 5 invoervelde, 'n paragraaf en 'n knoppie. Nommers word in die invoervelde ingevoer. Wanneer die knoppie gedruk word, skryf die gemiddelde van die ingevoerde nommers in die paragraaf.
