IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

JavaScript Discussion :

Remplacement d'un élément par son innerHTML


Sujet :

JavaScript

  1. #181
    Inactif  

    Homme Profil pro
    cuisiniste
    Inscrit en
    Avril 2009
    Messages
    15 379
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Var (Provence Alpes Côte d'Azur)

    Informations professionnelles :
    Activité : cuisiniste
    Secteur : Bâtiment

    Informations forums :
    Inscription : Avril 2009
    Messages : 15 379
    Points : 12 075
    Points
    12 075
    Billets dans le blog
    8
    Par défaut re
    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

  2. #182
    Inactif  

    Homme Profil pro
    cuisiniste
    Inscrit en
    Avril 2009
    Messages
    15 379
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Var (Provence Alpes Côte d'Azur)

    Informations professionnelles :
    Activité : cuisiniste
    Secteur : Bâtiment

    Informations forums :
    Inscription : Avril 2009
    Messages : 15 379
    Points : 12 075
    Points
    12 075
    Billets dans le blog
    8
    Par défaut re
    re
    allez demonstration
    Nom : demo2.gif
Affichages : 268
Taille : 1,60 Mo

  3. #183
    Membre expert
    Homme Profil pro
    Inscrit en
    Octobre 2011
    Messages
    2 886
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations forums :
    Inscription : Octobre 2011
    Messages : 2 886
    Points : 3 725
    Points
    3 725
    Par défaut
    Citation Envoyé par patricktoulon Voir le message
    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...

  4. #184
    Membre expert
    Homme Profil pro
    Inscrit en
    Octobre 2011
    Messages
    2 886
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations forums :
    Inscription : Octobre 2011
    Messages : 2 886
    Points : 3 725
    Points
    3 725
    Par défaut
    Citation Envoyé par patricktoulon Voir le message
    a la facon cromanion
    dans le genre comme ca
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    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...

  5. #185
    Inactif  

    Homme Profil pro
    cuisiniste
    Inscrit en
    Avril 2009
    Messages
    15 379
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Var (Provence Alpes Côte d'Azur)

    Informations professionnelles :
    Activité : cuisiniste
    Secteur : Bâtiment

    Informations forums :
    Inscription : Avril 2009
    Messages : 15 379
    Points : 12 075
    Points
    12 075
    Billets dans le blog
    8
    Par défaut re
    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 : Sélectionner tout - Visualiser dans une fenêtre à part
    <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

  6. #186
    Membre expert
    Homme Profil pro
    Inscrit en
    Octobre 2011
    Messages
    2 886
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations forums :
    Inscription : Octobre 2011
    Messages : 2 886
    Points : 3 725
    Points
    3 725
    Par défaut
    Citation Envoyé par patricktoulon Voir le message
    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 : Sélectionner tout - Visualiser dans une fenêtre à part
    <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 Voir le message
    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...)

  7. #187
    Inactif  

    Homme Profil pro
    cuisiniste
    Inscrit en
    Avril 2009
    Messages
    15 379
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Var (Provence Alpes Côte d'Azur)

    Informations professionnelles :
    Activité : cuisiniste
    Secteur : Bâtiment

    Informations forums :
    Inscription : Avril 2009
    Messages : 15 379
    Points : 12 075
    Points
    12 075
    Billets dans le blog
    8
    Par défaut re
    je le met ou ton white machin la ,sur le div editeur?????

  8. #188
    Membre expert
    Homme Profil pro
    Inscrit en
    Octobre 2011
    Messages
    2 886
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations forums :
    Inscription : Octobre 2011
    Messages : 2 886
    Points : 3 725
    Points
    3 725
    Par défaut
    Oui.

  9. #189
    Inactif  

    Homme Profil pro
    cuisiniste
    Inscrit en
    Avril 2009
    Messages
    15 379
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Var (Provence Alpes Côte d'Azur)

    Informations professionnelles :
    Activité : cuisiniste
    Secteur : Bâtiment

    Informations forums :
    Inscription : Avril 2009
    Messages : 15 379
    Points : 12 075
    Points
    12 075
    Billets dans le blog
    8
    Par défaut re
    ok ben alors ca marche pas avec IE
    ni pre
    NI PRE-LINE ETC.....

  10. #190
    Membre expert
    Homme Profil pro
    Inscrit en
    Octobre 2011
    Messages
    2 886
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations forums :
    Inscription : Octobre 2011
    Messages : 2 886
    Points : 3 725
    Points
    3 725
    Par défaut
    N'oublie pas les deux messages #179 et #184 auxquels tu n'as pas répondus...

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

  11. #191
    Inactif  

    Homme Profil pro
    cuisiniste
    Inscrit en
    Avril 2009
    Messages
    15 379
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Var (Provence Alpes Côte d'Azur)

    Informations professionnelles :
    Activité : cuisiniste
    Secteur : Bâtiment

    Informations forums :
    Inscription : Avril 2009
    Messages : 15 379
    Points : 12 075
    Points
    12 075
    Billets dans le blog
    8
    Par défaut re encore une bizarrerie
    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 : Sélectionner tout - Visualiser dans une fenêtre à part
    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

  12. #192
    Membre expert
    Homme Profil pro
    Inscrit en
    Octobre 2011
    Messages
    2 886
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations forums :
    Inscription : Octobre 2011
    Messages : 2 886
    Points : 3 725
    Points
    3 725
    Par défaut
    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

  13. #193
    Inactif  

    Homme Profil pro
    cuisiniste
    Inscrit en
    Avril 2009
    Messages
    15 379
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Var (Provence Alpes Côte d'Azur)

    Informations professionnelles :
    Activité : cuisiniste
    Secteur : Bâtiment

    Informations forums :
    Inscription : Avril 2009
    Messages : 15 379
    Points : 12 075
    Points
    12 075
    Billets dans le blog
    8
    Par défaut re
    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

  14. #194
    Membre expert
    Homme Profil pro
    Inscrit en
    Octobre 2011
    Messages
    2 886
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations forums :
    Inscription : Octobre 2011
    Messages : 2 886
    Points : 3 725
    Points
    3 725
    Par défaut
    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...

  15. #195
    Inactif  

    Homme Profil pro
    cuisiniste
    Inscrit en
    Avril 2009
    Messages
    15 379
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Var (Provence Alpes Côte d'Azur)

    Informations professionnelles :
    Activité : cuisiniste
    Secteur : Bâtiment

    Informations forums :
    Inscription : Avril 2009
    Messages : 15 379
    Points : 12 075
    Points
    12 075
    Billets dans le blog
    8
    Par défaut re
    ce que je veux est simple
    oublie js oublie toute réglés

    j'ai un textes (string) issue du innerHTML
    EXEMPLE
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
     &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

  16. #196
    Membre expert
    Homme Profil pro
    Inscrit en
    Octobre 2011
    Messages
    2 886
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations forums :
    Inscription : Octobre 2011
    Messages : 2 886
    Points : 3 725
    Points
    3 725
    Par défaut
    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 !!!

  17. #197
    Inactif  

    Homme Profil pro
    cuisiniste
    Inscrit en
    Avril 2009
    Messages
    15 379
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Var (Provence Alpes Côte d'Azur)

    Informations professionnelles :
    Activité : cuisiniste
    Secteur : Bâtiment

    Informations forums :
    Inscription : Avril 2009
    Messages : 15 379
    Points : 12 075
    Points
    12 075
    Billets dans le blog
    8
    Par défaut RE
    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 : Sélectionner tout - Visualiser dans une fenêtre à part
    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)

  18. #198
    Membre expert
    Homme Profil pro
    Inscrit en
    Octobre 2011
    Messages
    2 886
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations forums :
    Inscription : Octobre 2011
    Messages : 2 886
    Points : 3 725
    Points
    3 725
    Par défaut
    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...

  19. #199
    Inactif  

    Homme Profil pro
    cuisiniste
    Inscrit en
    Avril 2009
    Messages
    15 379
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Var (Provence Alpes Côte d'Azur)

    Informations professionnelles :
    Activité : cuisiniste
    Secteur : Bâtiment

    Informations forums :
    Inscription : Avril 2009
    Messages : 15 379
    Points : 12 075
    Points
    12 075
    Billets dans le blog
    8
    Par défaut re
    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 : Sélectionner tout - Visualiser dans une fenêtre à part
    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+":");

  20. #200
    Membre expert
    Homme Profil pro
    Inscrit en
    Octobre 2011
    Messages
    2 886
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations forums :
    Inscription : Octobre 2011
    Messages : 2 886
    Points : 3 725
    Points
    3 725
    Par défaut
    Citation Envoyé par patricktoulon Voir le message
    ce que je veux est simple
    oublie js oublie toute réglés

    j'ai un textes (string) issue du innerHTML
    EXEMPLE
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
     &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.

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. [SimpleXML] et recherche d'un élément par son attribut
    Par Tutotictac dans le forum Bibliothèques et frameworks
    Réponses: 2
    Dernier message: 28/03/2009, 16h39
  2. Comment remplacer un resultat numérique par son libellé ?
    Par bds2006 dans le forum Bases de données
    Réponses: 3
    Dernier message: 16/06/2006, 11h03
  3. [XSLT ]remplacement d un caractere par son code
    Par luta dans le forum XSL/XSLT/XPATH
    Réponses: 3
    Dernier message: 02/09/2005, 16h26
  4. Réponses: 2
    Dernier message: 10/05/2004, 11h20

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo