egyetem:webc2:dhtml:f1:reszek5m
Tartalomjegyzék
| Tantárgy: | Webes rendszerek kliens oldali programozása 2. [IM3314, WP3316] | |
| Tananyag: | DHTML | |
| Feladat: | Form létrehozása DHTML módszerrel | |
| Kidolgozás: | Feladat megoldása fejlesztési részfeladatok segítségével | |
| Részfeladat: | 5. részfeladat | |
Részfeladat
Felső szöveg létrehozása
Részfeladat megoldásának forrása
var rootDiv=funcCreateOneNode(1,"div");
// Felső sor létrehozása
rootDiv.appendChild(funcCreateOneNode(0,"Pitagorasz-tétel definíciója: a"));
rootDiv.appendChild(funcCreateOneKitevo());
rootDiv.appendChild(funcCreateOneNode(0," + b"));
rootDiv.appendChild(funcCreateOneKitevo());
rootDiv.appendChild(funcCreateOneNode(0," = c"));
rootDiv.appendChild(funcCreateOneKitevo());
Megoldás forráskódja
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Form létrehozása DHTML módszerrel - 5</title>
<meta name="author" content="Tóth Péter" />
<meta name="copyright" content="© 2012, NYME SEK" />
<meta http-equiv="date" content="2012-09-11" />
<meta name="revised" content="Tóth Péter, 11/09/2012" />
<meta name="description" content="DHTML - Form létrehozása DHTML módszerrel" />
<meta http-equiv="content-language" content="hu" />
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
<script type="text/javascript">
<!--
// Egy NODE elkészítése egyedi paraméterekkel
// iTipus - Megmutatja, hogy milyen típusú NODE-t kell készíteni
// 0 - TEXT NODE
// 1 - TAG NODE
// sName - Mi legyen a NODE szövege vagy mi a TAG neve
// Minden további láthatatlan paraméter valamilyen attributúm nevét és értékét takarja (mindig együtt kell szerepeljenek!)
// Visszatérésként az elkészített NODE-t adja vissza a függvény
function funcCreateOneNode(iTipus,sName){
if(iTipus==0){
// Szöveges NODE létrehozása
var newNode=document.createTextNode(sName);
}else{
// TAG NODE létrehozása
var newNode=document.createElement(sName);
// Attribútumok lekezelése; ha nem csak 2 paramétere volt a függvénynek
if(arguments.length>2){
// Minden egymást követő 2 paraméter feldolgozása attribútum beállítása céljából
i=2;
while(i<arguments.length){
// Az első az attribútum neve
// A második az attribútum értéke
newNode.setAttribute(arguments[i],arguments[i+1]);
i+=2;
}
}
}
return newNode;
}
// Egy kitevőt elkészítő függvény
function funcCreateOneKitevo(){
// Felső kitevő TAG létrehozása
var newKitevo=funcCreateOneNode(1,"sup");
// TAG-ben szereplő szöveg létrehozása és csatolása a kitevő TAG-hez
newKitevo.appendChild(funcCreateOneNode(0,"2"));
return newKitevo;
}
// OnLoad
function funcStart(){
var rootDiv=funcCreateOneNode(1,"div");
// Felső sor létrehozása
rootDiv.appendChild(funcCreateOneNode(0,"Pitagorasz-tétel definíciója: a"));
rootDiv.appendChild(funcCreateOneKitevo());
rootDiv.appendChild(funcCreateOneNode(0," + b"));
rootDiv.appendChild(funcCreateOneKitevo());
rootDiv.appendChild(funcCreateOneNode(0," = c"));
rootDiv.appendChild(funcCreateOneKitevo());
}
-->
</script>
</head>
<body onload="funcStart()"></body>
</html>
egyetem/webc2/dhtml/f1/reszek5m.txt · legutóbbi módosítás: (külső szerkesztés)
