čtvrtek 15. dubna 2004

Náhrada innerHTML a innerText přes DOM

Prohlížeč Internet Explorer 4.0 zavedl v DHTML property innerHTML a innerText, ktéré umožňují dynamicky náhradit obsah elementu. Rozdíl mezi nimi je v tom, že innerHTML pracuje s elementy a umožňuje vkládat celé části HTML kódu, innerText umí naopak pouze textový obsah.

InnerHTML a innerText přežívají v prohlížečích z rodiny Internet Explorer dodnes, avšak jejich využívaní bych spíše nedoporučoval. S masivním rozšířením implementace DOM máme k dispozici obecně přijaté rozhraní, které nám umožňuje proprietární inner vlastnosti opustit.

Nebudeme moc teoretizovat a vrhneme se přímo na jádro pudla. DOM definuje na objektu Document metodu createElement, pomocí této metody můžeme vytvářet elementy specifikovaného typu. Chceme li například vytvořit element div, použijeme následující konstrukci.

 
   <script type="text/javascript">
	var newElement = document.createElement("div");
   </script> 
 

Tímto kódem jsme vytvořili HTMLDivElement, ale to dodávám jen pro zajímavost. Tento nový element není prozatím součástí dokumentu. Pro připojení k dokumentu slouží metoda appendChild definovaná rozhraním Node. Připojení nového elementu si opět ukážeme na jednoduchém příkladu.

    
   <body>
     <div id="foo">
        <ul>
          <li>Bar</li>
          <li>Acme</li> 
        </ul>
     </div>
     <script type="text/javascript">
       var newElement = document.createElement("div");
       /*získáme referenci na uzel, ke kterému chceme připojit nový element*/
       var refNode = document.getElementById("foo");
       refNode.appendChild(newElement);//provedeme připojení           
     </script>      
   </body>
 

Vytvoření textového obsahu, který nám zde chybí a element by bez něj byl bezpředmětný, poslouží zároveň jako ukázka náhrady innerText. Textový obsah se tvoří podobně jako předešlé elementy a slouží k tomu metoda createTextNode definovaná opět rozhraním Document.

    
   <body>
     <div id="foo">
        <ul>
          <li>Bar</li>
          <li>Acme</li> 
        </ul>
     </div>
     <script type="text/javascript">
       var newElement = document.createElement("div");       
       var newText = document.createTextNode("bar.acme.com");
       newElement.appendChild(newText);       
       var refNode = document.getElementById("foo");
       refNode.appendChild(newElement);               
     </script>      
   </body>
 

Z ukázky je vidět, že použití DOMu je oproti innerHTML a innerText pracnější, ovšem máme zaručenu funkčnost ve všech prohlížečích podporujících DOM. Na druhou stranu musím poznamenat, že innerHTML byla implementována například v Mozille i přes fakt, že není součástí DOM.

Související články

středa 14. dubna 2004

Souboj na poli IDE - NetBeans hlásí další vylepšení

Vývojové prostředí NetBeans se těší solidní základně uživatelů a štědré podpoře a vývoji firmou Sun. Není proto divu, že v konkurenci takových IDE jako Eclipse či IntelliJ IDEA se neustále pracuje na rozšiřování a vylepšování funkčnosti.

Na sklonku měsíce března proběhl zajímavý chat na téma What's New and Cool in NetBeans?. Na otázky odpovídal technologický vedoucí projektu NetBeans Ian Formanek a Sun senior product manager Larry Baron. Diskutovaná témata byla opravdu zajímavá.

  • Kompatibilita plug-inu mezi Eclipse a NetBeans
  • Podpora vývoje J2ME aplikací
  • Změny mezi verzemi 3.6 a 4.0
  • Podpora vývoje Java Server Faces
  • GUI editor
  • Jazykové mutace prostředí, dokonce zmíněná příprava české lokalizace

Zcela jistě by neměly zůstat stranou postřehy Jirky Hradila Finální NetBeans 3.6 , NetBeans 3.6 RC1 a NetBeans Refactoring Preview, který dění kolem NetBeans pečlivě monitoruje.

Uvolněn JDeveloper 10g

Na poli vývojových prostředí není vůbec nuda o čemž svědčí oficiální vypuštění komerčního IDE JDeveloper 10g. Více informací včetně pěkné řádky nových funkcí sepsal Shay Shmelzer v článku Oracle releases Oracle JDeveloper 10g Production.

úterý 13. dubna 2004

XPath - opakování

Každý kdo pracuje s XSL se jistě setkal s jazykem XPath. XPath slouží, zjednodušeně řečeno, k pohybu v XML datech. Pomocí výrazů tohoto jazyka můžeme určovat uzly XML dokumentu, se kterými se bude pracovat. Petr Bříza v článku Základy jazyka XPath ukazuje spolu s popisem základní konstrukce a možnosti tohoto jazyku.