Cambia il tag ma mantieni gli attributi e il contenuto – jQuery / Javascript

Testo

cambiato in

Text

Ho familiarità con la replaceWith di jQuery, ma che non mantiene attributi / contenuti per quanto ne so.

Nota: perché p avrebbe un href ? Perchè ho bisogno di cambiare p su a altro evento.

prova questo:

 var $a = $('a#thisid'); var ahref = $a.attr('href'); var aclass = $a.attr('class'); var aid = $a.attr('id'); var atext = $a.text(); $a.replaceWith('

'+ atext +'

');

Ecco un metodo più generico:

 // New type of the tag var replacementTag = 'p'; // Replace all a tags with the type of replacementTag $('a').each(function() { var outer = this.outerHTML; // Replace opening tag var regex = new RegExp('<' + this.tagName, 'i'); var newTag = outer.replace(regex, '<' + replacementTag); // Replace closing tag regex = new RegExp(' 

Puoi provare il codice qui: http://jsfiddle.net/tTAJM/

Ecco un metodo che uso per sostituire i tag html in jquery:

 // Iterate over each element and replace the tag while maintaining attributes $('a').each(function() { // Create a new element and assign it attributes from the current element var NewElement = $("

"); $.each(this.attributes, function(i, attrib){ $(NewElement).attr(attrib.name, attrib.value); }); // Replace the current element with the new one and carry over the contents $(this).replaceWith(function () { return $(NewElement).append($(this).contents()); }); });

$('a.class1').each(function() lo limiterei a una class specifica, come $('a.class1').each(function() per l’esempio sopra.

È meglio creare il plugin jQuery per la riutilizzabilità futura:

 (function (a) { a.fn.replaceTagName = function (f) { var g = [], h = this.length; while (h--) { var k = document.createElement(f), b = this[h], d = b.attributes; for (var c = d.length - 1; c >= 0; c--) { var j = d[c]; k.setAttribute(j.name, j.value) } k.innerHTML = b.innerHTML; a(b).after(k).remove(); g[h - 1] = k } return a(g) } })(window.jQuery); 

Uso:

 // Replace given object tag's name $('a').replaceTagName("p"); 

Esempio: JSFiddle

hacky che fa il trucco

 var p = $('a').wrapAll('
'); var a = $('div').map(function(){ return this.innerHTML; }).get().join(' '); $('div.replace').html(a.replace(//g,'p>'));

dimostrazione

L’ho trasformato in una semplice funzione javascript:

 function ReplaceTags(Original, Replace){ var oarr = document.getElementsByTagName(Original); for(i=0; oarr.length < i; i++){ var html = oarr[i].outerHTML; oarr[i].outerHTML = (html.replace(Original, Replace)); } } 

Se vuoi sostituire solo un tag specifico, elimina il ciclo for:

 function ReplaceTag(Original, Replace, customi){ // If customi = 0 the first appearance will get replaced var i = customi; if(i == undefined) i=0; var oarr = document.getElementsByTagName(Original); var html = oarr[i].outerHTML; oarr[i].outerHTML = (html.replace(Original, Replace)); }