Komentáře k článku

HTML5: ukládáme si data k elementům

Už jste se někdy přistihli, že si ukládáte informace k dalšímu zpracování k elementům do atributů rel nebo class? Pokud ano, máme pro vás skvělé novinky: v HTML5 si můžete uložit libovolné informace do vlastních atributů, které jsou pro toto použití přímo určené. Pojďme si ukázat, jak na to.

Zpět na článek

8 komentářů k článku HTML5: ukládáme si data k elementům:

  1. Jenda

    Re: HTML5: ukládáme si data k elementům

    Můžu se zeptat co to znamená, že by jméno atributu nemělo obsahovat velká písmena? Co se stane když je použiju?

    1. Martin MalýAutor příspěvku

      Re: HTML5: ukládáme si data k elementům

      Předpokládám (netestoval jsem), že se nestane nic závažného – jen nebudete moct rozlišit mezi „data-elce-pelce“ a „data-elcePelce“, kvůli zmíněné konverzi spojovníků na camelCase zápis.

  2. kisame

    Ukládání otázek pro smazání

    Ahoj,

    jsem zvyklý do datových atributů odkazů, které v administraci něco mažou, ukládat potvrzovací otázku typu „Chcete opravdu smazat článek <název>?“.

    Narazil jsem ale na dva problémy:

    1) Co když bych v té otázce chtěl např. název článku tučně? Celá otázka by pak nemohla být pouze text, ale HTML. Jak se HTML do těchto atributů má ukládat? Nebo bych tu otázku měl raději dát do skrytého elementu dovnitř odkazu?

    2) Odkazy s konfirmační otázkou používají mírně odlišné CSS, zatím jsem to řešil selektorem *[data-confirm], což mi ale od začátku nepřipadalo čisté a tento článek to potvrzuje.

    Jak toto tedy řešit?

    1. Jiří Kosek

      Re: Ukládání otázek pro smazání

      ad 1. — elegantní řešení by samozřejmě bylo dovolit v HTML používat kdekoliv elementy a atributy ve vlastních jmenných prostorech. Do vlastního elementu byste si mohl uložit cokoliv. Bohužel hlavní lidé za HTML5 mají pupínky z XML, takže tuto možnost vytrvale blokují. Výsledkem jsou dost omezené data-atributy.

      Nicméně podle přesvědčení těchto lidí je naprosto v pořádku, do atributu vkládat fragmenty HTML kódu. Takový atribut je i v návrhu HTML5 (@srcdoc): http://dev.w3.org/html5/spec-author-view/the-iframe-element.html#attr-iframe-srcdoc

      Ve vašem případě tedy můžete použít něco jako:

      <button data-confirm=“Chcete opravdu smazat článek <b>Ze života hmyzu</b>?“ …>

      Konec konců v HTML zase tolik nevadí, že v atributu máte serializované HTML, protože v Javascriptu to lze kdykoliv naparsovat a vložit do DOMu pomocí innerHTML.

      ad 2. — nechápu co vám na tom *[data-confirm] přijde špatné? Samozřejmě o chlup čistší by asi bylo

      <button class=“confirm“ data-confirm=“Chcete opravdu smazat článek <b>Ze života hmyzu</b>?“ …>

      a v CSS používat .confirm, ale je tam zbytečná duplicita.

      1. bauglir

        Re: Ukládání otázek pro smazání

        ad 1. Naštěstí Vám, i panu Koskovi tito opupínkovaní lídé dovolí zaslat HTML5 dokument s content typem, který patří XHTML (např. application/xml nebo application/xhtml+xml) a voila – máte validní HTML5 dokument v XHTML serializaci :). Do kterého si samozřejmě můžete narvat elementy a atributy z vlastních namespaces.

        1. Jiří Kosek

          Re: Ukládání otázek pro smazání

          Nepředpokládám, že by se někdy nějak masově rozšířilo zasílání XHTML dokumentů s jiným MIME typem než text/html, takže omezené možnosti rozšiřitelnosti HTML5 jsou problém.

  3. Michal Augustýn

    Re: HTML5: ukládáme si data k elementům

    Ta ukázka nefunguje v IE ještě z dalších důvodů – např. použití nestandardního __defineGetter__ (od IE9 je možné použít defineProperty), použití addEventListe­ner/removeEven­tListener natvrdo (IE chce attachEvent/de­tachEvent).
    Celkově vzato, je to kandidát na zapouzdření v nějakém frameworku…

Napsat komentář

Tato diskuse je již příliš stará, pravděpodobně již vám nikdo neodpoví. Pokud se chcete na něco zeptat, použijte diskusní server Devel.cz

Zdroj: https://www.zdrojak.cz/?p=3381