A bemeneti és kimeneti egyszerű javascript
Az első cikkben megnéztük, hogyan kell módosítani a DOM, mutatni valamit. majd megnéztük, hogyan kell kezelni a felhasználói eseményekre. Ezúttal fogjuk látni, hogyan lehet néhány felhasználói input, valamint összekapcsolja őket másokkal, hogy egy egyszerű oldal, amely várja Önt.
Ebben a példában van egy kicsit több HTML, mint valaha. Emellett gomb és a div. ahol megmutatjuk az eredményeink, mi is két elemet bemenet. Mindegyik saját azonosítóját.
Ha rákattint a Try linkre, látni fogja a két beviteli mezők és gombok:
Alkalmazzuk ezt a módszert, hogy letölteni a tartalmát mind input elemek és hozzárendeli az értékét két változó: fname és lname.
Ezután, ezeket a változókat hozunk létre HTML-kódrészlet és rendeljen hozzá egy új változó html.
Aztán meg a innerHTML tulajdonság (ahogyan azt korábban), hogy bemutassák a generált HTML. Az eredmény a következőképpen nézhet ki:
Nehézkes HTML
Még egy ilyen egyszerű HTML + fel kell használni egy párszor, és kódok meglehetősen olvashatatlan. Képzeljük el, mi történne, ha azt akartuk, hogy hozzon létre egy összetettebb alkalmazás, ahol szeretnénk generálni olyan listákat, vagy akár asztalra. HTML generálása menet közben, és helyezze be a DOM lenne meglehetősen kellemetlen.
A backend írt Perl, Python, Ruby vagy, az emberek szembesülnek ugyanazokkal a problémákkal. A megoldás az volt, hogy hozzon létre a különböző sablonrendszer. Elvileg a sablon egy HTML-kódrészlet néhány helyőrzők (kulcsszavak), egyfajta függvény megkapja ezt a HTML kódot (sablon), mint a paraméter, valamint több kulcsértékpárokat. A függvény visszaküldi egy új HTML-kódrészlet, amely helyőrzők helyébe a kapott értékeket a megfelelő billentyűket.
