×
COOKIES
Prezeraním tejto stránky dochádza k spracovaniu cookies. Spracovaniu cookies zabránite v nastaveniach internetového prehliadača alebo nezobrazovaním tejto stránky v internetovom prehliadači.
Technologický web Mateja Lednára
Spoznávajte svet technológií

Tipy a triky - ako rýchlo spraviť dokument HTML editovateľným

Jazyk HTML5 prináša nový atribút contenteditable, ktorý umožňuje editovať elementy v dokumente. A práve na tejto vlastnosti je založený nasledujúci trik, ktorý rýchlo spraví celý obsah dokumentu HTML editovateľným. Pre sfunkčnenie uvedeného kódu je možné použiť šablónu dokumentu HTML5.
Pre internetové prehliadače podporujúce vlastnosť contenteditable a metódu querySelectorAll() stačí použiť nasledujúci programový kód.
Príklad: Zápis do elementu <script>.
1
2
3
4
5
var nodes = document.querySelectorAll("body *");
var length = nodes.length, i = 0;
for (i; i < length; i++) {
nodes[i].setAttribute("contenteditable", true);
}
Pre internetové prehliadače podporujúce iba vlastnosť contenteditable je možné použiť nasledujúci programový kód.
Príklad: Zápis do elementu <script>.
1
2
3
4
5
6
var body = document.getElementsByTagName("body")[0];
var nodes = body.getElementsByTagName("*");
var length = nodes.length, i = 0;
for (i; i < length; i++) {
nodes[i].setAttribute("contenteditable", true);
}

Záver

Týmto krátkym zápisom v jazyku JavaScript je možné po kliknutí na text meniť ľubovoľný obsah v dokumente.
Autor: Matej Lednár
Dátum: 24.4.2013
Kategória: JavaScript
Značky: tipy a triky, textarea, programovanie, html, css, dom, javascript, contenteditable, queryselectorall
JavaScript,tipy a triky,textarea,programovanie,HTML,CSS,DOM,JavaScript,contenteditable,querySelectorAll
Žiadna časť tohto článku nesmie byť reprodukovaná bez uvedenia autora a URL na túto stránku.
Viac informácií nájdete v sekcii O projekte.

Komentáre

Článok neobsahuje zatiaľ žiadne komentáre.

Pridať komentár

Meno (povinné)
Web
Správa (povinné)
Odoslať
Od najnovších