web-dev-qa-db-fra.com

Comment obtenir la valeur d'une div en utilisant javascript

C'est mon 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>

Je veux l'attribut de valeur de cette div (valeur = "1"). 

J'essaye comme ça:

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

mais il montre "non défini" comment obtenir la valeur 1 en utilisant javascript s'il vous plaît suggérer toute solution ,.

javascripthtml
10
srinu

DIVs n'ont pas de value propriété .

Techniquement, selon les DTD, ils ne devraient pas avoir un value attribut non plus, mais vous voudrez généralement utiliser .getAttribute() dans ce cas:

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

En un mot, "valeur" n'est pas un attribut valide de div. Il est donc parfaitement correct de renvoyer non défini.

Ce que vous pouviez faire était d'utiliser l'un des attributs HTML5 «data- *».

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

Et le script serait:

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

Cela devrait fonctionner dans la plupart des navigateurs modernes Rappelez-vous simplement de mettre votre doctype sous la forme <!DOCTYPE html> pour le rendre valide.

9
Guidhouse

Comme je l'ai dit dans les commentaires, un élément <div> n'a pas d'attribut value. Bien (très) mauvais, on peut y accéder par:

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

Je suggère plutôt d'utiliser les attributs HTML5 data-*. Quelque chose comme ça:

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

auquel cas vous pouvez y accéder en utilisant:

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

Tout d'abord

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

ce n'est pas valide HTML . Consultez les attributs de données personnalisés ou utilisez plutôt les éléments suivants:

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

Puisque "data-value" est un attribut, vous devez utiliser la fonction getAttribute pour récupérer sa valeur.

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

Vous pouvez essayer ceci:

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

La valeur n'est pas un attribut valide de DIV

essaye ça

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