J'ai javascript variable obj qui représente un élément dans le DOM et je souhaite changer son ID. J'ai essayé de le faire par ce qui suit, ce qui illustre aussi que ça ne marche pas! Qu'est-ce qui ne va pas avec mon code ci-dessus cela signifie que l'ID semble être changé mais pas repris dans le DOM? Merci d'avance.Puis-je changer l'identifiant d'un élément HTML en utilisant Javascript?
Le code que vous affichez fonctionne; le problème est probablement dans le code qui regarde et attribue obj. Je suppose que c'est juste un objet javascript, pas une partie de l'arbre DOM.
merci - c'était exactement le problème! – user455141
Oui vous pouvez, voici une solution avec jquery
$("#xxx").attr("id", "yyy");
ou
getElementById("xxx").setAttribute("id", "yyy");
-1 L'OP n'a pas spécifié qu'il veut utiliser jQuery et cela devrait être possible en utilisant du JavaScript pur. Cela ne répond pas à la question de savoir pourquoi l'identifiant a été modifié, mais il ne l'a pas été par 'getElementById'. – GenericTypeTea
l'équivalent javascript est obj.setAttribute ("id", "yourid") – Tim
@Tim, en fait 'obj.id =" foo ";' est l'équivalent le plus simple. – GenericTypeTea
Il n'y a aucune raison pour cela ne devrait pas fonctionner en utilisant JavaScript pur. Voici un working fiddle qui le montre fonctionnant. Vous ne devriez pas avoir besoin d'une solution jQuery ou d'une autre méthode JavaScript, id = "foo"; est le moyen le plus simple de changer un ID d'objets DOM.
Jetez un oeil à mon violon ci-dessus et essayez de voir quelle est la différence entre votre code et le mien.
Puisque vous nous avez donne pas tout le code je suppose que vous avez probablement quelque chose de semblable à cela dans votre code
obj = document.createElement("div");
obj.id = "something";
// ...
obj.id = "newID";
alert(obj.id); // this gives me newID as required
var element = document.getElementById("newID");
if (element != null) { alert("Hooray"); // this alert never gets displayed! }
Dans ce cas particulier, document.getElementById("newID") ne vous quoi que ce soit depuis le retour élément n'a pas été ajouté à la page et par conséquent, il ne se trouve pas dans la page.
Essayez ceci:
Works pour moi
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>test</title>
</head>
<body bgcolor="#ffffff">
<script type="text/javascript">
function ChangeID(elementId, newId) {
var obj = document.getElementById(elementId);
obj.id = newId;
}
function SetContent(elementId, content) {
var obj = document.getElementById(elementId);
obj.innerHTML = content;
}
</script>
<div id="div1"></div>
<a href="#" onclick="ChangeID('div1', 'div6');">ChangeID</a><br />
<a href="#" onclick="SetContent('div6', 'this is the contents');">Set Contents</a>
</body>
</html>
Ne pas utiliser 'javascript:' dans les attributs 'onclick'; c'est inutile (en fait, vous attribuez simplement une étiquette JavaScript de cette façon). –
était juste en train d'être explicite. ont édité et enlevé. – jimplode
Votre code semble bien, mais si vous commentez cette façon dans votre code, vous pouvez réaliser que le corset est jamais fermé en raison du commentaire .
if (element != null) { alert("Hooray"); // this alert never gets displayed! } <-- this brace
+1 - super attrape! –
Il y a une autre chose à considérer. Essayez-vous de le faire avant que le DOM soit prêt? Cet élément est-il encore chargé? Si vous essayez de modifier un élément que le DOM n'a pas dans l'arborescence, vous échouerez discrètement.
Comment 'obj' est-il affecté? –
Sous quel navigateur avez-vous reproduit ce cas? – HoLyVieR
Est-ce que le "obj" a été ajouté au document? – Alex