Changer l'étiquette à l'aide de javascript

Vous ne pouvez pas modifier le type d'un élément comme celui-ci, mais vous devez créer un nouvel élément et le déplacer. Exemple:

 var e = document.getElementsByTagName('span')[0]; var d = document.createElement('div'); d.innerHTML = e.innerHTML; e.parentNode.replaceChild(d, e); 

Demo: http://jsfiddle.net/Guffa/bhnWR/

Si vous utilisez jquery

  Var spantxt = $('span').text(); $('body').append('<div>'+spantext+'</div'); 

Notez que cela ne fonctionnerait que s'il n'y avait qu'une seule portée, utilisez un sélecteur d'identification autrement

Si jquery est acceptable utiliser replaceWith.

 $('span').each(function() { $(this).replaceWith($('<div>' + this.innerHTML + '</div>')); });​ 

Il s'agit de DEMO

Vous ne pouvez pas le faire. Ce que vous voulez faire, c'est de prendre le contenu de votre span , puis de le supprimer et créer de nouvelles div et de le remplir avec du contenu précédent.

Assomption: l'étendue que vous souhaitez remplacer est enveloppée dans un div avec id "foo"

En javascript pur, vous pouvez faire quelque chose comme:

  var original_html = document.getElementById('foo').innerHTML; original_html = original_html.replace("<span>", "<div>"); original_html = original_html.replace(new RegExp("</span>"+$), "</div">) document.getElementById('foo').innerHTML=original_html; 

Si toutefois vous ne pouvez pas nécessairement s'attendre à ce que la portée soit bien enveloppée par un élément que vous pouvez constamment obtenir (par ID ou autrement), le javascript devient assez complexe. Dans les deux cas, la vraie réponse ici est: utilisez jQuery.

Il suffit d'écrire un plugin jQuery pour cela.

 (function( $ ) { $.fn.replaceTag = function(newTag) { var originalElement = this[0] , originalTag = originalElement.tagName , startRX = new RegExp('^<'+originalTag, 'i') , endRX = new RegExp(originalTag+'>$', 'i') , startSubst = '<'+newTag , endSubst = newTag+'>' , newHTML = originalElement.outerHTML .replace(startRX, startSubst) .replace(endRX, endSubst); this.replaceWith(newHTML); }; })(jQuery); 

Usage:

 $('div#toChange').replaceTag('span') 

Le plus grand avantage de cette méthode est que l'id préserve tous les attributs de l'élément d'origine.