Javascript 如何使用javascript获取div的值
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/11238508/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to get value of a div using javascript
提问by srinu
This is my div:
这是我的 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>
I want the value attribute of that div (value="1").
我想要那个 div 的 value 属性（value="1"）。
I am trying like this:
我正在尝试这样：
function overlay()
{
var cookieValue = document.getElementById("demo").value;
alert(cookieValue);
}
but it is showing "Undefined" how to get value 1 using javascript please suggest any solution,.
但它显示“未定义”如何使用 javascript 获取值 1 请提出任何解决方案。
回答by JAAulde
DIVs do not have a valueproperty.
DIVs 没有value财产。
Technically, according to the DTDs, they shouldn't have a valueattributeeither, but generally you'll want to use .getAttribute()in this case:
从技术上讲，根据 DTD，它们也不应该具有value属性，但通常.getAttribute()在这种情况下您会想要使用：
function overlay()
{
var cookieValue = document.getElementById('demo').getAttribute('value');
alert(cookieValue);
}
回答by Guidhouse
To put it short 'value' is not an valid attribute of div. So it's absolutely correct to return undefined.
简而言之，'value' 不是 div 的有效属性。所以返回 undefined 是绝对正确的。
What you could do was something in the line of using one of the HTML5 attributes 'data-*'
您可以做的是使用 HTML5 属性“data-*”之一
<div id="demo" align="center" data-value="1">
And the script would be:
脚本将是：
var val = document.getElementById('demo').getAttribute('data-value');
This should work in most modern browsers
Just remember to put your doctype as <!DOCTYPE html>to get it valid
这应该适用于大多数现代浏览器 只要记住把你的 doctype 设为<!DOCTYPE html>有效
回答by UltraInstinct
As I said in the comments, a <div>element does not have a valueattribute. Although (very) bad, it can be accessed as:
正如我在评论中所说，<div>元素没有value属性。尽管（非常）糟糕，但可以通过以下方式访问它：
console.log(document.getElementById('demo').getAttribute);
I suggest using HTML5 data-*attributes rather. Something like this:
我建议使用 HTML5data-*属性。像这样的东西：
<div id="demo" data-myValue="1">...</div>
in which case you could access it using:
在这种情况下，您可以使用以下方法访问它：
element.getAttribute('data-myValue');
//Or using jQuery:
$('#demo').data('myValue');
回答by csupnig
First of all
首先
<div id="demo" align="center" value="1"></div>
that is not valid HTML. Read up on custom data attributes or use the following instead:
那不是有效的 HTML。阅读自定义数据属性或使用以下内容：
<div id="demo" align="center" data-value="1"></div>
Since "data-value" is an attribute, you have to use the getAttribute functionto retrieve its value.
由于“数据值”是一个属性，您必须使用getAttribute 函数来检索其值。
var cookieValue = document.getElementById("demo").getAttribute("data-value");
回答by bart s
You can try this:
你可以试试这个：
var theValue = document.getElementById("demo").getAttribute("value");
回答by madhairsilence
Value is not a valid attribute of DIV
值不是 DIV 的有效属性
try this
尝试这个
var divElement = document.getElementById('demo');
alert( divElement .getAttribute('value'));
