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. #41
    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 tu a raison avec la méthode de loralina j'ai perdu la possibilité d'enlever le shadow je ne m'en était pas rendu compte
    je vais remettre ma version string pour voir et je reviens
    mes fichiers dans les contributions:
    mail avec CDO en vba et mail avec CDO en vbs dans un HTA
    survol des bouton dans userform
    prendre un cliché d'un range

    si ton problème est résolu n'oublie pas de pointer : : ça peut servir aux autres
    et n'oublie pas de voter

  2. #42
    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
    et voila j'ai remis va version string dans le wysiwyg

    mon resultat est nikel je peut enlever remettre a volonté comme les moules frittes chez nous

    Nom : demo2.gif
Affichages : 433
Taille : 1,86 Mo

    mais ton idée de SPAN N EST PAS SI MAL EN FAIT CA PERMETTRAIT DE S ATTAQUER DIRECTEMENT ET RIEN QU EUX POUR LA FONCTION SHADOW
    ce qui me gène c'est d'avoir des font et span dans le même code c'est pas déontologique non???
    mes fichiers dans les contributions:
    mail avec CDO en vba et mail avec CDO en vbs dans un HTA
    survol des bouton dans userform
    prendre un cliché d'un range

    si ton problème est résolu n'oublie pas de pointer : : ça peut servir aux autres
    et n'oublie pas de voter

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

    Informations forums :
    Inscription : Octobre 2011
    Messages : 2 873
    Points : 3 717
    Points
    3 717
    Par défaut
    J'ai testé vos deux fonctions et finalement (apparemment) les deux marchent chez moi (j'utilise Chrome)...

    Sauf dans certains cas, peux-tu vérifier ce cas par exemple :


    - tu as trois mots et tu leurs mets un shadow de couleur verte...
    - Tu mets ces trois mots en italique ou gras ou souligné...
    - Peux-tu alors par exemple juste supprimer le shadow du deuxième mot sans toucher aux deux autres mots ? C'est-à-dire le premier et le deuxième mot reste avec un shadow de couleur verte...

    Chez-moi cela ne fonctionne pas, je pense que la raison est que pour l'italique, le gras, souligné... la fonction execCommand n'utilise pas la balise <font> mais <i>,<b>...

    Citation Envoyé par patricktoulon Voir le message
    mais ton idée de SPAN N EST PAS SI MAL EN FAIT CA PERMETTRAIT DE S ATTAQUER DIRECTEMENT ET RIEN QU EUX POUR LA FONCTION SHADOW
    ce qui me gène c'est d'avoir des font et span dans le même code c'est pas déontologique non???
    Perso je ne vois pas pourquoi il y aurait un problème à utiliser plusieurs balises différentes sauf peut-être pour gagner quelques octets ?

  4. #44
    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
    oulala!!!!
    bonjour a tous
    aie!!aie!!
    en effet j'ai résolu le soucis de la sélection complète puis le xeme mots comme beguinner le voyait mais du coup je me suis intéressé au parent "P"
    et la effectivement ca déraille tout du moins il reste des balises vides je n'avais pas vu ca
    démonstration et résultat dans la console
    Nom : demo2.gif
