Je dois convertir un élément DOM en un type différent (comme dans le nom de la balise HTML, Toute suggestion sur la façon de faire cela?
J'ai regardé simplement créer un nouvel élément et copier les attributs à travers, mais cela n'est pas sans que ce soit ses propres complications. Dans Firefox, A à p dans ce cas), mais conserver toujours tous les éléments d'origine. les attributs. Qu'ils soient valables pour le nouveau type ou non dans ce cas.
domelement.atributes n'inclut utilement que les attributs d'une valeur, mais dans IE, il signale tous les attributs possibles pour cet élément. Les attributs sont en lecture seule, donc aucun moyen de copier cela.
3 Réponses :
PAS de solution complète, la logique serait fondamentalement:
Enregistrez votre élément existant: créer un nouvel élément et insérez-le juste avant ou après votre Oldelement Copier les attributs meilleur encore, voici un exemple de plug-in qui ne fait que ce que vous voulez: < p> http://plugins.jquery.com/project/getatributes < / p>
Brillant, ça va faire! N'a pas réalisé ATTR () retournerait tous les attributs, et elle corrige, c'est-à-dire uniquement en retournant des attributs avec une valeur.
@ J-P Pour une raison quelconque, cela a fonctionné la première fois que je l'ai essayé, mais vous ne pouvez pas être appelé par cela (je blâme Firebug ...)
Il y a un plugin pour copier tous les attributs, si je trouve la référence que je vais ajouter cela.
Solution Sans-JQuery: E.G. P> makeNewElementFromElement('a', someDivElement); // Create anchor from div
C'est sympa. Qu'est-ce que cela fait des événements WRT attachés aux éléments enfants? Est-ce qu'ils sont copiés trop? (Je pense à IE et Attachevent ). Est-ce que le premier pendant boucle sera mieux servi par newelem.innerhtml = elem.innerhtml ?
Cela ne copie pas sur les événements liés par attachentEvent ou addEventListener . Afaik, il n'y a aucun moyen d'accéder aux gestionnaires d'événements enregistrés via l'une ou l'autre de ces méthodes. De plus, innerhtml ne capture pas les propriétés DOM, uniquement des attributs et du contenu.
Ne peut pas être suffisamment évité. Bonne réponse. Pas de jQuery. Attributs de copies. Copies les propriétés DOM. Bien fait, charmant!
Une approche plus moderne (2020+) est la suivante:
p>
function changeTag (element, tag) {
// prepare the elements
const newElem = document.createElement(tag)
const clone = element.cloneNode(true)
// move the children from the clone to the new element
while (clone.firstChild) {
newElem.appendChild(clone.firstChild)
}
// copy the attributes
for (const attr of clone.attributes) {
newElem.setAttribute(attr.name, attr.value)
}
return newElem
}
Créez un nouveau duplicata, à l'exception de la modification du type, puis de la suppression de l'ancien?
@thephpDeveloper Je ne comprends pas, cela ne fait que cloner l'élément et le remplacer, sans changer le type d'élément HTML.
Par "type d'élément", voulez-vous dire le nom de la balise (par exemple "" div ")?
@ J-P Oui (pourquoi oui n'est pas un commentaire légitime?!?)
C'est l'une des pires techniques probablement, mais que diriez-vous de
parent.innerhtml = parent.innerhtml.replace ("?