Salut, voilà plusieurs pistes de réflexion.
Sous Chrome et Firefox tu as un inspecteur HTML qui s'ouvre avec Ctrl+Maj+C. Repère le plus proche parent commun aux éléments qui constituent ton texte formaté. Sa propriété textContent te donnera le texte brut, non formaté, qu'il contient. Si tu as sélectionné l'élément dans l'inspecteur, tu peux l'utiliser directement dans la console avec la variable $0 :
$0.innerHTML = $0.textContent;
Avec l'inspecteur, toujours, tu peux repérer les éléments que tu as envie de « déformater » et les remplacer à la main. Tu peux aussi repérer un point qu'ils ont en commun (par exemple une même classe) et utiliser querySelectorAll pour les remplacer tous :
1 2 3 4 5 6 7 8 9 10 11 12 13 14
| var redSpans = document.querySelectorAll('span.red');
// variante « boucle for classique »
for (var i = 0, len = redSpans.length; i < len; i++) {
var $redSpan = redSpans[i];
var textNode = document.createTextNode($redSpan.textContent);
$redSpan.parentNode.replaceChild(textNode, $redSpan);
}
// variante « forEach »
Array.prototype.forEach.call(redSpans, function ($redSpan) {
var textNode = document.createTextNode($redSpan.textContent);
$redSpan.parentNode.replaceChild(textNode, $redSpan);
}); |
Si ton objectif est de copier-coller le texte, sache que le presse-papiers (clipboard) véhicule plusieurs types d'informations. En JavaScript, ces informations sont accessibles via la propriété dataTransfer de l'objet event lorsque tu traites les évènements du presse-papiers ou de glisser-déposer. Si tu copies du contenu HTML formaté et que tu colles dans un logiciel de traitement de texte riche (genre Word), il y a de grandes chances que le formatage soit conservé ; mais si tu colles dans un éditeur de texte (Notepad), tu ne verras que le texte brut.
Pour examiner les différents types transmis par un évènement du presse-papiers, fais-toi une page avec une <textarea> et ce script :
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23
| // pour Chrome parce que Chrome est stupide
if (!('contains' in Array.prototype)) {
Array.prototype.contains = function contains(item) {
for (var i = this.length; i--; ) if (this[i] === item) return true;
return false;
};
}
// surveille l'évènement « coller » dans la <textarea>
document.querySelector('textarea')
.addEventListener('paste', function (event) {
var data = event.clipboardData;
if (data.types.contains('text/html')) {
// affiche le texte formaté dans la console
console.log('*** HTML data: ***');
console.log(data.getData('text/html'));
}
if (data.types.contains('text/plain')) {
// affiche le texte non formaté dans la console
console.log('*** plain text data: ***');
console.log(data.getData('text/plain'));
}
}); |
Partager