Affichages : 448
Taille : 512,4 Ko
    mes fichiers dans les contributions:
    mail avec CDO en vba et mail avec CDO en vbs dans un HTA
    survol des bouton dans userform
    prendre un cliché d'un range

    si ton problème est résolu n'oublie pas de pointer : : ça peut servir aux autres
    et n'oublie pas de voter

  5. #45
    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 essaie avec les span
    Bonjour beguinner
    et a tous

    voila un model avec les span
    et toujours pareille la balise est bien netoyée mais le dom laisse les phantome dans le P parent
    j'ai tenté un remplacement innerhtml de p par le innerHTMl de la balise crée au cas ou les deux aurait le même innerText mais ca marche pas

    c'est vraiment un truc tordu ce machin

    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
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    function shadowcolor(coul, MOD) {    if (selectionne_text()) {
            var selection = selectionne_text();
            var selectedText = selection.extractContents();
            var BB = document.createElement("SPAN");
            BB.appendChild(selectedText);
            var str = BB.innerHTML;
            var colhtml = BB.getElementsByTagName("SPAN");
            if (colhtml.length > 0) {
                for (var i = 0; i < colhtml.length; i++) {
                   str = str.replace(colhtml[i].outerHTML, colhtml[i].innerHTML);
                }
            }
     
    console.log(str);
    BB.innerHTML = str;
            if (MOD == true) {
                BB.style.textShadow = "0px 0px 10px " + coul;
            }
            selection.insertNode(BB);
     
     
     
    console.log(BB.outerHTML);
    var obj = BB.parentElement;
            do {
                  if (obj.tagName=="SPAN" && MOD == false) { BB.style.textShadow = "none";}
     
                obj = obj.parentElement;
            } while (obj.tagName == "P");
     
                   if (BB.parentElement.tagName == "P" && MOD == false && BB.parentElement.firstChild==BB ) {
                    BB.removeAttribute("style");
                    }
     
      if (BB.parentElement.tagName == "P" &&  BB.parentElement.innerText==BB.innerText ) {
                    BB.parentElement.innerHTML=BB.outerHTML;
                    }
     
     
     }
    console.log(document.getElementById("editeur").innerHTML); 
     
     
    }
    je pete les plombs avec ce truc ce dom a la con!!
    mes fichiers dans les contributions:
    mail avec CDO en vba et mail avec CDO en vbs dans un HTA
    survol des bouton dans userform
    prendre un cliché d'un range

    si ton problème est résolu n'oublie pas de pointer : : ça peut servir aux autres
    et n'oublie pas de voter

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

    Informations forums :
    Inscription : Octobre 2011
    Messages : 2 873
    Points : 3 717
    Points
    3 717
    Par défaut
    Citation Envoyé par patricktoulon Voir le message
    Bonjour beguinner
    et a tous

    voila un model avec les span
    et toujours pareille la balise est bien netoyée mais le dom laisse les phantome dans le P parent
    j'ai tenté un remplacement innerhtml de p par le innerHTMl de la balise crée au cas ou les deux aurait le même innerText mais ca marche pas

    c'est vraiment un truc tordu ce machin
    Oui moi aussi j'avais fait une version avec la balise <span> :
    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
    27
    function shadowcolorBis(coul, MOD) {
     
       var selection = selectionne_text();
       if (selection) {
     
          var selectedText = selection.extractContents();
          var baliseShadow = document.createElement("span");      
          baliseShadow.appendChild(selectedText);
          var colhtml = baliseShadow.getElementsByTagName("span");      
          var ob_, ob_2, ob_3;
          var colhtml = baliseShadow.getElementsByClassName("shado");
          var i = colhtml.length;
     
          while (--i >= 0) { colhtml[i].outerHTML = colhtml[i].innerHTML; }
     
          if (MOD == true) {
             baliseShadow.className = "shado";
             baliseShadow.style.textShadow = "0px 0px 10px " + coul;
          }
          selection.insertNode(baliseShadow);
     
          if (baliseShadow.parentElement.className == "shado" && MOD == false && baliseShadow.parentElement.tagName != "P") {
             baliseShadow.className = "shado";
             baliseShadow.style.textShadow = "none";
          }
       } 
    }
    C'est plus court mais effectivement cela ne résout pas le problème que tu évoques ni ceux que j'ai évoqués... Mais bon ce n'était pas le but, le but c'était plutôt de faire un truc plus concis et plus simple et peut-être plus polyvalent...

    Maintenant il faut résoudre ces problèmes et d'ailleurs as-tu essayer de faire ce que je t'avais dis :

    Citation Envoyé par Beginner. Voir le message
    J'ai testé vos deux fonctions et finalement (apparemment) les deux marchent chez moi (j'utilise Chrome)...

    Sauf dans certains cas, peux-tu vérifier ce cas par exemple :


    - tu as trois mots et tu leurs mets un shadow de couleur verte...
    - Tu mets ces trois mots en italique ou gras ou souligné...
    - Peux-tu alors par exemple juste supprimer le shadow du deuxième mot sans toucher aux deux autres mots ? C'est-à-dire le premier et le deuxième mot reste avec un shadow de couleur verte...

    Chez-moi cela ne fonctionne pas, je pense que la raison est que pour l'italique, le gras, souligné... la fonction execCommand n'utilise pas la balise <font> mais <i>,<b>...
    Cela permettrait de savoir si le problème vient de moi ou non...

  7. #47
    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 oui j avais testé ca vient pas des autres balises mais du fait que je veux les deux sens

    faire/défaire en changeant ou défaire en supprimant
    visiblement j'ai 3 versions qui ont le même problème a la fin je ne peut pas avoir les 3 en un
    je te fait une démo en rentrant ce soir
    oui je sais insert HTML ne marche pas tu pense bien que j'ai visité toutes les commandes de execCommand
    mes fichiers dans les contributions:
    mail avec CDO en vba et mail avec CDO en vbs dans un HTA
    survol des bouton dans userform
    prendre un cliché d'un range

    si ton problème est résolu n'oublie pas de pointer : : ça peut servir aux autres
    et n'oublie pas de voter

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

    Informations forums :
    Inscription : Octobre 2011
    Messages : 2 873
    Points : 3 717
    Points
    3 717
    Par défaut
    Ok donc cela ne vient pas de chez moi...

    Sinon oui ce que tu veux faire c'est finalement un "removeFormat" (qui existe déjà avec execCommand) sauf que toi (contrairement à ce que fait execCommand) tu ne veux pas supprimer tout le formatage mais seulement un formatage spécifique, dans ton cas c'est le shadow mais cela pourrait être n'importe quoi d'autres comme le gras, l'italique, la taille, la police...

    J'avais commencé à essayer de faire cela plusieurs fois sans avoir été jusqu'au bout, cela m'intéresserait aussi de trouver une solution... D'ailleurs voici le fil : Comment supprimer la mise en forme (formatage) ? dans lequel j'avais aussi posé cette question :
    Peut-être plus difficile : comment supprimer une partie du formatage : genre par exemple je supprime la couleur mais je laisse le gras...
    Il y a la réponse de Watilin à étudier, je pense qu'il doit y avoir des astuces à utiliser...

    Je sais déjà que pour supprimer seulement certains formatages comme le bold ou l'italic ou l'underline... Il suffit de lancer la même commande.

    A suivre...

  9. #49
    Modérateur

    Avatar de NoSmoking
    Homme Profil pro
    Inscrit en
    Janvier 2011
    Messages
    16 959
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Isère (Rhône Alpes)

    Informations forums :
    Inscription : Janvier 2011
    Messages : 16 959
    Points : 44 122
    Points
    44 122
    Par défaut
    Bonjour,
    j'ai qu'en même l'impression, en lisant rapidement cette discussion, que tu tires dans tout les sens sans structurer ton travail, tu « pixelises » les tâches sans en avoir une vue d'ensemble.

    Concernant ta balise <font> elle est avantageusement remplaçable par une balise <span> comme te l'a fait remarquer Beginner..

    Pourquoi gérer des « class » et des « style inline » et ne pas utiliser QUE des « style inline » que tu peux modifier en fonction de tes besoins ?

  10. #50
    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
    si mon travil est structurer seulement contrainte que IE et otut ne fonctionne pas

    j'ai un wysywyg qui a toutes les fonctions textes qui fonctionnent sauf pour shadow tout du moins pas entièrement entièrement
    mon but car visiblement personne n'a compris
    c'est que cette fonction se comporte comme le fait execcommand pour le size,backcolor,face
    c'est a dire quelle mettre la propriété et quelle face le ménage

    jusque la j'ai 3 model de fonctions plus ou moins conventionnelle qui fonctionnent même tres bien

    sauf que!!!!!! préoccupé par ce qui se passe dans la balise créée que ce soit span ou font
    je n'avais pas passé le console.log au parent P c'est a dire la ligne complète ou se trouve la sélection puis la balise créé
    et je me suis rendu compte que rien qu'en faisant in insertnode les balise étaient doublées mais vides ( va savoir pour quoi) et c'est bien le Dom qui fait ca j'ai essayé sur un fichier simple sans propriété de quoi que ce soit et c'est sur ce point que je cale car j'ai essayé plein de chose qui me paraissent logique
    entre autre le element(p).removeChild(balise vide) qui est plus que simple en apparence sauf que ça fait pas le boulot

    en effet
    je pare au debut avec : je vais mettre des ID pour bien mettre le doigt sur le soucis

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    <font id=1 >Nosmoking</font> <font id=2><strong>ne me</strong></font><font id=3> comprend pas </font>
    je sélectionne le texte "ne me comprend pas" et je met une ombre
    ma fonction me retourne ma font shadow comme suit après nettoyage interne

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    <font style="text-shadow:0px 0px 10px #xxxxxx;"> <strong>ne me </strong>comprend pas</font>
    waouhh!!! c'est parfait me diras tu oui mais voila le genre de chose que je vois quand on regarde le code html de la ligne complète

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    <font id=1 ></font> <font id=2><strong></strong></font><font id=3><font id=1 >nosmoking</font><font style="text-shadow:0px 0px 10px #xxxxxx;"><strong>ne me </strong>comprend pas</font>
    alors que je ne fait aucun déplacement je supprime le outerhtml et le remplace par innerhtml

    ca c'est une enigme pour moi
    comment le dom fait pour dire que en faisant insertnode(une balise)je vais doubler les balise et les laisser en amont ou en aval selon le range sélectionne

    voila juste la partie qu'il me reste a nettoyer

    je ne sais pas si je me suis fait comprendre
    ca fait une semaine que je suis dessus
    a chaque fois que j'ai quelque chose qui fonctionne c'est ailleurs que ça va plus pourquoi le dom fait ca je lui ai rien demandé moi

    d'autant plus que c'est totalement absurde et illogique
    qu'il ferme et fasse l'ouverture des balise restantes de droite et de gauche je peut comprendre mais doubler non!!! je comprends pas
    voila mon soucis depuis 3 jours
    voila la version en span pour la mise en place du shadow-text et nettoyage interne rien a dire c'est parfait le résultat meme si ma méthode vous paraîtrait un peu bûcheronne
    c'est la partie netoyageamontaval qui déraille et me retourne des "notfounderror" etc... alors qu’après Control point par point les balises sont bien la
    je parle des balises fantôme bien sur pas de la balise avec le shadow ,celle la c'est bon on la touche plus

    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
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    function shadowcolor(coul, MOD) {    if (selectionne_text()) {
     
     
            var selection = selectionne_text();
            var selectedText = selection.extractContents();
            var BB = document.createElement("SPAN");
            BB.appendChild(selectedText);
            var str = BB.innerHTML;
            var colhtml = BB.getElementsByTagName("SPAN");
            if (colhtml.length > 0) {
                for (var i = 0; i < colhtml.length; i++) {
                    str = str.replace(colhtml[i].outerHTML, colhtml[i].innerHTML);
                }
            }
     
     
            console.log(str);
            BB.innerHTML = str;
            if (MOD == true) {
                BB.style.textShadow = "0px 0px 10px " + coul;
            }
     
     
            selection.insertNode(BB);
            // voila c'est bon on a le shadow et propre 
             var obj = BB;
            //alert(obj.parentElement.tagName);
            // ici pour la suppression de shadow on le met a ""none"" si elle se trouve dans un fontparent shadow
            if (obj.parentElement.tagName != "P") {
                do {
                    obj = obj.parentElement;
                    if (obj.tagName == "SPAN" && MOD == false) {
                        BB.style.textShadow = "none";
                    }
                } while (obj.tagName != "P");
            }
            ////////////////////netoyageamontaval//////////////////////
            if (obj.tagName == "P") {
     
     
                var elements = obj.getElementsByTagName("*");
                if (elements.length == 1) {
                    nb = 0;
                } else {
                    nb = elements.length - 1;
                }
                if (elements.length != 0) {
                    for (var i = 0; i < nb; i++) {
                        if (elements[i] != BB && elements[i].tagName != "IMG" && elements[i].innerHTML == "") {
                            console.log(elements[i]);
                            obj.removeChild(elements[i]);
                        }
                    }
     
     
                }
            }
     
     
        }
        console.log(document.getElementById("editeur").innerHTML); //on regarde le code entier de l'editeur pour le moment il y qu'un P
    }
    voila
    ca me rends chèvre depuis hier ce truc
    mes fichiers dans les contributions:
    mail avec CDO en vba et mail avec CDO en vbs dans un HTA
    survol des bouton dans userform
    prendre un cliché d'un range

    si ton problème est résolu n'oublie pas de pointer : : ça peut servir aux autres
    et n'oublie pas de voter

  11. #51
    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
    bon j'ai enfin compris comment et pourquoi le dom faisait ca
    en fait en mettant un alert juste apres le balise.appendChild(selectedtext) on se rent compte que la sélection disparaît de la ligne
    donc le dom fait le replace(fermeture balise en amont fermeture balise en aval) a ce moment la dans la ligne sur le document mais sans la sélection
    alors forcement quand je fait un insertnode(balise new)c'est son outerHTML que j'insert

    bon ben voila reste a découvrir pour quoi le replace fantome ne fonctionne pas tout du moins en html et mode console
    car ca aussi c'est un truc que je pige pas
    lafichier html tout seul fonctionne bien mais doit certainement pas faire le nettoyage mais ne me bloque pas pour l'erreur
    par contre quand je suis en mode affichage console (F12) la oui il déclenche l'erreur et bloque
    mes fichiers dans les contributions:
    mail avec CDO en vba et mail avec CDO en vbs dans un HTA
    survol des bouton dans userform
    prendre un cliché d'un range

    si ton problème est résolu n'oublie pas de pointer : : ça peut servir aux autres
    et n'oublie pas de voter

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

    Informations forums :
    Inscription : Octobre 2011
    Messages : 2 873
    Points : 3 717
    Points
    3 717
    Par défaut
    Citation Envoyé par patricktoulon Voir le message

    j'ai un wysywyg qui a toutes les fonctions textes qui fonctionnent sauf pour shadow tout du moins pas entièrement entièrement
    mon but car visiblement personne n'a compris
    c'est que cette fonction se comporte comme le fait execcommand pour le size,backcolor,face
    c'est a dire quelle mettre la propriété et quelle face le ménage
    Oui c'est bien ce que j'avais compris, je m'étais penché dessus aussi et je mettais aussi rendu compte que la méthode execCommand fonctionne trés bien pour le formatage de base et même le déformatage pour les balises classiques fonctionne très bien...

    Mais comme elle ne fait pas tout j'ai voulu comprendre comment elle fonctionne pour pouvoir en faire une autre à laquelle j'aurais ajouté les fonctionnalités manquantes... J'ai même trouvé un code (celui de Ckeditor) mais trop difficile à comprendre...

    Citation Envoyé par patricktoulon Voir le message
    bon j'ai enfin compris comment et pourquoi le dom faisait ca
    en fait en mettant un alert juste apres le balise.appendChild(selectedtext) on se rent compte que la sélection disparaît de la ligne
    donc le dom fait le replace(fermeture balise en amont fermeture balise en aval) a ce moment la dans la ligne sur le document mais sans la sélection
    alors forcement quand je fait un insertnode(balise new)c'est son outerHTML que j'insert

    bon ben voila reste a découvrir pour quoi le replace fantome ne fonctionne pas tout du moins en html et mode console
    car ca aussi c'est un truc que je pige pas
    lafichier html tout seul fonctionne bien mais doit certainement pas faire le nettoyage mais ne me bloque pas pour l'erreur
    par contre quand je suis en mode affichage console (F12) la oui il déclenche l'erreur et bloque
    Mise à part ça cela fonctionne correctement (coté rendu visuel obtiens-tu ce qu'il faut) ? C'est-à-dire as-tu résolu le problème de la suppression du Shadow dans les cas que nous avons évoqués ? Est-ce que maintenant cela fonctionne si tu fais cela :
    - tu as trois mots et tu leurs mets un shadow de couleur verte...
    - Tu mets ces trois mots en italique ou gras ou souligné...
    - Peux-tu alors par exemple juste supprimer le shadow du deuxième mot sans toucher aux deux autres mots ? C'est-à-dire le premier et le deuxième mot reste avec un shadow de couleur verte et conservent aussi l'italique, le gras, le souligné...
    Si cela marche cela fera un problème en moins...

  13. #53
    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 ce soucis est resolu


    en fait le soucis était du coté du none ou rien
    pour cela il fallait non seulement tester le parent mais boucler jusque au "p"
    et tester si il y a shadow car le span pouvait etre un subsubsub enfant

    donc je peut mettre/changer ou supprimer au milieu d'une phrase
    avec celle la
    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
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    function shadowcolor(coul, MOD) {    if (selectionne_text()) {
     
     var selection = selectionne_text();
    var selectedText = selection.extractContents();
            var BB = document.createElement("SPAN");
            BB.appendChild(selectedText);
            var str = BB.innerHTML;
            var colhtml = BB.getElementsByTagName("SPAN");
            if (colhtml.length > 0) {
                for (var i = 0; i < colhtml.length; i++) {
                   str = str.replace(colhtml[i].outerHTML, colhtml[i].innerHTML);
                }
            }
     
    console.log(str);
    BB.innerHTML = str;
            if (MOD == true) { BB.style.textShadow = "0px 0px 10px " + coul;}
     
    selection.insertNode(BB);
      var obj=BB;  
        alert(obj.parentElement.tagName);
    if (obj.parentElement.tagName!="P"){
    do{
         obj=obj.parentElement;
         if (obj.tagName=="SPAN" && MOD==false){BB.style.textShadow="none";}
         }while(obj.tagName!="P");
    }
        if(obj.tagName=="P"){
     
         var elements=obj.getElementsByTagName("*");
     
       if(elements.length!=0){
              for (var i=0;i<elements.length;i++){
                  var elements=obj.getElementsByTagName("*");
    if (elements[i]!=BB && elements[i].tagName!="IMG" && elements[i].innerText==""){
     
                   obj.removeChild(elements[0]);
                  }
               }      
     
        }
    }
     
     }
    console.log(document.getElementById("editeur").innerHTML); 
    }
    mes fichiers dans les contributions:
    mail avec CDO en vba et mail avec CDO en vbs dans un HTA
    survol des bouton dans userform
    prendre un cliché d'un range

    si ton problème est résolu n'oublie pas de pointer : : ça peut servir aux autres
    et n'oublie pas de voter

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

    Informations forums :
    Inscription : Octobre 2011
    Messages : 2 873
    Points : 3 717
    Points
    3 717
    Par défaut
    Citation Envoyé par patricktoulon Voir le message
    oui ce soucis est resolu


    en fait le soucis était du coté du none ou rien
    pour cela il fallait non seulement tester le parent mais boucler jusque au "p"
    et tester si il y a shadow car le span pouvait etre un subsubsub enfant

    donc je peut mettre/changer ou supprimer au milieu d'une phrase
    avec celle la
    Ah oui effectivement, j'y pensais justement... Alors en bouclant jusqu'à "p" je crois, mais je n'ai pas testé, que cela limite le shadow à un paragraphe donné, tu ne pourras peut-être pas faire du shadow sur un texte à cheval sur deux paragraphes... Mais bon cela peut être un choix sinon il suffirait je pense de remonter jusqu'à la div de l'éditeur...

    Donc ça va tu t'es bien débrouillé finalement...

    Tu vois que finalement l'usage de la balise span aide bien, c'est ce qui te permet entres autres de faire ce test : if (obj.tagName == "SPAN" && MOD == false), avec la balise font qui sert à d'autres choses cela aurait été plus compliqué... Sinon on peut aussi utiliser la class (ce serait même nécessaire si il y avait d'autres span utilisésr pour autre chose)...

  15. #55
    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
    même mieux regarde on est pas loin du résultat même sur plusieurs paragraphe
    Nom : demo2.gif
Affichages : 385
Taille : 752,5 Ko
    mes fichiers dans les contributions:
    mail avec CDO en vba et mail avec CDO en vbs dans un HTA
    survol des bouton dans userform
    prendre un cliché d'un range

    si ton problème est résolu n'oublie pas de pointer : : ça peut servir aux autres
    et n'oublie pas de voter

  16. #56
    Modérateur

    Avatar de NoSmoking
    Homme Profil pro
    Inscrit en
    Janvier 2011
    Messages
    16 959
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Isère (Rhône Alpes)

    Informations forums :
    Inscription : Janvier 2011
    Messages : 16 959
    Points : 44 122
    Points
    44 122
    Par défaut
    si mon travil est structurer ...
    je ne doute pas que dans l'ensemble c'est vrai mais je parlais de cette fonction pour laquelle il ne semble pas que tu ais envisagé ce qui peux se produire et le type de code qui peut être généré.

    Exemple après plusieurs manipulations tu peux obtenir par exemple (simulation)
    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    Nos<span style="text-shadow: 0px 0px 10px red;">m<span style="text-shadow: none;">okin</span>g<strong> n<span style="text-shadow: none;">e m</span>e</strong> com</span>prend pas
    et il doit y avoir bien pire

    Il faut bien te rendre compte qu'il te faut faire le ménage,
    • en partant du noeud, remonter l'arbre et tester le style pour épurer si c'est le même que le parent.
    • supprimer les <span> sans aucun attribut ou attribut perso
    • supprimer les éléments restant vides
    • ...
    et cela n'est surement pas exhaustif.

    Watilin a bien décrit les outils que tu as à disposition pour triturer le DOM, voir lien mis par Beginner..

  17. #57
    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
    non il n'y a pas pire seule les erreur de none...none se sont avéré a l’intérieur je parle :le soucis pour moi c'est ce qui est a l’extérieur qui me gène

    au pire a l’intérieur je rajoute avec le test mod=false le parent=span et shadow none
    car pour l'instant je teste juste la presence de parent span donc parent direct ou pas en shadow c'est ca l'erreur des none/none/none

    mais je crois avoir trouvé ma solution pour ne pas avoir a faire le ménage a l’extérieur car j'ai compris pour quoi

    ma fonction sort le range de la ligne quand je appendChild a la newbalise et donc le dom restructure en fermant et remise de l'ouverture des balises non fermées
    c'est bien ca j'ai testé

    dans mon future model j'ai réussi a ne pas sortir la sélection il n'y a donc pas de reconstruction de la part du DOM c'est badaze qui m'a mis sur la voix même si son exemple ne me correspond pas

    il fallait simplement trouver le moyen de récupérer le code HTML correspondant a la sélection sans faire un apendChild de la selection sur la new balise
    et j'ai trouvé comment faire

    je potasse encore
    mes fichiers dans les contributions:
    mail avec CDO en vba et mail avec CDO en vbs dans un HTA
    survol des bouton dans userform
    prendre un cliché d'un range

    si ton problème est résolu n'oublie pas de pointer : : ça peut servir aux autres
    et n'oublie pas de voter

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

    Informations forums :
    Inscription : Octobre 2011
    Messages : 2 873
    Points : 3 717
    Points
    3 717
    Par défaut
    Je continue ici car en fait le sujet du fil : voir le code html correspondant à la sélection de texte est résolu...

    Peut-être qu'on pourrait procéder en deux étapes séparer pour le moment :

    1- Concevoir une fonction qui élargie les fonctionnalités de exeCommand et ce en se basant sur la fonction exeCommand elle-même et l'astuce dont on a parlé...
    2- Concevoir une fonction qui supprime un formatage spécifique proprement et de manière optimisée (sans multiplication de balises)...

  19. #59
    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 je veux bien mais quand tu vois ci dessous dans le alert que le style shadow des font est toujours la c'est a ce demander si c'est pas fait pour me rendre dingue ce machin
    pour être honnête avec toi 3 semaines pour essayer de faire ce que je fait en VB VBA VBS en moins de 15 lignes je pense que c'est suffisant pour admettre l’énormité du carnage que l'on a fait sur sur ce language soit disant pour qu'il puisse communiquer avec d'autre language

    je me souvient il y a quelque années m'y etre arrêté et avoir constater des possibilités tout ce que je vois aujourd'hui c'est une grosse M..... dans le quel il faut pédaler
    pour faire quelque chose q'un langage comme vb fait les doigts dans le nez
    allez le debut de la fonction
    j'ai supprimer les "if" je remove carrément l'atrribut "style pour supprimer toute ambiguïté d'interprétation

    regarde le alert
    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
    function backcol(coul,MOD){var ranges  =window.getSelection();
    var mySelectionhtml  =ranges.getRangeAt(0).cloneContents(); 
    var parent=ranges.getRangeAt(0).commonAncestorContainer;
    var newNode  = document.createElement("FONT");
    newNode.appendChild(mySelectionhtml);
    var str=newNode.innerHTML;
    var f=newNode.getElementsByTagName("FONT");
    for(var i=0;i<f.length;i++){
    f[i].removeAttribute("style");
    if( !f[i].hasAttributes()){str=str.replace(f[i].outerHTML,f[i].innerHTML);}
    }
    newNode.innerHTML=str;
    if(MOD==true){newNode.style.textShadow ="0px 0px 10px "+coul;}
     
     
     
     
     alert("newNode= " +newNode.innerHTML);
    }
    c'est un vrai calver
    c'est tellement absurde que je n'ai plus rien en ressource pour voir ou entrevoir une possibilité quelconque
    je n'y comprends plus rien
    je crois sincèrement que mon wysiwyg va rester en VB
    mes fichiers dans les contributions:
    mail avec CDO en vba et mail avec CDO en vbs dans un HTA
    survol des bouton dans userform
    prendre un cliché d'un range

    si ton problème est résolu n'oublie pas de pointer : : ça peut servir aux autres
    et n'oublie pas de voter

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

    Informations forums :
    Inscription : Octobre 2011
    Messages : 2 873
    Points : 3 717
    Points
    3 717
    Par défaut
    Oui je pense que c'est faisable en JS... D'ailleurs cela a déjà été fait, j'avais vu ce plugin : http://ckeditor.com/addon/removeformat pour ckeditor, il y a le source mais comme je disais cela ne me parait pas évident à comprendre (ils utilisent leur librairie...). Dommage car elle a l'air bien...

    Je vais regarder ton code...

+ Répondre à la discussion
Cette discussion est résolue.
Page 3 sur 13 PremièrePremière 1234567 ... DernièreDernière

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