Question

我有一个包含以下内容的html页面：

<div data-variableid2="1234"> </div>

如何获取元素的1234值（不使用jQuery）并使用alert()显示？

Answer 1

var elm = document.getElementsByTagName("div")[0]; //get element
alert(elm.getAttribute("data-variableid2")); //alert attribute

注意：你应该在div中添加一个id，并按id获取元素（性能）。

这是通过普通的Javascript完成的，不需要jQuery。

getAttribute() Reference

Answer 2

假设你不使用jQuery，（因为它没有被标记）：

HTML :(我使用id作为div元素来简化事情）：

<div id="example" data-variableid2="1234"></div>

<强>的JavaScript ：

// capture element
var example = document.getElementById('example');

// capture data variable value
var dataVar = example.getAttribute('data-variableid2');

// show it with alert
alert(dataVar);

以下是示例： js fiddle

修改

如果你不能使用id或类作为元素，你可以用它捕获它（0是元素的数量）：

var example = document.getElementsByTagName("div")[0];

如果（并且很有可能）它不是页面上唯一的div，您可以尝试 querySelectorAll

像这样：

// capture element - references to 0 which is the first matched element // because this will select group of elements with data-variableid2 var example = document.querySelectorAll("[data-variableid2]")[0];

以下是示例： js fiddle

Answer 3

首先，你应该给你的DIV一个id。

<div id="myid" data-variableid2="1234"> </div>

然后您可以使用

显示属性数据

var MyDiv1 = document.getElementById('myid');
alert(MyDiv1.getAttribute('data-variableid2'));

只需在此处测试：http://jsfiddle.net/5C4NA/

但如果您不允许更改网页的HTML，则应该坚持使用

之类的内容

document.getElementsByTagName("div")[0]

但索引（此处为0）确实因HTML页面中div的位置而异。

修改1：

使用循环，您可以扫描所有DIV并选择具有属性data-variableid2的DIV：http://jsfiddle.net/5C4NA/1/这看起来像：

var elm = document.getElementsByTagName("div");
for (i=0;i<elm.length;i++) {
    if (elm[i].getAttribute('data-variableid2')!=null) {
        alert(elm[i].getAttribute('data-variableid2'));
    }
}

Answer 4

你可以像使用jQuery

那样做

<div data-variableid2="1234"> </div>
<script>
     var data = $('div').attr('data-variableid2');
     alert(data);
</script>

JavaScript：从div元素中提取值

4 个答案: