Je veux remplacer tout texte affiché par quelque chose comme “@@@@”. Cela signifie que l’utilisateur verra que toute la page est pleine de “@@@@” au lieu de textes (sauf image, iframe ou quelque chose qui n’existe pas dans le code HTML de la page).
Cela remplace presque le code html de la page, mais n’affecte pas les balises et les codes, mais uniquement le texte affiché à l’utilisateur.
Par exemple, je veux remplacer tout le texte de cette page:
- Item 1
- Item 2
- Nested item 1
- Nested item 2
- Nested item 3
- Item 3
DIV1 DIV2 SPAN Username Password
- jquery calculant l’âge en fonction de la date de naissance
- IE7 prend-il en charge la balise de données HTML5?
- Précharger les images avec la queue?
- images de fond différentes et bug du panneau de gauche
- L’événement Onblur se déclenche avant le clic d’une autre div
Click here to Register
Et le résultat devrait être:
- @@@@
- @@@@
- @@@@
- @@@@
- @@@@
- @@@@
@@@@ @@@@ @@@@ @@@@ @@@@
@@@@@@@@
Certains j’ai été essayé:
Utilisez JQuery pour remplacer tous les éléments, les balises (et leurs enfants) qui ne contiennent que du texte brut, cela fonctionne bien au début:
- @@@@
- @@@@
- @@@@
- @@@@
- @@@@
- @@@@
@@@@ @@@@ @@@@
Mais dernièrement, j’ai réalisé que dans le cas d’éléments, les balises ont des enfants, cela échouerait:
Click here to Register
J’ai donc essayé d’une autre manière, en utilisant document.body.innerText pour sélectionner tout le texte, mais le format HTML est perdu.
J’étais si fatigué. Est-ce que quelqu’un peut m’aider?
Merci beaucoup!
Ce code semble fonctionner pour moi:
$('*').contents().filter(function() { return this.nodeType == Node.TEXT_NODE && this.nodeValue.sortingm() != ''; }).each(function() { this.nodeValue = '@@@@'; });
Fondamentalement, il remplace le contenu de chaque nœud de texte par @@@@
.
Pour une démonstration, voir ici: http://jsfiddle.net/K8544/3/
Essaye celui-là. C’est une fonction qui remplace le texte interne par ” * “, mais uniquement si son code HTML interne est égal à son texte interne. Sinon, il s’appelle lui-même récursivement, en parcourant le DOM jusqu’à atteindre l’élément le plus interne.
$(document).ready(function() { function replaceChildren(node) { if ($(node).html() == $(node).text()) $(node).text("@@@@"); else { $(node).children().each(function() { replaceChildren(this); }); } } replaceChildren($("body")); });
Ce n’est pas parfait, mais devrait être assez proche pour la plupart des buts. Je l’ai essayé sur une page de débordement de stack et la plupart du texte a été remplacé. Le seul endroit où cela ne fonctionne pas est la où il y a du balisage et du texte dispersés dans la même balise, par exemple
. Peut-être que cela suffit à votre propos, bien que…
Une solution JQuery uniquement:
$("body *").contents().wrap(" "); $("obscure").each(function(i,e) {if ($(e).children().length==0) $(e).replaceWith("@@@@");}); $("obscure > *").unwrap();
http://jsfiddle.net/cranio/CW9jY/1/
Ce code enveloppe CHAQUE noeud avec une balise personnalisée ( obscure
); l’utilisation de .contents()
garantit que nous encapsulons AUSSI les nœuds de texte purs. Ensuite, nous substituons les nœuds obscure
qui n’ont pas d’enfants (qui étaient auparavant des nœuds uniquement textuels) avec @@@@, éliminant ainsi également les balises obscure
. Enfin, nous décompressons les autres éléments qui ont été enveloppés avec
.
Vous pouvez faire correspondre n’importe quoi entre deux balises – celles-ci ne doivent pas obligatoirement être la même. Par exemple,
, il trouverait aaa
, le remplacerait par @@@
, puis trouverait ccc dd
et le remplacerait par @@@ @@
en regardant entre >
et le prochain <
.
(Remarque: cela ne remplace pas les espaces, car ils semblaient causer certains problèmes).