Remplacement d'un élément par son innerHTML

ok tu a raison il y a bien possibilité d'imbrication
mais avec mon systeme cromanion on enlevé le "innertext" donc en cas d'imbrication le innerhtml donnera aussi le code "outer" donc ne correspondra pas avec le previous

d’ailleurs c'est pas un soucis parce que si il y a imbrication des le départ le previous était déjà séparé

il est impossible en faisant un shadow none globale que ce qui a été sépare ne se retrouve pas successifs
j'ai testé et re testé a moins d'y ajouter d'autre attribut et dans ce cas ils ne sont plus successifs puisque différents

re
allez demonstration
Pièce jointe 257134

Citation:

---

Envoyé par patricktoulon

ok tu a raison il y a bien possibilité d'imbrication
mais avec mon systeme cromanion on enlevé le "innertext" donc en cas d'imbrication le innerhtml donnera aussi le code "outer" donc ne correspondra pas avec le previous

d’ailleurs c'est pas un soucis parce que si il y a imbrication des le départ le previous était déjà séparé

il est impossible en faisant un shadow none globale que ce qui a été sépare ne se retrouve pas successifs
j'ai testé et re testé a moins d'y ajouter d'autre attribut et dans ce cas ils ne sont plus successifs puisque différents

---

Oui les balises internes ne gênent pour le repérage des successifs mais le problème c'est que execCommand supprimera ces balises internes...

A moins que tu le fasses toi-même :

si tu as tous les éléments successifs il suffit de faire ce que tu fais pour le shadow : tu appliques le formatage sur l'ensemble des ces éléments et tu supprimes le formatage de chacun de ces éléments un par un...

Je ne sais pas si je suis clair...

Citation:

---

Envoyé par patricktoulon

a la facon cromanion
dans le genre comme ca

Code:

---

1 2 3 4 5 6 7

