8
votes

Comment remplacez-vous une balise HTML avec une autre étiquette dans JQuery?

J'ai un site que je travaille sur et il utilise des balises 'de côté', que je ne reçois pas IE8 pour pouvoir lire quoi que ce soit, quoi que j'essaie, même avec un Shiv HTML5. Donc, je me demande, comment remplaceriez-vous les étiquettes existantes avec d'autres balises avec jQuery?

Par exemple, si je voulais modifier xxx

à xxx

Comment cela serait-il fait?


7 commentaires

Qu'essayez-vous d'accomplir en remplaçant la balise?


Document.Createeelement ('Mister') devrait vous permettre de travailler avec l'étiquette de côté dans IE8. Vous utilisez le HTML5 DOCTYPE, non?


Dupliquer une question de question: Stackoverflow.com/a/9468280/7602 J'aime mieux la réponse liée non sélectionnée.


.replacePlacewith ('Tag_Here');


J'essayais de styler le 'de côté », mais comme IE8 ne le reconnaîtra pas, même avec Document.Createeelement (' Mister»), il ne lisait aucun de mes CSS.


Ah, je vois ce qui se passe. IE8 ferme de manière incorrecte l'ouverture de côté immédiatement, par exemple FOO est devenue foo , à cause de cela, Le remplacement sera probablement un peu plus difficile.


Y a-t-il une raison pour laquelle IE8 fait cela à l'écart de l'étiquette?


5 Réponses :


31
votes

Essayez ceci: XXX

  • Obtenez le contenu de à part premier.
  • MAINTENANT MAINTENANT DÉPLAP Le contenu.
  • maintenant simplement, wrap le contenu de une nouvelle balise, voici un div .

    démo


    aussi, vous pouvez aussi Faites-cela en utilisant .replacewith () méthode comme: xxx

    démo


4 commentaires

Cela créera de manière incorrecte div en raison des nœuds de texte (espaces blouses) étant incluses lors de l'utilisation de .Contents , voir Tinker.IO/493DB/1


Je reçois des résultats très différents lorsque j'essaye ceci dans IE8: jsfiddle.net/jpzhl/2 / intégré / résultat


Comment pouvons-nous appliquer les attributs de la vieille balise à la nouvelle balise? Disons que j'ai

Diapositive 1 HTML Markup, comment puis-je modifier ceci en

6
votes
$('aside').replaceWith('<div><h3></h3></div>');

0 commentaires

1
votes

Cela fera le travail:

 $('aside').replaceWith( "<div>" + $('aside').html() + "</div>" );


0 commentaires

3
votes

Cela fonctionne pour chaque élément du document et conserve le contenu. L'utilisation de wraps conduit à des occurrences de nombreux éléments div s'il existe des pauses de ligne dans le contenu de l'élément de côté

$ ('de côté'). Chaque (fonction () { $ (this) .replacevith ("

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

0 commentaires

1
votes

Voici une solution qui remplace les balises de bloc HTML5, préservant le style sur les divs qui remplacent les balises HTML5. Il suffit de remplacer les balises laisse les attributs derrière.

$('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($('<div></div>').html(html).attr(attrs));
    });


0 commentaires