的JavaScript - 得到HTML元素的屬性值

Question

我想顯示 'A' 字符作爲警報

HTML：

<span id="demo" name="a" onclick="validateForm1id1()"></span> 

的Javascript：

<script> 
    function validateForm1id1() { 
     var x = document.getElementById("demo").name; 
     alert(x); 
    } 
</script> 

Answer 1

由於@robg在說評論：

在大多數瀏覽器中，DOM元素通常只有r將標準屬性作爲DOM屬性反映（有一些例外）。名字不是跨度元素的標準屬性，所以你需要使用的getAttribute

你需要使用getAttribute從您span獲得name屬性。

var x = document.getElementById("demo").getAttribute("name"); 

Plunker來顯示它的工作。

如果您試圖在html元素中存儲任意數據，請查看data-*屬性。 Docs。

對於應該與特定元素關聯但不需要任何定義含義的數據，HTML5的設計考慮了可擴展性。 data- *屬性允許我們在標準語義HTML元素上存儲額外信息，而無需其他黑客（如classList），非標準屬性，DOM上的額外屬性或setUserData。

然後，您可以做

HTML：

<span id="demo" data-name="Span name using data-name" onclick="validateForm1id1()">Click me</span> 

JS：

function validateForm1id1() { 
    var x = document.getElementById("demo").dataset.name; 
    alert(x); 
} 

Plunker顯示data-*屬性。

Answer 2

請嘗試下面的代碼。您需要獲取屬性「名稱」。

function validateForm1id1() { 
    var x = document.getElementById("demo").getAttribute('name'); 
    alert(x); 
}