2017-07-20 1 views
1

Je me demandais comment je pouvais faire ce qui suit.Appliquer la valeur d'identifiant dans dom et la mettre à variable dans la fonction js

Je voudrais définir une div contenant un certain ID avec une valeur d'attribut spécifique. Appliquez ensuite cet identifiant à une variable dans une fonction, de sorte que lorsque j'appelle la fonction, elle applique la valeur de l'identifiant.

<html> 
<head></head> 
<body> 
<div id="1123123" value="idloader"> </div> 
</body> 
</html> 

La chaîne contenue dans l'ID doit être définie sur variable dans la fonction.

<script> 

function setTheId() { 
div.id.valueOf(id).hasAttribute([value="idloader"]) 
}; 

var XYZ = setTheId(); 

</script> 

En conclusion, le (var XYZ = 1123123) tel que défini à l'intérieur de l'identifiant d'élément DOM avec l'attribut value="idloader" doit être égale à la variable dans la fonction.

NOTE ... Ce n'est pas la même chose que Find an element in DOM based on an attribute value car nous n'essayons pas de trouver un élément dans le DOM basé sur l'attribut, mais définissons l'élément avec une chaîne spécifique qui peut être stockée dans une variable du script.

+0

Essayez-vous de trouver un élément avec cette propriété 'value =" idloader "' et retreive son 'id'? Si oui, pouvez-vous utiliser une propriété 'classname' au lieu d'une propriété' value'? Vous pourriez utiliser 'document.getElementsByClassName()' – wizebin

+0

@wizebin à quoi cela servirait-il? l'élément n'a même pas de classe -_- a –

+0

Copie possible de [Rechercher un élément dans DOM basé sur une valeur d'attribut] (https://stackoverflow.com/questions/2694640/find-an-element-in- dom-based-on-a-attribute-value). Puis [Javascript: setAttribute() v.s. element.attribute = valeur pour définir l'attribut "name"] (https://stackoverflow.com/q/8426461/215552) sauf évidemment avec l'attribut id. –

Répondre

0

Utilisez querySelectorAll pour obtenir tous les divs qui a un id et dont value attribut est égal à "idloader".

var elems = document.querySelectorAll('div[id][value="idloader"]'); 
 
for (var i = 0; i < elems.length; i++) { 
 
    console.log(elems[i].id); 
 
}
<div id="1123123" value="idloader"> </div> 
 
<div id="1123124" value="idloader"> </div> 
 
<div id="1123125"> </div> 
 
<div value="idloader"> </div>

Si vous souhaitez obtenir seulement le premier div qui correspond au sélecteur CSS spécifié, utilisez la méthode querySelector:

var MyID = document.querySelector('div[id][value="idloader"]').id; 
 
console.log(MyID);
<div id="1123123" value="idloader"> </div> 
 
<div id="1123124" value="idloader"> </div> 
 
<div id="1123125"> </div> 
 
<div value="idloader"> </div>

Remarque leL'attributn'est pas valide pour l'élément <div> conformément à HTML5 Specification. Utilisez data-* Attributes à la place.

+0

Cela fonctionne bien .. Merci. Je me demandais aussi s'il était alors possible d'utiliser le premier code coupé alors quand ajouter une variable javascript avec une fonction php ou liquide permettrait d'appeler chaque identifiant en fonction de l'endroit où il se trouve sur la page de haut en bas. Je ne pense pas que cela puisse arriver, alors il semblerait que je devrais exécuter une nouvelle valeur variable à chaque fois. – Digggid

0

Oui, c'est possible mais vous n'avez pas besoin de passer par tout cela pour obtenir le résultat désiré.

Pour obtenir un élément dont l'attribut est égal à une valeur spécifique, vous pouvez utiliser querySelector. Une fois que vous avez obtenu cet élément, obtenez le id.

var XYZ = document.querySelector('[value="idloader"]').id; 
0

HTML ne pas attribuer de valeur d'attribut à l'élément div.

La bonne solution est

let x = document.querySelector('[data-value="idloader"]').id 
 
console.log(x)
<html> 
 
<head></head> 
 
<body> 
 
<div id="1123123" data-value="idloader"> </div> 
 
</body> 
 
</html>