Element#
Element.removeAttribute()#
Metoda removeAttribute() usuwa pierwszy atrybutu o określonej nazwie kwalifikowanej w danym elemencie.
Opis działania#
Samo wywołanie i poszczególne jego części najlepiej objaśnić na zapisie składniowym:
element.removeAttribute(qualifiedName);gdzie poszczególne człony oznaczają:
- element - węzeł będący obiektem kontekstu.
- qualifiedName - łańcuch znakowy reprezentujący nazwę kwalifikowaną usuwanego atrybutu w elemencie.
Algorytm wywołania metody removeAttribute(qualifiedName) nie jest skomplikowany. Dla lepszego zrozumienia tematu prezentuję go w całości:
- Usuń atrybut poprzez nazwę z przekazaniem qualifiedName i obiektu kontekstu, a następnie zwróć wartość
undefined.
Alternatywnie można skorzystać z podobnie działającej metody NamedNodeMap.removeNamedItem(). Trzeba jedynie pamiętać o możliwości zrzucenia przez nią błędu oraz o zwracaniu referencji do usuniętego atrybutu.
Prosty przykład:
<!DOCTYPE html>
<html>
<head>
<script>
window.onload = function(){
p = document.getElementsByTagName("p")[0]; // referencja do akapitu
p.setAttributeNS("www.test1.com", "ID", "Test1");
p.setAttributeNS("www.test2.com", "Class", "Test2");
p.setAttribute("id", "Identyfikator");
p.className = "Klasa1 Klasa2 Klasa3";
p.setAttributeNS("www.test3.com", "A:NEW", "Test3");
p.setAttributeNS("www.test4.com", "a:new", "Test4");
var info = document.getElementById("info");
}
function listAllAttr(){
var allAttr = p.attributes;
for (var i = 0; i < allAttr.length; i++){
var attr = allAttr[i];
info.innerHTML += "<br>" + attr.namespaceURI + " , " + attr.prefix + " , " + attr.name + " , " + attr.value;
}
}
function delAttr(name){
info.innerHTML = "Liczba atrybutów w akapicie (przed usunięciem): " + p.attributes.length + "<br>";
listAllAttr();
info.innerHTML += "<br><br>" + "Metoda removeAttribute('" + name + "'): " + p.removeAttribute(name)
+ "<br><br>" + "Liczba atrybutów w akapicie (po usunięciu): " + p.attributes.length + "<br>";
listAllAttr();
}
</script>
</head>
<body>
<p>Akapit z atrybutami ustawianymi z poziomu skryptu:</p>
<ul>
<li>p.setAttributeNS("www.test1.com", "ID", "Test1");</li>
<li>p.setAttributeNS("www.test2.com", "Class", "Test2");</li>
<li>p.setAttribute("id", "Identyfikator");</li>
<li>p.className = "Klasa1 Klasa2 Klasa3";</li>
<li>p.setAttributeNS("www.test3.com", "A:NEW", "Test3");</li>
<li>p.setAttributeNS("www.test4.com", "a:new", "Test4");</li>
</ul>
<p>Kliknij przycisk by usunąć atrybut o określonej nazwie z akapitu.</p>
<input type="button" value="removeAttribute('ID')" onclick="delAttr('ID')">
<input type="button" value="removeAttribute('id')" onclick="delAttr('id')">
<input type="button" value="removeAttribute('Class')" onclick="delAttr('Class')">
<input type="button" value="removeAttribute('class')" onclick="delAttr('class')">
<input type="button" value="removeAttribute('A:NEW')" onclick="delAttr('A:NEW')">
<input type="button" value="removeAttribute('a:new')" onclick="delAttr('a:new')">
<input type="button" value="removeAttribute('brak')" onclick="delAttr('brak')">
<p style="color: blue;">Szczegółowe informacje dla polecenia:</p>
<span id="info"></span>
</body>
</html>Na chwilę obecną jedynie przeglądarki Firefox i Chrome obsługują metodę removeAttribute() zgodnie z najnowszymi wymaganiami specyfikacji DOM4. IE uwzględnia atrybuty bez zwracania uwagi na wielkość znaków w ich nazwie kwalifikowanej.
Składnia Web IDL#
interface Element : Node { void removeAttribute(DOMString qualifiedName); }