¿Cómo se reemplaza una etiqueta HTML con otra etiqueta en jquery?

Tengo un sitio en el que estoy trabajando y usa tags “a un lado”, que no estoy logrando que IE8 pueda leer, sin importar lo que bash, incluso con un Shiv HTML5. Entonces, me pregunto, ¿cómo reemplazarías las tags existentes con otras tags con jQuery?

Por ejemplo, si quisiera cambiar

 

a

 

¿Cómo se haría eso?

Prueba esto:

 $('aside').contents().unwrap().wrap('
');
  • Obtenga los contenidos de aside primero.
  • Ahora unwrap los contenidos.
  • Ahora simplemente, wrap el contenido dentro de una nueva etiqueta, aquí un div .

MANIFESTACIÓN


Además, puedes hacer esto usando el método .replaceWith() como:

 $('aside').replaceWith(function () { return $('
', { html: $(this).html() }); });

MANIFESTACIÓN

 $('aside').replaceWith('

');

Esto funciona para cada elemento en el documento y preserva los contenidos. El uso de wraps conduce a ocurrencias de muchos elementos div si hay saltos de línea en el contenido del elemento aside .

$('aside').each(function() { $(this).replaceWith("

"+$(this).html()+"

") });

Esto hará el trabajo:

  $('aside').replaceWith( "
" + $('aside').html() + "
" );

También usar el .html () proporciona un enfoque más dynamic.

Aquí hay una solución que reemplaza las tags de bloques HTML5, preservando el estilo en los divs que reemplazan las tags HTML5. Simplemente reemplazar las tags deja los atributos atrás.

 $('article, aside, figcaption, figure, footer, header, nav, section, source') .each(function(){ var el = $(this), html = el.html(), attrs = { "id": el.attr('id'), "classes": el.attr('class'), "styles": el.attr('style') }; console.log('Replacing ' + el.prop('tagName') + ', classes: ' + attrs.classes); el.replaceWith($('
').html(html).attr(attrs)); });

(puede necesitar un poco más de trabajo en la etiqueta de origen, que tiene atributos “src” y “type”)