Na JavaScriptu se mi tolik líbí, že je neuvěřitelně dynamický. Tak dynamické, že můžete upravit nativní objekty, pokud se tak rozhodnete. Jednou z dynamických vlastností, kterou v poslední době často používám, je attributes vlastnost prvků DOM. Tento attributes property mi poskytuje jména a hodnoty všech atributů na daném prvku!
HTML
Předpokládejme, že pracujeme s následujícím prvkem:
<div class="myClass" id="myId" title="Some text title">Some text</div>
Jednoduchý DIV s několika často používanými atributy. Můžeme použít getAttribute() získat atributy, když víme, že tam jsou, ale jak jednoduše získáme objekt obsahující všechny atributy?
JavaScript
Prvky DOM mají attributes vlastnost, která obsahuje všechny názvy a hodnoty atributů:
var attrs = document.getElementById("myId").attributes;
// returns NamedNodeMap {0: class, 1: id, 2: title, ...}
Pomocí Array.prototype.slice.call , což je také užitečné při převodu NodeLists na Arrays, můžete výsledek převést na skutečné pole, které můžete iterovat:
Array.prototype.slice.call(document.getElementById("myId").attributes).forEach(function(item) {
console.log(item.name + ': '+ item.value);
});
// class: myClass
// id: myId
// title: Some text title
attributes vlastnost prvku je neuvěřitelně užitečná, když hledáte, jaké atributy jsou přítomné, aniž byste explicitně věděli, které hledat; attributes vlastnost poskytuje úžasnou úroveň dynamiky.
Dokud jsem nezjistil potřebu uchopit každý atribut z prvku, nebyl jsem si vědom, že takový seznam existuje. Nyní, když jsem si této vlastnosti vědom, snažím se vymyslet způsoby, jak využít poskytnuté informace k ještě většímu posílení prvků. Pokud jste někdy našli užitečné použití attributes nemovitosti, sdílejte prosím!