| Következő változat | Előző változat |
| egyetem:webc2:dhtml:f1:feladat [2012/07/25 12:46] – létrehozva peter | egyetem:webc2:dhtml:f1:feladat [2012/09/11 20:41] (aktuális) – peter |
|---|
| | Tantárgy:|[[egyetem:webc2:menu|Webes rendszerek kliens oldali programozása 2. [IM3314, WP3316] ]]| | | Tantárgy:|[[egyetem:webc2:menu|Webes rendszerek kliens oldali programozása 2. [IM3314, WP3316] ]]| |
| | Tananyag:|[[egyetem:webc2:dhtml:menu|DHTML]]| | | Tananyag:|[[egyetem:webc2:dhtml:menu|DHTML]]| |
| ====== Látogatások számának megjelenítése ====== | ====== Form létrehozása DHTML módszerrel ====== |
| ===== Feladat ===== | ===== Feladat ===== |
| Készítsük programot, amelyben kizárólag a DHTML módszerben megismert eszközökkel megjeleníti a következő képen látható formot: \\ \\ {{:egyetem:webc2:dhtml:f1:webc2_dhtml_f1.jpg|}} | Készítsük programot, amelyben kizárólag a DHTML módszerben megismert eszközökkel megjeleníti a következő képen látható formot: \\ \\ |
| | {{ :egyetem:webc2:dhtml:f1:webc2_dhtml_f1.jpg |Ezt a form-ot kell létrehozni!}} |
| ===== Specifikáció ===== | ===== Specifikáció ===== |
| - Az alap HTML oldalunknak a BODY részében nem helyezhetünk el semmilyen TAG-et!. \\ [[egyetem:webc2:dhtml:f1:help1|Segítség a megoldásához (elakadás esetére!)]] | - Minden elemet, amit dinamikusan létrehozunk egy DIV elem alá helyezzünk be a BODY részben. \\ [[egyetem:webc2:dhtml:f1:help4|Segítség a megoldásához (elakadás esetére!)]] |
| - A program forráskódjában nem alkalmazhatja az ".innerHTML" tulajdonságot! \\ [[egyetem:webc2:dhtml:f1:help1|Segítség a megoldásához (elakadás esetére!)]] | - Az alap HTML oldalunknak a BODY részében nem helyezhetünk el semmilyen TAG-et! \\ [[egyetem:webc2:dhtml:f1:help1|Segítség a megoldásához (elakadás esetére!)]] |
| - A program betöltődése után javascript utasításokkal dinamikusan hozzuk létre az egyes elemeket a BODY részbe a DHTML tananyagban megismert eszközökkel. \\ [[egyetem:webc2:dhtml:f1:help2|Segítség a megoldásához (elakadás esetére!)]] | - A program forráskódjában nem alkalmazhatja az ".innerHTML" tulajdonságot! \\ [[egyetem:webc2:dhtml:f1:help2|Segítség a megoldásához (elakadás esetére!)]] |
| ===== Feladat megoldása fejlesztési lépcsők segítségével ===== | - A program betöltődése után javascript utasításokkal dinamikusan hozzuk létre az egyes elemeket a BODY részbe a DHTML tananyagban megismert eszközökkel. \\ [[egyetem:webc2:dhtml:f1:help3|Segítség a megoldásához (elakadás esetére!)]] |
| | - Űrlap szükséges attribútumai: |
| | - A,B,C űrlapmezők: típusa: szöveges; szélessége: 20 karakter; nevük: "mezo_a", "mezo_b", "mezo_c" |
| | - Nyomógomb: típusa: "button"; neve: "gomb"; Felirata: "Pitagorasz-tétel számítás" |
| | - Soremeléshez használjuk a BR TAG-et. |
| | |
| | ===== Feladat megoldása fejlesztési részfeladatok segítségével ===== |
| Ne feledjük el, hogy az itt bemutatott fejlesztési lépcső csak egy irányvonal arra vonatkozólag, ahogy hogyan lehet elindulni az adott feladat megoldásában, de természetesen mindenki a saját elképzelése, gyakorlata, tapasztalata szerint készíthet el egy feladatot! \\ \\ | Ne feledjük el, hogy az itt bemutatott fejlesztési lépcső csak egy irányvonal arra vonatkozólag, ahogy hogyan lehet elindulni az adott feladat megoldásában, de természetesen mindenki a saját elképzelése, gyakorlata, tapasztalata szerint készíthet el egy feladatot! \\ \\ |
| [[egyetem:webc2:dhtml:f1:reszek1|1. lépcsőfok]] \\ | [[egyetem:webc2:dhtml:f1:reszek|Feladat kidolgozása részfeladatokkal]] \\ |
| [[egyetem:webc2:dhtml:f1:reszek2|2. lépcsőfok]] | |
| ===== Megoldás ===== | ===== Megoldás ===== |
| Az itt megjelenített megoldást lehetőleg csak arra használja, hogy segítséget nyerjen a feladat megfogalmazásának megértésére, de ne használja a program kódját az Ön által elkészítendő program kódjának megírásához! A másolással csak magát csapja be és megfosztja magát a szoftver fejlesztési képességének fejlődésétől! \\ \\ | Az itt megjelenített megoldást lehetőleg csak arra használja, hogy segítséget nyerjen a feladat megfogalmazásának megértésére, de ne használja a program kódját az Ön által elkészítendő program kódjának megírásához! A másolással csak magát csapja be és megfosztja magát a szoftver fejlesztési képességének fejlődésétől! \\ \\ |
| [[http://tptg.hu/egyetem/webc2/dhtml_f1.htm|Megoldás megtekintése]] \\ \\ | [[http://tptg.hu/egyetem/webc2/dhtml_f1.htm|Megoldás megtekintése]] \\ \\ |
| A forráslistát csak akkor tekintse meg, ha már végrehajtotta önálló munkával az adott feladat kidolgozását. Az itt megtekinthető megoldás csak segítség arra vonatkozólag, hogy milyen egy elkészített megoldás amely lefedi a feladat kiírásban foglaltakat maradéktalanul. Tudjuk, hogy egy kiírt feladat megoldáshoz számtalan formában juthatunk el, így ha az Ön megoldása megfelel a feladat kiirásban megfogalmazottaknak, akkor tökéletesen végrehajtotta a célt! Az, hogy egy kód mennyire optimális az már a fejlesztő tudásától, gyakorlatától és tapasztalatától függ, minél többet gyakorolja a fejlesztést annál inkább optimálisabb kódot fog készíteni. \\ \\ | A forráslistát csak akkor tekintse meg, ha már végrehajtotta önálló munkával az adott feladat kidolgozását. Az itt megtekinthető megoldás csak segítség arra vonatkozólag, hogy milyen egy elkészített megoldás amely lefedi a feladat kiírásban foglaltakat maradéktalanul. Tudjuk, hogy egy kiírt feladat megoldáshoz számtalan formában juthatunk el, így ha az Ön megoldása megfelel a feladat kiírásban megfogalmazottaknak, akkor tökéletesen végrehajtotta a célt! Az, hogy egy kód mennyire optimális az már a fejlesztő tudásától, gyakorlatától és tapasztalatától függ, minél többet gyakorolja a fejlesztést annál inkább optimálisabb kódot fog készíteni. \\ \\ |
| [[egyetem:webc2:dhtml:f1:forrasanyag|Elkészített program forráskódja]] | [[egyetem:webc2:dhtml:f1:forrasanyag|Elkészített program forráskódja]] |
