Question

这是我的div：

<div id="demo" align="center"  value="1">
    <h3>By Color</h3>
    <input type="radio" name="group1" id="color1" value="#990000"  onClick="changeColor()"/><label for="color1">Red</label>
    <input type="radio" name="group1" id="color2" value="#009900" onClick="changeColor()"/><label for="color2">Green</label>
    <input type="radio" name="group1" id="color3" value="#FFFF00" onClick="changeColor()" /><label for="color3">Yellow</label><br><br><br>
</div>

我想要该div的value属性（value =“1”）。

我这样想：

function overlay()
{
    var cookieValue = document.getElementById("demo").value;    
    alert(cookieValue);
}

但它显示“未定义”如何使用javascript获取值1请建议任何解决方案，。

Answer 1

DIV没有value 属性。

从技术上讲，根据DTD，它们也不应该有value 属性，但在这种情况下通常你会想要使用.getAttribute()：

function overlay()
{
    var cookieValue = document.getElementById('demo').getAttribute('value');
    alert(cookieValue);
}

Answer 2

简而言之，'value'不是div的有效属性。所以返回undefined绝对正确。

你可以做的就是使用HTML5属性之一'*'

<div id="demo" align="center"  data-value="1">

脚本将是：

var val = document.getElementById('demo').getAttribute('data-value');

这应该适用于大多数现代浏览器请记住将您的doctype设为<!DOCTYPE html>以使其有效

Answer 3

正如我在评论中所说，<div>元素没有value属性。虽然（非常）不好，但可以访问：

console.log(document.getElementById('demo').getAttribute);

我建议使用HTML5 data-*属性。像这样：

<div id="demo" data-myValue="1">...</div>

在这种情况下，您可以使用以下方式访问它：

element.getAttribute('data-myValue');
//Or using jQuery:
$('#demo').data('myValue');

Answer 4

首先

<div id="demo" align="center"  value="1"></div>

不是有效的HTML 。阅读自定义数据属性或使用以下内容：

<div id="demo" align="center" data-value="1"></div>

由于“数据值”是一个属性，您必须使用 getAttribute函数来检索其值。

var cookieValue = document.getElementById("demo").getAttribute("data-value");

Answer 5

你可以试试这个：

var theValue = document.getElementById("demo").getAttribute("value");

Answer 6

值不是DIV的有效属性

试试这个

var divElement = document.getElementById('demo');
alert( divElement .getAttribute('value'));

如何使用javascript获取div的值

6 个答案: