JavaScript Element hasAttributeNS() Method

What You’ll Learn

Element.hasAttributeNS() is an instance method that returns true or false depending on whether a namespaced attribute exists. Learn MDN’s guard pattern, SVG xlink:href, when to prefer hasAttribute() for plain HTML, pairing with getAttributeNS(), and five try-it labs aligned with MDN.

Introduction

Most HTML attributes are checked with hasAttribute("href"). When an attribute belongs to a namespace — common in SVG and XML — you need hasAttributeNS(namespace, localName) instead.

MDN: if you work with HTML documents and do not need to specify the attribute as part of a namespace, use hasAttribute(). Reach for hasAttributeNS() when namespace URIs matter.

This page is part of JavaScript Element. Pair checks with getAttributeNS() when you need the value.

Understanding the hasAttributeNS() Method

Calling el.hasAttributeNS(namespace, localName) checks whether the element has an attribute in the given namespace with the given local name.

• It is an instance method on Element.
• namespace — a string with the attribute namespace URI (MDN).
• localName — the attribute local name without prefix (MDN).
• Returns true when the namespaced attribute exists.
• Returns false when it does not.
• Does not return the value — use getAttributeNS() for that.
• For plain HTML attributes, prefer hasAttribute() (MDN).

📝 Syntax

General form of Element.hasAttributeNS (MDN):

hasAttributeNS(namespace, localName)

Parameters

namespace — a string specifying the namespace of the attribute (MDN).

localName — the name of the attribute without namespace prefix (MDN).

Return value

A boolean: true if the namespaced attribute exists, false otherwise (MDN).

Common patterns

const XLINK_NS = "http://www.w3.org/1999/xlink";

// MDN guard pattern
const d = document.getElementById("div1");
if (d.hasAttributeNS(
  "http://www.mozilla.org/ns/specialspace/",
  "special-align"
)) {
  d.setAttribute("align", "center");
}

// SVG xlink:href check
if (anchor.hasAttributeNS(XLINK_NS, "href")) {
  console.log(anchor.getAttributeNS(XLINK_NS, "xlink:href"));
}

Examples Gallery

Examples follow MDN Element.hasAttributeNS() patterns. Use View Output or Try It Yourself for each case.

const XLINK_NS = "http://www.w3.org/1999/xlink";
const anchor = document.querySelector("svg a");

if (anchor.hasAttributeNS(XLINK_NS, "href")) {
  console.log("xlink:href is present");
} else {
  console.log("xlink:href is missing");
}

xlink:href is present

const NS = "http://www.mozilla.org/ns/specialspace/";
const d = document.getElementById("div1");

if (d.hasAttributeNS(NS, "special-align")) {
  d.setAttribute("align", "center");
  console.log("align set");
} else {
  console.log("special-align not found");
}

align set

const XLINK_NS = "http://www.w3.org/1999/xlink";
const anchor = document.querySelector("svg a");

if (anchor.hasAttributeNS(XLINK_NS, "href")) {
  console.log(anchor.getAttributeNS(XLINK_NS, "xlink:href"));
} else {
  console.log("no href");
}

https://example.com

const XLINK_NS = "http://www.w3.org/1999/xlink";
const anchor = document.querySelector("svg a");

const byHas = anchor.hasAttributeNS(XLINK_NS, "href");
const byGet = anchor.getAttributeNS(XLINK_NS, "xlink:href") !== null;

console.log(byHas);
console.log(byGet);
console.log(byHas === byGet);

true
true
true

const XLINK_NS = "http://www.w3.org/1999/xlink";
const anchor = document.querySelector("svg a");

console.log(anchor.hasAttributeNS(XLINK_NS, "href"));
console.log(anchor.hasAttribute("href"));

true
false

🚀 Common Use Cases

• Checking SVG xlink:href before reading link URLs.
• Guarding before getAttributeNS() on optional namespaced attrs.
• Validating custom XML namespace attributes in mixed documents.
• Feature-detecting namespaced hooks in SVG icons and charts.
• Readable conditionals instead of getAttributeNS() !== null.
• Teaching when namespace URIs matter vs plain hasAttribute().

📝 Notes

• Not Deprecated, Experimental, or Non-standard on MDN (Baseline Widely available, July 2015).
• For plain HTML attributes, MDN recommends hasAttribute() instead.
• Uses namespace URI + localName (without prefix).
• Returns true for presence regardless of attribute value.
• Pair with getAttributeNS() to read the value after checking.
• Related: hasAttribute(), getAttributeNS(), getAttribute(), JavaScript hub.

💡 Best Practices