Politika programování, internetu, software i věci veřejné - Novinky: JavaScript: DOM (díl 3.) atributy

JavaScript: DOM (díl 3.) atributy

Rozdíl mezi statickým a dynamickým HTML je, že uvnitř dynamického dokumentu vytvářeného pomocí DOM, mají prvky své dynamické atributy. Jednoduše řečeno, jde o tzv. vnitřní události prvků id, class, style. Článek demonstruje metodu document.getElementById (ID), která vrací obsah vybraného identifikátoru ID ve formě objektu.

Specifickými vnitřními událostmi disponují také ovládací prvky: button, input, textura, select, label. Pokud nejsou tyto prvky umístěny mezi elementem , lze je využít pro rozšíření grafického rozhraní www stránky. To dává webmasterům různé možnosti.

Odkaz na indentifikátor ID

Při psaní zdrojového kódu v HTML označíme jednotlivé odstavce např. identifikátorem id. Tzn., budeme se moci na ně dále odkazovat. Zároveň přidáme jméno JavaScript funkce obsluhující příslušný dynamický atribut (onclick), tedy událost, která vznikne při klepnutí myší na tlačítko, tzn kliknutím na tento HTML zápis.

<h1 id=ukazka onClick="ukazkaDHTML()"> Text, text, text... </h1>

Funkci UkázkaDHTML() můžeme dále upravit pomoci stylu. Upravit velikost písma, barvu, řez a pod. Provedené změny se ihned projeví. Ukážeme si tedy, jak se změní barva nadpisu na zelenou po kliknutí. Tyto postupy jsou v DHTML používány pro tzv rozbalovací dokumenty, kdy část dokumentu se po kliknuti na nadpis otevře.

function UkazkaDHTML() { document.all.ukazka.style.color ="#00ff99"; }

Např pomocí vlastnosti document.all.Nadpis.align můžeme podle skriptu Jiřího Koska takto měnit způsob zarovnání nadpisu. Zkopírujte si a vyzkoušejte otevřít soubor: Ukázka dynamického HTML 1.

Příklad:

<HTML>
<HEAD>
<TITLE>Ukázka dynamického HTML 1.</TITLE>
<SCRIPT LANGUAGE="JavaScript">

</SCRIPT>
</HEAD>
<BODY>
<H1 ID=Nadpis ALIGN=LEFT onClick="ChangeAlign()">Pokusný nadpis</H1>
<P ID=Odstavec1>Text odstavce teď není důležitý </P>
</BODY>
</HTML>

Autor: Vašek Pexa

Komentáře

#1 | Toura dne 26.07.2008 09:18

Jak je to s podporou prohlížečů IE, Mozilla? Podporují všechny DOM?*finger*

#2 | Pexa dne 26.07.2008 17:11

Správná připmínka.

Nejmenší podporou DOM je známá Opera. Nevím proč, když se honosí takovou moderní inovací! IE spolupracuje s DOM1 od verze 5. Nejlepší je snad v podpoře DOM Mozilla (Netscape 6.0, 7.0 a vyšší). Podporuje DOM1, poslední verze již nemají tolik chyb, ale ještě jich několik zbývá. Bohužel Netscape byl již ukončen a nyní jen dobíhá, převzal jej Flock.

Přidat komentář

Aby jste mohli přidávat komentáře, musíte být přihlášený.

admin	00:40:34
Kvetos	02:46:21
Lubkokr	03:16:42
Zitek	16:13:17
Toura	16:38:47
Olser	. 1 den.
LukePuke	. 1 den.
Pexa	. 2 dny.
fifa	. 2 dny.
Bernad	. 3 dny.

AppServ (MySQ...	1808
LeechFTP	532
Nástěnka form...	286
Apache-server...	263
Vypal - Burn4...	251