Obtenir la valeur de L'élément DOM en utilisant JavaScript pur
Y a-t-il une différence entre ces solutions?
Solution 1:
// HTML:
<input id="theId" value="test" onclick="doSomething(this.id, this.value)"/>
// JavaScript:
function doSomething (id, value) {
// ...
}
...et Solution 2:
// HTML:
<input id="theId" value="test" onclick="doSomething(this.id)" />
// JavaScript:
function doSomething(id){
var value = document.getElementById(id).value;
// ...
}
4 réponses
Oui, surtout! Je ne pense pas que le second fonctionnera (et si c'est le cas, pas très portably). Le premier devrait être OK.
// HTML:
<input id="theId" value="test" onclick="doSomething(this)" />
// JavaScript:
function(elem){
var value = elem.value;
var id = elem.id;
...
}
Cela devrait également fonctionner.
La deuxième fonction devrait avoir:
var value = document.getElementById(id).value;
Alors ils sont fondamentalement la même fonction.
Dans la deuxième version, vous passez la chaîne renvoyée par this.id. Pas l'élément lui-même.
Donc id.value Ne vous donnera pas ce que vous voulez.
Vous devez passer l'élément avec this.
doSomething(this)
Puis:
function(el){
var value = el.value;
...
}
Note: Dans certains navigateurs, le second fonctionnerait si vous le faisiez:
window[id].value
Parce que les ID d'élément sont une propriété globale, mais ce n'est pas sûr .
Il est le plus logique de simplement passer l'élément avec this au lieu de le récupérer à nouveau avec son ID.
Passez l'objet:
doSomething(this)
, Vous pouvez obtenir toutes les données de l'objet:
function(obj){
var value = obj.value;
var id = obj.id;
}
Ou passez le id seulement:
doSomething(this.id)
Récupère l'objet et après cette valeur:
function(id){
var value = document.getElementById(id).value;
}