Jarcec’s site

Had Internet Explorer a ID v non-div prvcích

January 7, 2007 on 7:32 pm | In Poznámečky |

Had v nadpise zastupuje Vámi vybrané sprosté slovo na adresu tohoto webového prohlížeče. Celý den si dnes hraju s AJAXem a snažím se vyřešit jeden jediny problém. Už jsem zavrhnul mnoho “konspiračních” teorií co IE umí či neumí (že Zbyňku ) a došel konečně do stavu, kdy jsem nejen schopen identifikovat problém (což mimochodém nebylo úplně jednoduché, číslo řádku kde je chyba mám asi od půl dvanácté), ale taky Vám nabídnout možné řešení.

Mám tabulku v HTML dokumentu s ID ‘file-list’, která je prázdná - data do ní chci vložit až JavaScriptem. Můj první pokus s využitím metody innerHTML fungoval ve všech prohlížečích (a zase ta filosofická debata, jestli něco tak odfláknutého jako IE je vůbec hodno nosit “titul” webový prohlížeč):

<table id="file-list">
</table>
...
document.getElementById('file-list').innerHTML += '<tr><td>Neco</td></tr>';

Úkol je jednoduchý, vložit do tabulky další HTML kód a rozšířit ji tak o další řádky (které JavaScript získá ze serveru). Jak jsem již řekl, IE tento řádek nerozchodí a aby to nebylo tak jednoduché, tak Vám ani nepoví co se stalo - Uknown runtime error. Mě to tedy moc neřeklo,ale aspoň máte číslo řádky, kde se nachází “vadné” místo. Ale na řešení mi stejně zbyla jen metoda pokusů a omylů…

…až jsem došel k něčemu co se chytlo a mě došlo co přesně IE vadí. IE metodou innerHTML neumí dávát text do jiného prvku než div (možná i span, nezkoušel jsem). Pokusím-li se takto vložit texto do jiného prvku (table, tbody, etc…), tak spadne na chybě, kterou si můžete prohlédnou výše.

Řešení

Obejít to lze jednoduše, i když o dost složitěji než prostým vložením HTML entit. Jde totiž využít DOM a HTML entity tam vytvořit přes něj:

tr = document.createElement("tr");
td = document.createElement("td");
tr.appendChild(td);
neco = document.createTextNode("Neco");
td.appendChild(neco);
document.getElementById('file-list').appendChild(tr);

Mě osobně teda o dost přehlednější příjde metoda s innerHTML, ovšem vývojáři z Redmontu si to očividně nemyslí, takže budu holt muset využít ten druhý přístup, jelikož tentokráte potřebuji funkčnost v IE :’(. Tak nějak začínám litovat všechny vývojáře, kteří jsou nuceni vytvářet xrůzných technik na jednu a tu samou věc jen kvůli jednomu nekompatibilnímu cosi…