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

jQuery Discussion :

Changer la valeur d'un span via la console du Navigateur ?


Sujet :

jQuery

  1. #1
    Membre du Club
    Homme Profil pro
    Développeur Web
    Inscrit en
    octobre 2013
    Messages
    415
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : Côte d'Ivoire

    Informations professionnelles :
    Activité : Développeur Web
    Secteur : Conseil

    Informations forums :
    Inscription : octobre 2013
    Messages : 415
    Points : 57
    Points
    57
    Par défaut Changer la valeur d'un span via la console du Navigateur ?
    Bonjour.

    Je voudrais savoir s'il y a une méthode pour changer la valeur d'un span via la Console du Navigateur Web ??

    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    <span id="fullname">Trevor</span>

    Si oui, comment donc réaliser cela en JQUERY pour que fonctionne à bien et simplement le changement de "Trevor" via la console du Navigateur sachant que l'id est égal à "fullname" ???

    Merci d'avance.

  2. #2
    Expert éminent
    Avatar de Watilin
    Homme Profil pro
    En recherche d'emploi
    Inscrit en
    juin 2010
    Messages
    3 093
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 33
    Localisation : France, Ille et Vilaine (Bretagne)

    Informations professionnelles :
    Activité : En recherche d'emploi

    Informations forums :
    Inscription : juin 2010
    Messages : 3 093
    Points : 6 751
    Points
    6 751
    Par défaut
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    document.querySelector("#fullname")
    ou
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    document.getElementById("fullname")
    puis
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    … .textContent = "Franklin";
    Attention au jargon : habituellement on réserve le mot « valeur » pour les champs de formulaire. Ici, tu peux dire « contenu texte » ou simplement « contenu ».

    Edit : Ah oui pardon, en jQuery.
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    $("#fullname").text("Franklin");
    Mais c’est une information que tu aurais pu trouver dans n’importe quel tuto, ou dans la doc. Pose une question plus intéressante la prochaine fois
    La FAQ JavaScript – Les cours JavaScript
    Touche F12 = la console → l’outil indispensable pour développer en JavaScript !

  3. #3
    Membre du Club
    Homme Profil pro
    Développeur Web
    Inscrit en
    octobre 2013
    Messages
    415
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : Côte d'Ivoire

    Informations professionnelles :
    Activité : Développeur Web
    Secteur : Conseil

    Informations forums :
    Inscription : octobre 2013
    Messages : 415
    Points : 57
    Points
    57
    Par défaut
    Ok très grand merci à vous.
    Donc, dites-moi, si je peux simplement faire ceci:

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    document.getElementById("fullname").innerHTML = "Franklin";
    ???

    Et puis-je exécuter directement le code suivant:

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    $("#fullname").text("Franklin");
    dans la Console du Navigateur ???

  4. #4
    Expert éminent
    Avatar de Watilin
    Homme Profil pro
    En recherche d'emploi
    Inscrit en
    juin 2010
    Messages
    3 093
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 33
    Localisation : France, Ille et Vilaine (Bretagne)

    Informations professionnelles :
    Activité : En recherche d'emploi

    Informations forums :
    Inscription : juin 2010
    Messages : 3 093
    Points : 6 751
    Points
    6 751
    Par défaut
    Euh, oui tu peux faire les deux. Je ne comprends pas bien ta question
    La FAQ JavaScript – Les cours JavaScript
    Touche F12 = la console → l’outil indispensable pour développer en JavaScript !

  5. #5
    Membre du Club
    Homme Profil pro
    Développeur Web
    Inscrit en
    octobre 2013
    Messages
    415
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : Côte d'Ivoire

    Informations professionnelles :
    Activité : Développeur Web
    Secteur : Conseil

    Informations forums :
    Inscription : octobre 2013
    Messages : 415
    Points : 57
    Points
    57
    Par défaut
    Je veux dire pour exécuter cela, devrais-je simplement passer par la console du Navigateur Web ???

    Si oui, je voudrais aussi savoir si le Code ci-après aussi est correcte en remplaçant la fonction text() par html() :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    $("#fullname").html("Franklin");
    ?????????

  6. #6
    Expert éminent
    Avatar de Watilin
    Homme Profil pro
    En recherche d'emploi
    Inscrit en
    juin 2010
    Messages
    3 093
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 33
    Localisation : France, Ille et Vilaine (Bretagne)

    Informations professionnelles :
    Activité : En recherche d'emploi

    Informations forums :
    Inscription : juin 2010
    Messages : 3 093
    Points : 6 751
    Points
    6 751
    Par défaut
    Oui, tu peux le faire dans la console du navigateur. Le code executé dans la console est équivalent à une balise <script> qui serait injectée dans la page. Le contexte est le même, les variables sont les mêmes, il n’y a pas de séparation.

    La méthode jQuery .html(), tout comme la propriété native .innerHTML, implique un surcoût de CPU car la chaîne que tu passes va être analysée à la recherche de balises HTML. En plus de ça, ça pose un risque de sécurité quand tu manipules des données provenant d’une source tierce : un attaquant pourrait tenter d’injecter une balise <iframe>, <script>, <object>, <embed>, <style> ou n’importe quoi d’autre qui peut servir de vecteur d’attaque. Quand tu ajoutes du texte simple, .textContent (natif) ou .text() (jQuery) est à la fois plus performant et plus sûr.
    La FAQ JavaScript – Les cours JavaScript
    Touche F12 = la console → l’outil indispensable pour développer en JavaScript !

  7. #7
    Membre du Club
    Homme Profil pro
    Développeur Web
    Inscrit en
    octobre 2013
    Messages
    415
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : Côte d'Ivoire

    Informations professionnelles :
    Activité : Développeur Web
    Secteur : Conseil

    Informations forums :
    Inscription : octobre 2013
    Messages : 415
    Points : 57
    Points
    57
    Par défaut
    Ok merci Watilin pour ton explication. Mais une dernière question:

    Peut-on ajouter (utiliser) .textContent ou .text() même si le contenu à modifier est un Chiffre ???

  8. #8
    Expert éminent
    Avatar de Watilin
    Homme Profil pro
    En recherche d'emploi
    Inscrit en
    juin 2010
    Messages
    3 093
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 33
    Localisation : France, Ille et Vilaine (Bretagne)

    Informations professionnelles :
    Activité : En recherche d'emploi

    Informations forums :
    Inscription : juin 2010
    Messages : 3 093
    Points : 6 751
    Points
    6 751
    Par défaut
    Oui.

    Les éléments dans l’arbre DOM ne contiennent que du texte. Quand tu insères un nombre dans le DOM, il est converti en chaîne. Par exemple :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    $("#compteur").text(42);
    Quand tu lis une valeur depuis le DOM, tu reçois une chaîne.
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    let num = $("#compteur").text();
    console.log(typeof num); // affiche "string"
    Si tu veux traiter la donnée comme un nombre, il faut la convertir :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    num = Number.parseInt(num, 10);
    Voir Number.parseInt.
    La FAQ JavaScript – Les cours JavaScript
    Touche F12 = la console → l’outil indispensable pour développer en JavaScript !

  9. #9
    Rédacteur/Modérateur

    Avatar de SpaceFrog
    Homme Profil pro
    Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Inscrit en
    mars 2002
    Messages
    39 129
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 72
    Localisation : Royaume-Uni

    Informations professionnelles :
    Activité : Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Secteur : Industrie

    Informations forums :
    Inscription : mars 2002
    Messages : 39 129
    Points : 65 690
    Points
    65 690
    Billets dans le blog
    1
    Par défaut
    Juste pour éviter un abus de langage ...
    un span n'a pas de value mais un contenu innerHTML ou text ou data
    seuls les éléments de formulaires ont un value (input, select ...)
    Ma page Developpez - Mon Blog Developpez
    Président du CCMPTP (Comité Contre le Mot "Problème" dans les Titres de Posts)
    Deux règles du succès: 1) Ne communiquez jamais à quelqu'un tout votre savoir...
    Votre post est résolu ? Alors n'oubliez pas le Tag

    Venez sur le Chat de Développez !

    réalisations :www.oxygen-translations.fr|www.saftair.fr| www.ouestisol.fr | www.sistac-alizay.fr | www.acoustishop.fr | www.litt.fr | www.ouestventil.fr
    Humour

Discussions similaires

  1. Réponses: 5
    Dernier message: 23/07/2017, 11h03
  2. Changer la valeur d'un champs d'une table acces via vba
    Par gege22mars dans le forum VBA Access
    Réponses: 4
    Dernier message: 10/09/2007, 20h37
  3. Changer la valeur sélectionnée d'un <select> en javasc
    Par Oluha dans le forum Général JavaScript
    Réponses: 4
    Dernier message: 21/02/2005, 15h53
  4. Changer la valeur de la MTU sur un LAN
    Par nin2 dans le forum Réseau
    Réponses: 3
    Dernier message: 19/02/2005, 15h47
  5. [Swing] Changer le contenu d'un Container via un menu
    Par TheSeb dans le forum AWT/Swing
    Réponses: 2
    Dernier message: 07/12/2004, 23h07

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