var b=parent.getElementsByTagName("FONT") for(var i=0;i<b.length-1;i++){ if (b[i].nextSibling.tagName=="FONT"){ b1=b[i].outerHTML.replace(b[i].innerText,"") b2=b[i].nextSibling.outerHTML.replace(b[i].nextSibling.innerText,"") if( b1==b2){b[i].nextSibling.innerHTML = b[i].innerHTML+b[i].nextSibling.innerHTML;b[i].innerHTML="";} }

---

a la fin on s'en fou j'ai le nettoyage des vides

---

Oui alors ça marche pour les deux premiers c'est ça ? Si il y en a trois cela se complique car on perd les références...

Ben dans ce cas il faut d’abord repérer toutes les balises successives et les mettre dans un tableau et alors tu peux les remplacer par leur innerHtml...

oui tu es suffisament clair mais tu te méprends sur mon principe
exemple
ici mon system diras non donc il n'y a pas de danger de perte de couleur

Code:

---

<font size="7"> <font style="background-color: rgb(255, 0, 0);">E<font style="background-color: rgb(0, 255, 255);">XE</font>M</font><font style="background-color: rgb(255, 0, 0);">PLE DE</font> TEXTE</font>

---

en retrant le innertext des balises il reste le outer
et ici en l’occurrence mon System cromanion identifiera
la b1 comme
<font style="background-color: rgb(255, 0, 0);"><font style="background-color: rgb(0, 255, 255);"></font></font>
et la b2 comme
<font style="background-color: rgb(255, 0, 0);"></font>
mais tu a raison au fond c'est pas une bonne idée le execcomand car il peut y avoir d'autre balise donc sytem cro donne faut alors que non
non il faut tester et insert before





bon je buche sur mes espaces c'est bizarre le comportement des &nbsp; quand meme que j'en ai 1,2,3 il m'en donne toujours qu'un

Citation:

---

Envoyé par patricktoulon

oui tu es suffisament clair mais tu te méprends sur mon principe
exemple
ici mon system diras non donc il n'y a pas de danger de perte de couleur

Code:

---

<font size="7"> <font style="background-color: rgb(255, 0, 0);">E<font style="background-color: rgb(0, 255, 255);">XE</font>M</font><font style="background-color: rgb(255, 0, 0);">PLE DE</font> TEXTE</font>

---

en retrant le innertext des balises il reste le outer
et ici en l’occurrence mon System cromanion identifiera
la b1 comme
<font style="background-color: rgb(255, 0, 0);"><font style="background-color: rgb(0, 255, 255);"></font></font>
et la b2 comme
<font style="background-color: rgb(255, 0, 0);"></font>
mais tu a raison au fond c'est pas une bonne idée le execcomand car il peut y avoir d'autre balise donc sytem cro donne faut alors que non
non il faut tester et insert before

---

Ben c'est bien ce que j'avais compris pour b1 et b2...mais si après tu appliques execCommand à b1 + b2 il y aura (c'est à vérifier quand même) suppression du background-color qui est à l'intérieur de b1...

Citation:

---

Envoyé par patricktoulon

bon je buche sur mes espaces c'est bizarre le comportement des &nbsp; quand meme que j'en ai 1,2,3 il m'en donne toujours qu'un

---

Je te rappel qu'avec du css tu peux éviter la présence des &nbsp; (a voir sur IE...)

je le met ou ton white machin la ,sur le div editeur?????

Oui.

ok ben alors ca marche pas avec IE
ni pre
NI PRE-LINE ETC.....

N'oublie pas les deux messages #179 et #184 auxquels tu n'as pas répondus...

C'est pour être sûr de comprendre...

re je viens encore de découvrir sauf erreur de ma part un bizarrerie
je comprends mieux pour quoi je n'arrive a rien

voila 3 lignes toutes simples

Code:

---

1 2 3 4 5 6 7 8 9 10

var tx="yyyyhztrfgdutjalsoyyyylqgbdfertaqjyyyyy"   alert(tx);     for(var i=0;i<tx.length;i++){ alert(tx.substring(i,1));     }

---

normalement si je ne me trompe pas ce la devrait m'aficher un message lettre par lettre
et ben tente tu verra
plus on va dans les trucs simples plus c'est du n'importe quoi
c'est vraiment désespérant

Non en effet ça marche pas... Mais c'est simple il suffit d'utiliser tx.charAt(i) ou tx[i]...

Teste ici : http://jsbin.com/foroqolesu/edit?html,js,console,output

alors
reponse 179 t'a tout faux


alors je répété pure ca m’épuise ce truc

je sélectionne
il y a possibilité qu'il y est espace devant /espaces apres ou des deux coté

mon systeme de fragment travaille en INNERHTML ou OUTER HTML dans le range

je cherche donc tout simplement a bien déterminer le devant, le milieu, la fin
c'est TOUT!!!!!!!!!!!!!!!
je veux ca et c'est tout c'est pas compliqué

laisse tomber tes offset et compagnie donne moi la main a trouver ca et je te donnerais le reste encore une fois c'est TOUT

reponse 184
non on perd pas la référence si je remove pas pendant la boucle

j'ai quand même oublié de mettre le test sur nextsibling si c'est un font ou pas
comme c'est une solution que j'avais virrer je m'en souviens plus trop
mais si je ne trouve pas de solution plus propre je remettrais ca puis voila tout

Ecoute c'est difficile de te suivre, ce que tu crois être simple n'est pas si simple que ça sinon tu l'aurais déjà fait, non ? J'ai du mal à te suivre car pour moi c'est ce que tu demandais sur l'autre fil et c'est ce qu'a fait NoSmoking...

Enfin bref, c'est peut-être au dessus de mes capacités, je ne suis qu'un débutant moi aussi...

Je passe la main...

ce que je veux est simple
oublie js oublie toute réglés

j'ai un textes (string) issue du innerHTML
EXEMPLE

Code:

---

&nbsp;&nbsp; trucbidule<font color =xxxxx>salut</font> &nbsp; &nbsp;<font color =yyyyy>beguinner</font> &nbsp;&nbsp;&nbsp;

---

et bien je veux
dans variable 1 :"&nbsp;&nbsp; "
dans variable2 :"trucbidule<font color =xxxxx>salut</font> &nbsp; &nbsp;<font color =yyyyy>beguinner</font>"
dans variable 3:" &nbsp;&nbsp;&nbsp; "

voila c'est simple

Oui eh bien c'est bien ce que je disais, c'est toi qui ne suit pas... Oui ce n'est pas si simple justement, à première vue cela semble simple et cela correspond à la première solution que j'avais donnée mais par la suite on avait vu un problème à savoir que lorsqu'on fait une sélection les espaces à gauche et/ou droite peuvent appartenir à différentes balises... Et le nombre d'espaces qu'on sélectionne est variable aussi...

Cela étant dit si, comme tu le prétends, tu n'as pas besoin d'un range (ce dont je doute) alors on a déjà fait ça sur l'autre fil !!!

re
si je te dis que pour le moment avec un seul mot entouré ou pas d'espaces ou nbsp je le fait en string avant d'implanter dans le fragment

str c'est le string INNRERHTML correspondant a la sélection

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21

var midle=str.replace(/&nbsp\;/gi,"");if(midle.substring(0,1)==" "){midle=midle.substring(1,midle.length);} if(midle.substring(midle.length-1,midle.length)==" "){midle=midle.substring(0,midle.length-1);} espG=str.split(midle)[0] espD=str.substring(espG.length+midle.length,str.length); oSpan.innerHTML=midle; alert (oSpan.outerHTML); var range=sel.getRangeAt(0) range.deleteContents(); // on delete le range complet if (range.createContextualFragment) { fragment = range.createContextualFragment(espG+oSpan.outerHTML+espD); //on créé un fragment }

---

en gros j'extract encapsule la bonne partie du texte dans le span puis insert(fragment) complet
contrairement a d'habitude ou l'on insertNode(oSpan)

Oui eh bien j'avais bien compris... tu n'as pas suivi car j'avais anticipé la suite du problème...

Au final je me répète pourquoi travailler avec les espaces ??? C'est le milieu qui t’intéresse normalement ? C'est à cette partie que tu dois appliquer le shadow et pas aux espaces à gauche et à droite; non ?

Prenons un exemple : "un exemple avec des espaces"

Si l'utilisateur sélectionne " des " eh bien je ramène la sélection sur le mot "des" (sans les espaces) ensuite je lui applique le shadow et j'insère le résultat... Alors bien sûr les espaces n'auront pas de shadow mais on s'en fiche car un shadow sur des espaces ne se voit pas de toute façon... N'est-ce pas cela que tu voulais dans l'autre fil ?

Encore les espaces peuvent appartenir à différentes balises c'est ce qui complique les choses...

a oui et comment tu ramène ta sélection a "des"

avec l'usine a gaz ?
et il faut pas oublier que quand tu a sélectionné il faut rendre tout ce qui était avant "des" au code
je te signale quand même que extract ou même (clone suivi de remove range obligatoirement pour replacer la sélection) supprime le texte sélectionné du code original
avec cette solution sel les offset peuvent faire le boulot et on sait bien tout les deux le boxon que cest

tandis que ma methode est simple rouge gauche +ospan outerHTML+rouge droite dans le fragment
et start et end c'est le ospan seul child de typenode 1 que contient le fragment
c'est pas plus compliqué que cela

il me manque la boucle a reculons sur tx et c'est bon aide moi pour ca
j'ai tenter ca mais il y a que pour la gauche que ca marche

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26

var tx=str.replace(/&nbsp\;/gi,"*");         alert(tx); var esG=""; var esD=""; var M=""; var st =false; for(var i=0;i<tx.length;i++){ if(tx[i]=="*"||tx[i]==" "){ esG=esG+tx[i]; }else break; } M=str.split(esG)[1] for(var i=tx.length;i>0;i--){ if(tx[i]=="*"||tx[i]==" "){ esD=esD+tx[i]; }else break; }     alert("gauche:"+esG+":"); alert("milieu:"+M+":"); alert("droite:"+esD+":");

---

Citation:

---

Envoyé par patricktoulon

ce que je veux est simple
oublie js oublie toute réglés

j'ai un textes (string) issue du innerHTML
EXEMPLE

Code:

---

&nbsp;&nbsp; trucbidule<font color =xxxxx>salut</font> &nbsp; &nbsp;<font color =yyyyy>beguinner</font> &nbsp;&nbsp;&nbsp;

---

et bien je veux
dans variable 1 :"&nbsp;&nbsp; "
dans variable2 :"trucbidule<font color =xxxxx>salut</font> &nbsp; &nbsp;<font color =yyyyy>beguinner</font>"
dans variable 3:" &nbsp;&nbsp;&nbsp; "

voila c'est simple

---

Dans cet exemple c'est facile mais la réalité c'est que les espaces peuvent appartenir à différentes balises... Revois les messages #31 et #33.