[{"data":1,"prerenderedAt":4238},["ShallowReactive",2],{"navigation":3,"\u002Fnsi-1ere\u002Fpe-ihm-web\u002Fdom-interaction":585,"\u002Fnsi-1ere\u002Fpe-ihm-web\u002Fdom-interaction__counterpart":2350,"\u002Fnsi-1ere\u002Fpe-ihm-web\u002Fdom-interaction__slides":2794,"annexes-memo:\u002Fnsi-1ere\u002Fpe-ihm-web\u002Fdom-interaction":3380,"annexes-slides:\u002Fnsi-1ere\u002Fpe-ihm-web\u002Fdom-interaction":3737},[4,224,440],{"title":5,"path":6,"stem":7,"children":8},"SNT — Seconde","\u002Fsnt-2nde","0.snt-2nde\u002F0.index",[9,10,14,36,66,92,118,144,162,184,206],{"title":5,"path":6,"stem":7},{"title":11,"path":12,"stem":13},"REVIEW pédagogique — SNT 2nde","\u002Fsnt-2nde\u002Freview","0.snt-2nde\u002FREVIEW",{"title":15,"path":16,"stem":17,"children":18},"Internet","\u002Fsnt-2nde\u002Fsa-internet","0.snt-2nde\u002Fsa-internet\u002F0.index",[19,20,24,28,32],{"title":15,"path":16,"stem":17},{"title":21,"path":22,"stem":23},"Adresses symboliques et DNS","\u002Fsnt-2nde\u002Fsa-internet\u002Fadresses-dns","0.snt-2nde\u002Fsa-internet\u002F1.adresses-dns",{"title":25,"path":26,"stem":27},"Internet et les réseaux physiques","\u002Fsnt-2nde\u002Fsa-internet\u002Freseaux-physiques","0.snt-2nde\u002Fsa-internet\u002F2.reseaux-physiques",{"title":29,"path":30,"stem":31},"Protocoles TCP\u002FIP et routage des paquets","\u002Fsnt-2nde\u002Fsa-internet\u002Ftcp-ip-routage","0.snt-2nde\u002Fsa-internet\u002F3.tcp-ip-routage",{"title":33,"path":34,"stem":35},"Réseaux pair-à-pair","\u002Fsnt-2nde\u002Fsa-internet\u002Fpair-a-pair","0.snt-2nde\u002Fsa-internet\u002F4.pair-a-pair",{"title":37,"path":38,"stem":39,"children":40},"Le Web","\u002Fsnt-2nde\u002Fsb-web","0.snt-2nde\u002Fsb-web\u002F0.index",[41,42,46,50,54,58,62],{"title":37,"path":38,"stem":39},{"title":43,"path":44,"stem":45},"Histoire du Web","\u002Fsnt-2nde\u002Fsb-web\u002Fhistoire-web","0.snt-2nde\u002Fsb-web\u002F1.histoire-web",{"title":47,"path":48,"stem":49},"URL et hypertexte","\u002Fsnt-2nde\u002Fsb-web\u002Furl-hypertexte","0.snt-2nde\u002Fsb-web\u002F2.url-hypertexte",{"title":51,"path":52,"stem":53},"HTML et CSS — le contenu et la présentation","\u002Fsnt-2nde\u002Fsb-web\u002Fhtml-css","0.snt-2nde\u002Fsb-web\u002F3.html-css",{"title":55,"path":56,"stem":57},"Client-serveur et requêtes HTTP","\u002Fsnt-2nde\u002Fsb-web\u002Fclient-serveur-http","0.snt-2nde\u002Fsb-web\u002F4.client-serveur-http",{"title":59,"path":60,"stem":61},"Moteurs de recherche","\u002Fsnt-2nde\u002Fsb-web\u002Fmoteurs-recherche","0.snt-2nde\u002Fsb-web\u002F5.moteurs-recherche",{"title":63,"path":64,"stem":65},"Sécurité du navigateur et notions juridiques","\u002Fsnt-2nde\u002Fsb-web\u002Fsecurite-droits","0.snt-2nde\u002Fsb-web\u002F6.securite-droits",{"title":67,"path":68,"stem":69,"children":70},"Les réseaux sociaux","\u002Fsnt-2nde\u002Fsc-reseaux-sociaux","0.snt-2nde\u002Fsc-reseaux-sociaux\u002F0.index",[71,72,76,80,84,88],{"title":67,"path":68,"stem":69},{"title":73,"path":74,"stem":75},"Panorama des réseaux sociaux","\u002Fsnt-2nde\u002Fsc-reseaux-sociaux\u002Fpanorama-rs","0.snt-2nde\u002Fsc-reseaux-sociaux\u002F1.panorama-rs",{"title":77,"path":78,"stem":79},"Identité numérique et authentification","\u002Fsnt-2nde\u002Fsc-reseaux-sociaux\u002Fidentite-numerique","0.snt-2nde\u002Fsc-reseaux-sociaux\u002F2.identite-numerique",{"title":81,"path":82,"stem":83},"Le modèle économique des réseaux sociaux","\u002Fsnt-2nde\u002Fsc-reseaux-sociaux\u002Fmodele-economique","0.snt-2nde\u002Fsc-reseaux-sociaux\u002F3.modele-economique",{"title":85,"path":86,"stem":87},"Petit monde et graphes","\u002Fsnt-2nde\u002Fsc-reseaux-sociaux\u002Fpetit-monde-graphes","0.snt-2nde\u002Fsc-reseaux-sociaux\u002F4.petit-monde-graphes",{"title":89,"path":90,"stem":91},"La cyberviolence","\u002Fsnt-2nde\u002Fsc-reseaux-sociaux\u002Fcyberviolence","0.snt-2nde\u002Fsc-reseaux-sociaux\u002F5.cyberviolence",{"title":93,"path":94,"stem":95,"children":96},"Les données structurées et leur traitement","\u002Fsnt-2nde\u002Fsd-donnees-structurees","0.snt-2nde\u002Fsd-donnees-structurees\u002F0.index",[97,98,102,106,110,114],{"title":93,"path":94,"stem":95},{"title":99,"path":100,"stem":101},"Données et formats","\u002Fsnt-2nde\u002Fsd-donnees-structurees\u002Fdonnees-formats","0.snt-2nde\u002Fsd-donnees-structurees\u002F1.donnees-formats",{"title":103,"path":104,"stem":105},"Données structurées","\u002Fsnt-2nde\u002Fsd-donnees-structurees\u002Fdonnees-structurees","0.snt-2nde\u002Fsd-donnees-structurees\u002F2.donnees-structurees",{"title":107,"path":108,"stem":109},"Métadonnées","\u002Fsnt-2nde\u002Fsd-donnees-structurees\u002Fmetadonnees","0.snt-2nde\u002Fsd-donnees-structurees\u002F3.metadonnees",{"title":111,"path":112,"stem":113},"Traitement de tables","\u002Fsnt-2nde\u002Fsd-donnees-structurees\u002Ftraitement-tables","0.snt-2nde\u002Fsd-donnees-structurees\u002F4.traitement-tables",{"title":115,"path":116,"stem":117},"Le cloud","\u002Fsnt-2nde\u002Fsd-donnees-structurees\u002Fcloud","0.snt-2nde\u002Fsd-donnees-structurees\u002F5.cloud",{"title":119,"path":120,"stem":121,"children":122},"Localisation, cartographie et mobilité","\u002Fsnt-2nde\u002Fse-localisation-cartographie","0.snt-2nde\u002Fse-localisation-cartographie\u002F0.index",[123,124,128,132,136,140],{"title":119,"path":120,"stem":121},{"title":125,"path":126,"stem":127},"GPS et Galileo — se situer grâce aux satellites","\u002Fsnt-2nde\u002Fse-localisation-cartographie\u002Fgps-galileo","0.snt-2nde\u002Fse-localisation-cartographie\u002F1.gps-galileo",{"title":129,"path":130,"stem":131},"Décoder une trame NMEA","\u002Fsnt-2nde\u002Fse-localisation-cartographie\u002Ftrame-nmea","0.snt-2nde\u002Fse-localisation-cartographie\u002F2.trame-nmea",{"title":133,"path":134,"stem":135},"Cartes numériques — GeoPortail et OpenStreetMap","\u002Fsnt-2nde\u002Fse-localisation-cartographie\u002Fcartes-numeriques","0.snt-2nde\u002Fse-localisation-cartographie\u002F3.cartes-numeriques",{"title":137,"path":138,"stem":139},"Itinéraires et graphes","\u002Fsnt-2nde\u002Fse-localisation-cartographie\u002Fitineraires-graphes","0.snt-2nde\u002Fse-localisation-cartographie\u002F4.itineraires-graphes",{"title":141,"path":142,"stem":143},"Confidentialité de la position","\u002Fsnt-2nde\u002Fse-localisation-cartographie\u002Fconfidentialite-position","0.snt-2nde\u002Fse-localisation-cartographie\u002F5.confidentialite-position",{"title":145,"path":146,"stem":147,"children":148},"Informatique embarquée et objets connectés","\u002Fsnt-2nde\u002Fsf-info-embarquee","0.snt-2nde\u002Fsf-info-embarquee\u002F0.index",[149,150,154,158],{"title":145,"path":146,"stem":147},{"title":151,"path":152,"stem":153},"Systèmes informatiques embarqués","\u002Fsnt-2nde\u002Fsf-info-embarquee\u002Fsystemes-embarques","0.snt-2nde\u002Fsf-info-embarquee\u002F1.systemes-embarques",{"title":155,"path":156,"stem":157},"Capteurs et actionneurs","\u002Fsnt-2nde\u002Fsf-info-embarquee\u002Fcapteurs-actionneurs","0.snt-2nde\u002Fsf-info-embarquee\u002F2.capteurs-actionneurs",{"title":159,"path":160,"stem":161},"IHM et objets connectés","\u002Fsnt-2nde\u002Fsf-info-embarquee\u002Fihm-objet-connecte","0.snt-2nde\u002Fsf-info-embarquee\u002F3.ihm-objet-connecte",{"title":163,"path":164,"stem":165,"children":166},"Photographie numérique","\u002Fsnt-2nde\u002Fsg-photo-numerique","0.snt-2nde\u002Fsg-photo-numerique\u002F0.index",[167,168,172,176,180],{"title":163,"path":164,"stem":165},{"title":169,"path":170,"stem":171},"Photosites, pixels et résolution","\u002Fsnt-2nde\u002Fsg-photo-numerique\u002Fpixels-resolution","0.snt-2nde\u002Fsg-photo-numerique\u002F1.pixels-resolution",{"title":173,"path":174,"stem":175},"Les algorithmes de l'appareil photo","\u002Fsnt-2nde\u002Fsg-photo-numerique\u002Falgorithmes-photo","0.snt-2nde\u002Fsg-photo-numerique\u002F2.algorithmes-photo",{"title":177,"path":178,"stem":179},"Les métadonnées EXIF","\u002Fsnt-2nde\u002Fsg-photo-numerique\u002Fmetadonnees-exif","0.snt-2nde\u002Fsg-photo-numerique\u002F3.metadonnees-exif",{"title":181,"path":182,"stem":183},"Traiter une image en Python","\u002Fsnt-2nde\u002Fsg-photo-numerique\u002Ftraitement-rgb","0.snt-2nde\u002Fsg-photo-numerique\u002F4.traitement-rgb",{"title":185,"path":186,"stem":187,"children":188},"Notions transversales de programmation","\u002Fsnt-2nde\u002Fsh-prog-notions","0.snt-2nde\u002Fsh-prog-notions\u002F0.index",[189,190,194,198,202],{"title":185,"path":186,"stem":187},{"title":191,"path":192,"stem":193},"Séquences d'instructions et variables","\u002Fsnt-2nde\u002Fsh-prog-notions\u002Fsequences-affectations","0.snt-2nde\u002Fsh-prog-notions\u002F1.sequences-affectations",{"title":195,"path":196,"stem":197},"Instructions conditionnelles","\u002Fsnt-2nde\u002Fsh-prog-notions\u002Fconditionnelles","0.snt-2nde\u002Fsh-prog-notions\u002F2.conditionnelles",{"title":199,"path":200,"stem":201},"Boucles bornées et non bornées","\u002Fsnt-2nde\u002Fsh-prog-notions\u002Fboucles","0.snt-2nde\u002Fsh-prog-notions\u002F3.boucles",{"title":203,"path":204,"stem":205},"Définitions et appels de fonctions","\u002Fsnt-2nde\u002Fsh-prog-notions\u002Ffonctions","0.snt-2nde\u002Fsh-prog-notions\u002F4.fonctions",{"title":207,"path":208,"stem":209,"children":210},"Démo des widgets MDC","\u002Fsnt-2nde\u002Fzz-demo-widgets","0.snt-2nde\u002Fzz-demo-widgets\u002F0.index",[211,212,216,220],{"title":207,"path":208,"stem":209},{"title":213,"path":214,"stem":215},"Démo statique — callouts, code, BO, illustration","\u002Fsnt-2nde\u002Fzz-demo-widgets\u002Fstatique","0.snt-2nde\u002Fzz-demo-widgets\u002F1.statique",{"title":217,"path":218,"stem":219},"Démo interactive — self-eval et python-snippet","\u002Fsnt-2nde\u002Fzz-demo-widgets\u002Finteractif","0.snt-2nde\u002Fzz-demo-widgets\u002F2.interactif",{"title":221,"path":222,"stem":223},"Démo · 14 widgets de manipulation NSI","\u002Fsnt-2nde\u002Fzz-demo-widgets\u002Fwidgets-manipulation","0.snt-2nde\u002Fzz-demo-widgets\u002F3.widgets-manipulation",{"title":225,"path":226,"stem":227,"children":228},"NSI — Première","\u002Fnsi-1ere","1.nsi-1ere\u002F0.index",[229,230,234,256,282,304,328,354,380,410],{"title":225,"path":226,"stem":227},{"title":231,"path":232,"stem":233},"Relecture pédagogique — 8 chapitres NSI 1ère (PA → PH)","\u002Fnsi-1ere\u002Freview","1.nsi-1ere\u002FREVIEW",{"title":235,"path":236,"stem":237,"children":238},"Histoire de l'informatique","\u002Fnsi-1ere\u002Fpa-histoire-info","1.nsi-1ere\u002Fpa-histoire-info\u002F0.index",[239,240,244,248,252],{"title":235,"path":236,"stem":237},{"title":241,"path":242,"stem":243},"De la préantiquité aux machines à calculer","\u002Fnsi-1ere\u002Fpa-histoire-info\u002Fpreantiquite-aux-machines","1.nsi-1ere\u002Fpa-histoire-info\u002F1.preantiquite-aux-machines",{"title":245,"path":246,"stem":247},"La machine universelle (1930-1950)","\u002Fnsi-1ere\u002Fpa-histoire-info\u002Fmachine-universelle","1.nsi-1ere\u002Fpa-histoire-info\u002F2.machine-universelle",{"title":249,"path":250,"stem":251},"Les ordinateurs modernes (1947-1990)","\u002Fnsi-1ere\u002Fpa-histoire-info\u002Fordinateurs-modernes","1.nsi-1ere\u002Fpa-histoire-info\u002F3.ordinateurs-modernes",{"title":253,"path":254,"stem":255},"Réseaux, Web et IA (1969 à aujourd'hui)","\u002Fnsi-1ere\u002Fpa-histoire-info\u002Freseaux-et-web","1.nsi-1ere\u002Fpa-histoire-info\u002F4.reseaux-et-web",{"title":257,"path":258,"stem":259,"children":260},"Représentation des données — types et valeurs","\u002Fnsi-1ere\u002Fpb-types-valeurs","1.nsi-1ere\u002Fpb-types-valeurs\u002F0.index",[261,262,266,270,274,278],{"title":257,"path":258,"stem":259},{"title":263,"path":264,"stem":265},"Bases de numération et entiers positifs","\u002Fnsi-1ere\u002Fpb-types-valeurs\u002Fbases-entiers-positifs","1.nsi-1ere\u002Fpb-types-valeurs\u002F1.bases-entiers-positifs",{"title":267,"path":268,"stem":269},"Entiers relatifs et complément à deux","\u002Fnsi-1ere\u002Fpb-types-valeurs\u002Fentiers-relatifs","1.nsi-1ere\u002Fpb-types-valeurs\u002F2.entiers-relatifs",{"title":271,"path":272,"stem":273},"Nombres flottants et virgule flottante","\u002Fnsi-1ere\u002Fpb-types-valeurs\u002Fflottants","1.nsi-1ere\u002Fpb-types-valeurs\u002F3.flottants",{"title":275,"path":276,"stem":277},"Textes et encodages — ASCII, ISO-8859-1, Unicode","\u002Fnsi-1ere\u002Fpb-types-valeurs\u002Ftextes-encodages","1.nsi-1ere\u002Fpb-types-valeurs\u002F4.textes-encodages",{"title":279,"path":280,"stem":281},"Valeurs booléennes et opérateurs logiques","\u002Fnsi-1ere\u002Fpb-types-valeurs\u002Fbooleens","1.nsi-1ere\u002Fpb-types-valeurs\u002F5.booleens",{"title":283,"path":284,"stem":285,"children":286},"Représentation des données : types construits","\u002Fnsi-1ere\u002Fpc-types-construits","1.nsi-1ere\u002Fpc-types-construits\u002F0.index",[287,288,292,296,300],{"title":283,"path":284,"stem":285},{"title":289,"path":290,"stem":291},"Tableaux et listes","\u002Fnsi-1ere\u002Fpc-types-construits\u002Ftableaux-listes","1.nsi-1ere\u002Fpc-types-construits\u002F1.tableaux-listes",{"title":293,"path":294,"stem":295},"Listes en compréhension","\u002Fnsi-1ere\u002Fpc-types-construits\u002Fcomprehension","1.nsi-1ere\u002Fpc-types-construits\u002F2.comprehension",{"title":297,"path":298,"stem":299},"Tuples et p-uplets nommés","\u002Fnsi-1ere\u002Fpc-types-construits\u002Ftuples","1.nsi-1ere\u002Fpc-types-construits\u002F3.tuples",{"title":301,"path":302,"stem":303},"Dictionnaires","\u002Fnsi-1ere\u002Fpc-types-construits\u002Fdictionnaires","1.nsi-1ere\u002Fpc-types-construits\u002F4.dictionnaires",{"title":305,"path":306,"stem":307,"children":308},"Traitement de données en tables","\u002Fnsi-1ere\u002Fpd-tables-donnees","1.nsi-1ere\u002Fpd-tables-donnees\u002F0.index",[309,310,314,318,322],{"title":305,"path":306,"stem":307},{"title":311,"path":312,"stem":313},"Tables et CSV","\u002Fnsi-1ere\u002Fpd-tables-donnees\u002Ftables-csv","1.nsi-1ere\u002Fpd-tables-donnees\u002F1.tables-csv",{"title":315,"path":316,"stem":317},"Recherche et filtrage","\u002Fnsi-1ere\u002Fpd-tables-donnees\u002Frecherche","1.nsi-1ere\u002Fpd-tables-donnees\u002F2.recherche",{"title":319,"path":320,"stem":321},"Trier une table","\u002Fnsi-1ere\u002Fpd-tables-donnees\u002Ftri","1.nsi-1ere\u002Fpd-tables-donnees\u002F3.tri",{"title":323,"path":324,"stem":325,"children":326},"Fusion et indexation","\u002Fnsi-1ere\u002Fpd-tables-donnees\u002Ffusion-indexation","1.nsi-1ere\u002Fpd-tables-donnees\u002F4.fusion-indexation",[327],{"title":323,"path":324,"stem":325},{"title":329,"path":330,"stem":331,"children":332},"IHM sur le Web","\u002Fnsi-1ere\u002Fpe-ihm-web","1.nsi-1ere\u002Fpe-ihm-web\u002F0.index",[333,334,338,342,346,350],{"title":329,"path":330,"stem":331},{"title":335,"path":336,"stem":337},"HTML et CSS — rappel de structure","\u002Fnsi-1ere\u002Fpe-ihm-web\u002Fhtml-css-bases","1.nsi-1ere\u002Fpe-ihm-web\u002F1.html-css-bases",{"title":339,"path":340,"stem":341},"Formulaires HTML","\u002Fnsi-1ere\u002Fpe-ihm-web\u002Fformulaires","1.nsi-1ere\u002Fpe-ihm-web\u002F2.formulaires",{"title":343,"path":344,"stem":345},"Événements JavaScript","\u002Fnsi-1ere\u002Fpe-ihm-web\u002Fevenements-js","1.nsi-1ere\u002Fpe-ihm-web\u002F3.evenements-js",{"title":347,"path":348,"stem":349},"Manipulation du DOM","\u002Fnsi-1ere\u002Fpe-ihm-web\u002Fdom-interaction","1.nsi-1ere\u002Fpe-ihm-web\u002F4.dom-interaction",{"title":351,"path":352,"stem":353},"Client, serveur et HTTP","\u002Fnsi-1ere\u002Fpe-ihm-web\u002Fclient-serveur-http","1.nsi-1ere\u002Fpe-ihm-web\u002F5.client-serveur-http",{"title":355,"path":356,"stem":357,"children":358},"Architectures matérielles et systèmes d'exploitation","\u002Fnsi-1ere\u002Fpf-archi-os","1.nsi-1ere\u002Fpf-archi-os\u002F0.index",[359,360,364,368,372,376],{"title":355,"path":356,"stem":357},{"title":361,"path":362,"stem":363},"Le modèle de von Neumann","\u002Fnsi-1ere\u002Fpf-archi-os\u002Fvon-neumann","1.nsi-1ere\u002Fpf-archi-os\u002F1.von-neumann",{"title":365,"path":366,"stem":367},"Périphériques et interface homme-machine","\u002Fnsi-1ere\u002Fpf-archi-os\u002Fperipheriques-ihm","1.nsi-1ere\u002Fpf-archi-os\u002F2.peripheriques-ihm",{"title":369,"path":370,"stem":371},"Les systèmes d'exploitation","\u002Fnsi-1ere\u002Fpf-archi-os\u002Fsystemes-exploitation","1.nsi-1ere\u002Fpf-archi-os\u002F3.systemes-exploitation",{"title":373,"path":374,"stem":375},"Linux et le shell","\u002Fnsi-1ere\u002Fpf-archi-os\u002Flinux-shell","1.nsi-1ere\u002Fpf-archi-os\u002F4.linux-shell",{"title":377,"path":378,"stem":379},"Réseaux et protocoles","\u002Fnsi-1ere\u002Fpf-archi-os\u002Freseaux","1.nsi-1ere\u002Fpf-archi-os\u002F5.reseaux",{"title":381,"path":382,"stem":383,"children":384},"Langages et programmation","\u002Fnsi-1ere\u002Fpg-langages-prog","1.nsi-1ere\u002Fpg-langages-prog\u002F0.index",[385,386,390,394,398,402,406],{"title":381,"path":382,"stem":383},{"title":387,"path":388,"stem":389},"Diversité et unité des langages de programmation","\u002Fnsi-1ere\u002Fpg-langages-prog\u002Fdiversite-langages","1.nsi-1ere\u002Fpg-langages-prog\u002F1.diversite-langages",{"title":391,"path":392,"stem":393},"Constructions élémentaires","\u002Fnsi-1ere\u002Fpg-langages-prog\u002Fconstructions-elementaires","1.nsi-1ere\u002Fpg-langages-prog\u002F2.constructions-elementaires",{"title":395,"path":396,"stem":397},"Fonctions","\u002Fnsi-1ere\u002Fpg-langages-prog\u002Ffonctions","1.nsi-1ere\u002Fpg-langages-prog\u002F3.fonctions",{"title":399,"path":400,"stem":401},"Spécification d'une fonction","\u002Fnsi-1ere\u002Fpg-langages-prog\u002Fspecification","1.nsi-1ere\u002Fpg-langages-prog\u002F4.specification",{"title":403,"path":404,"stem":405},"Mise au point des programmes","\u002Fnsi-1ere\u002Fpg-langages-prog\u002Fmise-au-point","1.nsi-1ere\u002Fpg-langages-prog\u002F5.mise-au-point",{"title":407,"path":408,"stem":409},"Utilisation de bibliothèques","\u002Fnsi-1ere\u002Fpg-langages-prog\u002Fbibliotheques","1.nsi-1ere\u002Fpg-langages-prog\u002F6.bibliotheques",{"title":411,"path":412,"stem":413,"children":414},"Algorithmique","\u002Fnsi-1ere\u002Fph-algorithmique","1.nsi-1ere\u002Fph-algorithmique\u002F0.index",[415,416,420,424,428,432,436],{"title":411,"path":412,"stem":413},{"title":417,"path":418,"stem":419},"Parcours séquentiel d'un tableau","\u002Fnsi-1ere\u002Fph-algorithmique\u002Fparcours-sequentiel","1.nsi-1ere\u002Fph-algorithmique\u002F1.parcours-sequentiel",{"title":421,"path":422,"stem":423},"Bases de la complexité","\u002Fnsi-1ere\u002Fph-algorithmique\u002Fcomplexite-bases","1.nsi-1ere\u002Fph-algorithmique\u002F2.complexite-bases",{"title":425,"path":426,"stem":427},"Tris par sélection et par insertion","\u002Fnsi-1ere\u002Fph-algorithmique\u002Ftris","1.nsi-1ere\u002Fph-algorithmique\u002F3.tris",{"title":429,"path":430,"stem":431},"Recherche dichotomique","\u002Fnsi-1ere\u002Fph-algorithmique\u002Fdichotomie","1.nsi-1ere\u002Fph-algorithmique\u002F4.dichotomie",{"title":433,"path":434,"stem":435},"Algorithmes gloutons","\u002Fnsi-1ere\u002Fph-algorithmique\u002Fgloutons","1.nsi-1ere\u002Fph-algorithmique\u002F5.gloutons",{"title":437,"path":438,"stem":439},"Les k plus proches voisins (k-NN)","\u002Fnsi-1ere\u002Fph-algorithmique\u002Fknn","1.nsi-1ere\u002Fph-algorithmique\u002F6.knn",{"title":441,"path":442,"stem":443,"children":444},"NSI — Terminale","\u002Fnsi-tale","2.nsi-tale\u002F0.index",[445,446,450,476,498,536,560],{"title":441,"path":442,"stem":443},{"title":447,"path":448,"stem":449},"Review pédagogique — chapitres NSI Terminale (TA, TB, TC, TD, TE)","\u002Fnsi-tale\u002Freview","2.nsi-tale\u002FREVIEW",{"title":451,"path":452,"stem":453,"children":454},"Structures de données","\u002Fnsi-tale\u002Fta-structures-donnees","2.nsi-tale\u002Fta-structures-donnees\u002F0.index",[455,456,460,464,468,472],{"title":451,"path":452,"stem":453},{"title":457,"path":458,"stem":459},"Objet, classe, interface","\u002Fnsi-tale\u002Fta-structures-donnees\u002Finterface-implementation","2.nsi-tale\u002Fta-structures-donnees\u002F1.interface-implementation",{"title":461,"path":462,"stem":463},"Implémenter une structure — l'exemple de la file FIFO","\u002Fnsi-tale\u002Fta-structures-donnees\u002Fimplementer-une-structure","2.nsi-tale\u002Fta-structures-donnees\u002F2.implementer-une-structure",{"title":465,"path":466,"stem":467},"Listes, piles, files, dictionnaires","\u002Fnsi-tale\u002Fta-structures-donnees\u002Flistes-piles-files-dict","2.nsi-tale\u002Fta-structures-donnees\u002F3.listes-piles-files-dict",{"title":469,"path":470,"stem":471},"Arbres binaires","\u002Fnsi-tale\u002Fta-structures-donnees\u002Farbres-binaires","2.nsi-tale\u002Fta-structures-donnees\u002F4.arbres-binaires",{"title":473,"path":474,"stem":475},"Graphes","\u002Fnsi-tale\u002Fta-structures-donnees\u002Fgraphes","2.nsi-tale\u002Fta-structures-donnees\u002F5.graphes",{"title":477,"path":478,"stem":479,"children":480},"Bases de données","\u002Fnsi-tale\u002Ftb-bases-de-donnees","2.nsi-tale\u002Ftb-bases-de-donnees\u002F0.index",[481,482,486,490,494],{"title":477,"path":478,"stem":479},{"title":483,"path":484,"stem":485},"Le modèle relationnel","\u002Fnsi-tale\u002Ftb-bases-de-donnees\u002Fmodele-relationnel","2.nsi-tale\u002Ftb-bases-de-donnees\u002F1.modele-relationnel",{"title":487,"path":488,"stem":489},"Bases de données relationnelles et anomalies de schéma","\u002Fnsi-tale\u002Ftb-bases-de-donnees\u002Fbase-relationnelle","2.nsi-tale\u002Ftb-bases-de-donnees\u002F2.base-relationnelle",{"title":491,"path":492,"stem":493},"Le langage SQL","\u002Fnsi-tale\u002Ftb-bases-de-donnees\u002Fsql","2.nsi-tale\u002Ftb-bases-de-donnees\u002F3.sql",{"title":495,"path":496,"stem":497},"Les systèmes de gestion de bases de données","\u002Fnsi-tale\u002Ftb-bases-de-donnees\u002Fsgbd","2.nsi-tale\u002Ftb-bases-de-donnees\u002F4.sgbd",{"title":499,"path":500,"stem":501,"children":502},"Architectures matérielles, systèmes d'exploitation et réseaux","\u002Fnsi-tale\u002Ftc-archi-os-reseaux","2.nsi-tale\u002Ftc-archi-os-reseaux\u002F0.index",[503,504,508,512,516,520,524,528,532],{"title":499,"path":500,"stem":501},{"title":505,"path":506,"stem":507},"Le système sur puce (SoC)","\u002Fnsi-tale\u002Ftc-archi-os-reseaux\u002Fsysteme-sur-puce","2.nsi-tale\u002Ftc-archi-os-reseaux\u002F1.systeme-sur-puce",{"title":509,"path":510,"stem":511},"Processus et ordonnancement par l'OS","\u002Fnsi-tale\u002Ftc-archi-os-reseaux\u002Fprocessus-os","2.nsi-tale\u002Ftc-archi-os-reseaux\u002F2.processus-os",{"title":513,"path":514,"stem":515},"L'interblocage (deadlock)","\u002Fnsi-tale\u002Ftc-archi-os-reseaux\u002Finterblocage","2.nsi-tale\u002Ftc-archi-os-reseaux\u002F3.interblocage",{"title":517,"path":518,"stem":519},"Principes du routage","\u002Fnsi-tale\u002Ftc-archi-os-reseaux\u002Froutage-principes","2.nsi-tale\u002Ftc-archi-os-reseaux\u002F4.routage-principes",{"title":521,"path":522,"stem":523},"Protocoles de routage RIP et OSPF","\u002Fnsi-tale\u002Ftc-archi-os-reseaux\u002Fprotocoles-rip-ospf","2.nsi-tale\u002Ftc-archi-os-reseaux\u002F5.protocoles-rip-ospf",{"title":525,"path":526,"stem":527},"Chiffrement symétrique","\u002Fnsi-tale\u002Ftc-archi-os-reseaux\u002Fchiffrement-symetrique","2.nsi-tale\u002Ftc-archi-os-reseaux\u002F6.chiffrement-symetrique",{"title":529,"path":530,"stem":531},"Chiffrement asymétrique","\u002Fnsi-tale\u002Ftc-archi-os-reseaux\u002Fchiffrement-asymetrique","2.nsi-tale\u002Ftc-archi-os-reseaux\u002F7.chiffrement-asymetrique",{"title":533,"path":534,"stem":535},"HTTPS — l'échange de clé symétrique","\u002Fnsi-tale\u002Ftc-archi-os-reseaux\u002Fhttps-tls","2.nsi-tale\u002Ftc-archi-os-reseaux\u002F8.https-tls",{"title":381,"path":537,"stem":538,"children":539},"\u002Fnsi-tale\u002Ftd-langages-prog","2.nsi-tale\u002Ftd-langages-prog\u002F0.index",[540,541,544,548,552,556],{"title":381,"path":537,"stem":538},{"title":403,"path":542,"stem":543},"\u002Fnsi-tale\u002Ftd-langages-prog\u002Fmise-au-point","2.nsi-tale\u002Ftd-langages-prog\u002F1.mise-au-point",{"title":545,"path":546,"stem":547},"Modularité","\u002Fnsi-tale\u002Ftd-langages-prog\u002Fmodularite","2.nsi-tale\u002Ftd-langages-prog\u002F2.modularite",{"title":549,"path":550,"stem":551},"Récursivité","\u002Fnsi-tale\u002Ftd-langages-prog\u002Frecursivite","2.nsi-tale\u002Ftd-langages-prog\u002F3.recursivite",{"title":553,"path":554,"stem":555},"Paradigmes de programmation","\u002Fnsi-tale\u002Ftd-langages-prog\u002Fparadigmes","2.nsi-tale\u002Ftd-langages-prog\u002F4.paradigmes",{"title":557,"path":558,"stem":559},"Programme comme donnée — calculabilité et indécidabilité","\u002Fnsi-tale\u002Ftd-langages-prog\u002Fprogramme-comme-donnee","2.nsi-tale\u002Ftd-langages-prog\u002F5.programme-comme-donnee",{"title":411,"path":561,"stem":562,"children":563},"\u002Fnsi-tale\u002Fte-algorithmique","2.nsi-tale\u002Fte-algorithmique\u002F0.index",[564,565,569,573,577,581],{"title":411,"path":561,"stem":562},{"title":566,"path":567,"stem":568},"Algorithmes sur les arbres binaires","\u002Fnsi-tale\u002Fte-algorithmique\u002Farbres-binaires-algos","2.nsi-tale\u002Fte-algorithmique\u002F1.arbres-binaires-algos",{"title":570,"path":571,"stem":572},"Parcours de graphes — DFS, BFS, cycles, chemins","\u002Fnsi-tale\u002Fte-algorithmique\u002Fgraphes-parcours","2.nsi-tale\u002Fte-algorithmique\u002F2.graphes-parcours",{"title":574,"path":575,"stem":576},"Diviser pour régner","\u002Fnsi-tale\u002Fte-algorithmique\u002Fdiviser-pour-regner","2.nsi-tale\u002Fte-algorithmique\u002F3.diviser-pour-regner",{"title":578,"path":579,"stem":580},"Programmation dynamique","\u002Fnsi-tale\u002Fte-algorithmique\u002Fprogrammation-dynamique","2.nsi-tale\u002Fte-algorithmique\u002F4.programmation-dynamique",{"title":582,"path":583,"stem":584},"Recherche textuelle — l'algorithme de Boyer-Moore","\u002Fnsi-tale\u002Fte-algorithmique\u002Frecherche-textuelle","2.nsi-tale\u002Fte-algorithmique\u002F5.recherche-textuelle",{"id":586,"title":347,"bo":587,"body":589,"description":2335,"eval":2336,"extension":2337,"labo":2336,"meta":2338,"navigation":836,"path":348,"quizzes":2339,"readingTime":673,"seo":2348,"stem":349,"tp":2336,"__hash__":2349},"cours\u002F1.nsi-1ere\u002Fpe-ihm-web\u002F4.dom-interaction.md",[588],"PE02",{"type":590,"value":591,"toc":2322},"minimark",[592,597,642,649,653,660,744,751,759,769,783,787,792,963,1060,1088,1116,1120,1123,1212,1215,1241,1262,1266,1269,1374,1380,1445,1449,1452,1580,1593,1643,1668,1672,1675,1779,1782,1797,1808,1812,1815,1841,1941,1951,1955,2059,2198,2207,2229,2233,2304,2308,2319],[593,594,596],"h2",{"id":595},"introduction","Introduction",[598,599,600,601,605,606,609,610,613,614,618,619,622,623,627,628,627,631,634,635,627,638,641],"p",{},"Une fois capable de ",[602,603,604],"strong",{},"détecter"," une action de l'utilisateur (cours\nprécédent), il reste à ",[602,607,608],{},"modifier la page"," en réponse. C'est ce que permet le\n",[602,611,612],{},"DOM"," — ",[615,616,617],"em",{},"Document Object Model"," — la représentation du document HTML sous\nforme d'un ",[602,620,621],{},"arbre d'objets manipulables"," depuis JavaScript. Chaque balise du\nHTML devient un objet JS avec des propriétés (",[624,625,626],"code",{},"textContent",", ",[624,629,630],{},"style",[624,632,633],{},"id","…)\net des méthodes (",[624,636,637],{},"appendChild",[624,639,640],{},"setAttribute","…).",[598,643,644,645,648],{},"Voir ",[646,647],"bo-ref",{"code":588},".",[593,650,652],{"id":651},"quest-ce-que-le-dom","Qu'est-ce que le DOM ?",[598,654,655,656,659],{},"Quand un navigateur charge une page HTML, il construit en mémoire un ",[602,657,658],{},"arbre","\nqui reflète la structure imbriquée des balises. Le HTML suivant :",[661,662,667],"pre",{"className":663,"code":664,"language":665,"meta":666,"style":666},"language-html shiki shiki-themes github-light github-light github-dark","\u003Cbody>\n  \u003Ch1 id=\"titre\">Bonjour\u003C\u002Fh1>\n  \u003Cp class=\"intro\">Bienvenue.\u003C\u002Fp>\n\u003C\u002Fbody>\n","html","",[624,668,669,685,712,734],{"__ignoreMap":666},[670,671,674,678,682],"span",{"class":672,"line":673},"line",1,[670,675,677],{"class":676},"sxrX7","\u003C",[670,679,681],{"class":680},"sovSZ","body",[670,683,684],{"class":676},">\n",[670,686,688,691,694,698,701,705,708,710],{"class":672,"line":687},2,[670,689,690],{"class":676},"  \u003C",[670,692,693],{"class":680},"h1",[670,695,697],{"class":696},"snPdu"," id",[670,699,700],{"class":676},"=",[670,702,704],{"class":703},"sIIMD","\"titre\"",[670,706,707],{"class":676},">Bonjour\u003C\u002F",[670,709,693],{"class":680},[670,711,684],{"class":676},[670,713,715,717,719,722,724,727,730,732],{"class":672,"line":714},3,[670,716,690],{"class":676},[670,718,598],{"class":680},[670,720,721],{"class":696}," class",[670,723,700],{"class":676},[670,725,726],{"class":703},"\"intro\"",[670,728,729],{"class":676},">Bienvenue.\u003C\u002F",[670,731,598],{"class":680},[670,733,684],{"class":676},[670,735,737,740,742],{"class":672,"line":736},4,[670,738,739],{"class":676},"\u003C\u002F",[670,741,681],{"class":680},[670,743,684],{"class":676},[598,745,746,747,750],{},"donne, en mémoire, un arbre dont la racine est ",[624,748,749],{},"document"," :",[661,752,757],{"className":753,"code":755,"language":756},[754],"language-text","document\n└── \u003Chtml>\n    ├── \u003Chead>...\u003C\u002Fhead>\n    └── \u003Cbody>\n        ├── \u003Ch1 id=\"titre\">Bonjour\u003C\u002Fh1>\n        └── \u003Cp class=\"intro\">Bienvenue.\u003C\u002Fp>\n","text",[624,758,755],{"__ignoreMap":666},[598,760,761,762,764,765,768],{},"JavaScript dispose d'un objet global ",[624,763,749],{}," qui sert de ",[602,766,767],{},"point d'entrée","\nà cet arbre. Tout ce qui suit en découle.",[770,771,772],"note",{},[598,773,774,775,778,779,782],{},"Le DOM n'est pas le HTML. Le HTML est le ",[602,776,777],{},"texte source"," ; le DOM est l'",[602,780,781],{},"arbre\nvivant"," construit par le navigateur. Quand JavaScript ajoute un paragraphe,\nle HTML d'origine ne change pas — mais le DOM, oui, et l'écran reflète le DOM.",[593,784,786],{"id":785},"sélectionner-des-éléments","Sélectionner des éléments",[598,788,789,790,750],{},"Cinq méthodes principales sur ",[624,791,749],{},[661,793,797],{"className":794,"code":795,"language":796,"meta":666,"style":666},"language-js shiki shiki-themes github-light github-light github-dark","\u002F\u002F Par identifiant (un seul élément, ou null)\nconst titre = document.getElementById(\"titre\");\n\n\u002F\u002F Par classe (collection vivante d'éléments)\nconst intros = document.getElementsByClassName(\"intro\");\n\n\u002F\u002F Par nom de balise (collection vivante)\nconst tousLesP = document.getElementsByTagName(\"p\");\n\n\u002F\u002F Par sélecteur CSS — premier élément trouvé\nconst premier = document.querySelector(\".intro\");\n\n\u002F\u002F Par sélecteur CSS — tous les éléments\nconst tous = document.querySelectorAll(\"p.intro\");\n","js",[624,798,799,805,832,838,843,864,869,875,897,902,908,930,935,941],{"__ignoreMap":666},[670,800,801],{"class":672,"line":673},[670,802,804],{"class":803},"sCsY4","\u002F\u002F Par identifiant (un seul élément, ou null)\n",[670,806,807,811,815,818,821,824,827,829],{"class":672,"line":687},[670,808,810],{"class":809},"s8jYJ","const",[670,812,814],{"class":813},"sBjJW"," titre",[670,816,817],{"class":809}," =",[670,819,820],{"class":676}," document.",[670,822,823],{"class":696},"getElementById",[670,825,826],{"class":676},"(",[670,828,704],{"class":703},[670,830,831],{"class":676},");\n",[670,833,834],{"class":672,"line":714},[670,835,837],{"emptyLinePlaceholder":836},true,"\n",[670,839,840],{"class":672,"line":736},[670,841,842],{"class":803},"\u002F\u002F Par classe (collection vivante d'éléments)\n",[670,844,846,848,851,853,855,858,860,862],{"class":672,"line":845},5,[670,847,810],{"class":809},[670,849,850],{"class":813}," intros",[670,852,817],{"class":809},[670,854,820],{"class":676},[670,856,857],{"class":696},"getElementsByClassName",[670,859,826],{"class":676},[670,861,726],{"class":703},[670,863,831],{"class":676},[670,865,867],{"class":672,"line":866},6,[670,868,837],{"emptyLinePlaceholder":836},[670,870,872],{"class":672,"line":871},7,[670,873,874],{"class":803},"\u002F\u002F Par nom de balise (collection vivante)\n",[670,876,878,880,883,885,887,890,892,895],{"class":672,"line":877},8,[670,879,810],{"class":809},[670,881,882],{"class":813}," tousLesP",[670,884,817],{"class":809},[670,886,820],{"class":676},[670,888,889],{"class":696},"getElementsByTagName",[670,891,826],{"class":676},[670,893,894],{"class":703},"\"p\"",[670,896,831],{"class":676},[670,898,900],{"class":672,"line":899},9,[670,901,837],{"emptyLinePlaceholder":836},[670,903,905],{"class":672,"line":904},10,[670,906,907],{"class":803},"\u002F\u002F Par sélecteur CSS — premier élément trouvé\n",[670,909,911,913,916,918,920,923,925,928],{"class":672,"line":910},11,[670,912,810],{"class":809},[670,914,915],{"class":813}," premier",[670,917,817],{"class":809},[670,919,820],{"class":676},[670,921,922],{"class":696},"querySelector",[670,924,826],{"class":676},[670,926,927],{"class":703},"\".intro\"",[670,929,831],{"class":676},[670,931,933],{"class":672,"line":932},12,[670,934,837],{"emptyLinePlaceholder":836},[670,936,938],{"class":672,"line":937},13,[670,939,940],{"class":803},"\u002F\u002F Par sélecteur CSS — tous les éléments\n",[670,942,944,946,949,951,953,956,958,961],{"class":672,"line":943},14,[670,945,810],{"class":809},[670,947,948],{"class":813}," tous",[670,950,817],{"class":809},[670,952,820],{"class":676},[670,954,955],{"class":696},"querySelectorAll",[670,957,826],{"class":676},[670,959,960],{"class":703},"\"p.intro\"",[670,962,831],{"class":676},[964,965,966,982],"table",{},[967,968,969],"thead",{},[970,971,972,976,979],"tr",{},[973,974,975],"th",{},"Méthode",[973,977,978],{},"Renvoie",[973,980,981],{},"Quand l'utiliser",[983,984,985,1007,1020,1032,1047],"tbody",{},[970,986,987,993,1002],{},[988,989,990],"td",{},[624,991,992],{},"getElementById(\"x\")",[988,994,995,996,998,999,648],{},"L'élément avec cet ",[624,997,633],{},", ou ",[624,1000,1001],{},"null",[988,1003,1004,1005,648],{},"Cible unique connue par ",[624,1006,633],{},[970,1008,1009,1014,1017],{},[988,1010,1011],{},[624,1012,1013],{},"getElementsByClassName(\"c\")",[988,1015,1016],{},"Collection HTML d'éléments.",[988,1018,1019],{},"Plusieurs éléments par classe.",[970,1021,1022,1027,1029],{},[988,1023,1024],{},[624,1025,1026],{},"getElementsByTagName(\"t\")",[988,1028,1016],{},[988,1030,1031],{},"Tous les éléments d'un type.",[970,1033,1034,1039,1044],{},[988,1035,1036],{},[624,1037,1038],{},"querySelector(\"…\")",[988,1040,1041,1042,648],{},"Le premier élément correspondant, ou ",[624,1043,1001],{},[988,1045,1046],{},"Cible unique via sélecteur CSS.",[970,1048,1049,1054,1057],{},[988,1050,1051],{},[624,1052,1053],{},"querySelectorAll(\"…\")",[988,1055,1056],{},"Liste statique d'éléments.",[988,1058,1059],{},"Plusieurs éléments via sélecteur CSS.",[1061,1062,1063],"tip",{},[598,1064,1065,1066,1073,1074,627,1077,1080,1081,627,1084,1087],{},"En pratique, ",[602,1067,1068,1070,1071],{},[624,1069,922],{}," et ",[624,1072,955],{}," suffisent à presque\ntout : ils acceptent n'importe quel sélecteur CSS (",[624,1075,1076],{},"#id",[624,1078,1079],{},".classe",",\n",[624,1082,1083],{},"tag.classe",[624,1085,1086],{},"ul > li.actif","…). Privilégiez-les pour la cohérence.",[1089,1090,1093,1099],"self-eval-qcm",{"correct":1091,"slug":1092},"1","dom-interaction-c1",[1094,1095,1096],"template",{"v-slot:question":666},[598,1097,1098],{},"Que renvoie document.getElementById('inconnu') si aucun élément n'a cet id ?",[1094,1100,1101],{"v-slot:choices":666},[1102,1103,1104,1108,1110,1113],"ul",{},[1105,1106,1107],"li",{},"undefined",[1105,1109,1001],{},[1105,1111,1112],{},"[]",[1105,1114,1115],{},"une erreur",[593,1117,1119],{"id":1118},"modifier-le-contenu-dun-élément","Modifier le contenu d'un élément",[598,1121,1122],{},"Une fois un élément sélectionné, on peut lire ou modifier son contenu :",[661,1124,1126],{"className":794,"code":1125,"language":796,"meta":666,"style":666},"const titre = document.getElementById(\"titre\");\n\n\u002F\u002F Lire le texte\nconsole.log(titre.textContent); \u002F\u002F \"Bonjour\"\n\n\u002F\u002F Remplacer le texte\ntitre.textContent = \"Bonsoir\";\n\n\u002F\u002F Injecter du HTML (avec balises interprétées)\ntitre.innerHTML = \"Salut \u003Cem>tout le monde\u003C\u002Fem>\";\n",[624,1127,1128,1146,1150,1155,1169,1173,1178,1191,1195,1200],{"__ignoreMap":666},[670,1129,1130,1132,1134,1136,1138,1140,1142,1144],{"class":672,"line":673},[670,1131,810],{"class":809},[670,1133,814],{"class":813},[670,1135,817],{"class":809},[670,1137,820],{"class":676},[670,1139,823],{"class":696},[670,1141,826],{"class":676},[670,1143,704],{"class":703},[670,1145,831],{"class":676},[670,1147,1148],{"class":672,"line":687},[670,1149,837],{"emptyLinePlaceholder":836},[670,1151,1152],{"class":672,"line":714},[670,1153,1154],{"class":803},"\u002F\u002F Lire le texte\n",[670,1156,1157,1160,1163,1166],{"class":672,"line":736},[670,1158,1159],{"class":676},"console.",[670,1161,1162],{"class":696},"log",[670,1164,1165],{"class":676},"(titre.textContent); ",[670,1167,1168],{"class":803},"\u002F\u002F \"Bonjour\"\n",[670,1170,1171],{"class":672,"line":845},[670,1172,837],{"emptyLinePlaceholder":836},[670,1174,1175],{"class":672,"line":866},[670,1176,1177],{"class":803},"\u002F\u002F Remplacer le texte\n",[670,1179,1180,1183,1185,1188],{"class":672,"line":871},[670,1181,1182],{"class":676},"titre.textContent ",[670,1184,700],{"class":809},[670,1186,1187],{"class":703}," \"Bonsoir\"",[670,1189,1190],{"class":676},";\n",[670,1192,1193],{"class":672,"line":877},[670,1194,837],{"emptyLinePlaceholder":836},[670,1196,1197],{"class":672,"line":899},[670,1198,1199],{"class":803},"\u002F\u002F Injecter du HTML (avec balises interprétées)\n",[670,1201,1202,1205,1207,1210],{"class":672,"line":904},[670,1203,1204],{"class":676},"titre.innerHTML ",[670,1206,700],{"class":809},[670,1208,1209],{"class":703}," \"Salut \u003Cem>tout le monde\u003C\u002Fem>\"",[670,1211,1190],{"class":676},[598,1213,1214],{},"Différence cruciale :",[1102,1216,1217,1229],{},[1105,1218,1219,1224,1225,1228],{},[602,1220,1221],{},[624,1222,1223],{},".textContent"," traite la valeur comme du ",[602,1226,1227],{},"texte brut",". Sûr et rapide.",[1105,1230,1231,1236,1237,1240],{},[602,1232,1233],{},[624,1234,1235],{},".innerHTML"," interprète la valeur comme du ",[602,1238,1239],{},"HTML",". Puissant mais\ndangereux si la valeur vient d'un utilisateur (risque d'injection).",[1242,1243,1244],"warning",{},[598,1245,1246,1247,1250,1251,1254,1255,1258,1259,648],{},"Ne jamais faire ",[624,1248,1249],{},"element.innerHTML = saisieUtilisateur"," sans précaution :\nc'est la principale source de failles ",[602,1252,1253],{},"XSS"," (",[615,1256,1257],{},"cross-site scripting",").\nPréférer ",[624,1260,1261],{},"element.textContent = saisieUtilisateur",[593,1263,1265],{"id":1264},"modifier-des-attributs","Modifier des attributs",[598,1267,1268],{},"Trois opérations standard :",[661,1270,1272],{"className":794,"code":1271,"language":796,"meta":666,"style":666},"const img = document.getElementById(\"photo\");\n\n\u002F\u002F Lire un attribut\nconsole.log(img.getAttribute(\"src\"));\n\n\u002F\u002F Définir \u002F changer un attribut\nimg.setAttribute(\"alt\", \"Nouvelle description\");\n\n\u002F\u002F Supprimer un attribut\nimg.removeAttribute(\"title\");\n",[624,1273,1274,1294,1298,1303,1323,1327,1332,1351,1355,1360],{"__ignoreMap":666},[670,1275,1276,1278,1281,1283,1285,1287,1289,1292],{"class":672,"line":673},[670,1277,810],{"class":809},[670,1279,1280],{"class":813}," img",[670,1282,817],{"class":809},[670,1284,820],{"class":676},[670,1286,823],{"class":696},[670,1288,826],{"class":676},[670,1290,1291],{"class":703},"\"photo\"",[670,1293,831],{"class":676},[670,1295,1296],{"class":672,"line":687},[670,1297,837],{"emptyLinePlaceholder":836},[670,1299,1300],{"class":672,"line":714},[670,1301,1302],{"class":803},"\u002F\u002F Lire un attribut\n",[670,1304,1305,1307,1309,1312,1315,1317,1320],{"class":672,"line":736},[670,1306,1159],{"class":676},[670,1308,1162],{"class":696},[670,1310,1311],{"class":676},"(img.",[670,1313,1314],{"class":696},"getAttribute",[670,1316,826],{"class":676},[670,1318,1319],{"class":703},"\"src\"",[670,1321,1322],{"class":676},"));\n",[670,1324,1325],{"class":672,"line":845},[670,1326,837],{"emptyLinePlaceholder":836},[670,1328,1329],{"class":672,"line":866},[670,1330,1331],{"class":803},"\u002F\u002F Définir \u002F changer un attribut\n",[670,1333,1334,1337,1339,1341,1344,1346,1349],{"class":672,"line":871},[670,1335,1336],{"class":676},"img.",[670,1338,640],{"class":696},[670,1340,826],{"class":676},[670,1342,1343],{"class":703},"\"alt\"",[670,1345,627],{"class":676},[670,1347,1348],{"class":703},"\"Nouvelle description\"",[670,1350,831],{"class":676},[670,1352,1353],{"class":672,"line":877},[670,1354,837],{"emptyLinePlaceholder":836},[670,1356,1357],{"class":672,"line":899},[670,1358,1359],{"class":803},"\u002F\u002F Supprimer un attribut\n",[670,1361,1362,1364,1367,1369,1372],{"class":672,"line":904},[670,1363,1336],{"class":676},[670,1365,1366],{"class":696},"removeAttribute",[670,1368,826],{"class":676},[670,1370,1371],{"class":703},"\"title\"",[670,1373,831],{"class":676},[598,1375,1376,1377,750],{},"Pour certains attributs courants, on peut aussi y accéder en tant que\n",[602,1378,1379],{},"propriété",[661,1381,1383],{"className":794,"code":1382,"language":796,"meta":666,"style":666},"img.src = \"nouveau.jpg\";\nimg.alt = \"Description\";\n\nconst lien = document.querySelector(\"a\");\nlien.href = \"https:\u002F\u002Fnsi.rocks\";\n",[624,1384,1385,1397,1409,1413,1433],{"__ignoreMap":666},[670,1386,1387,1390,1392,1395],{"class":672,"line":673},[670,1388,1389],{"class":676},"img.src ",[670,1391,700],{"class":809},[670,1393,1394],{"class":703}," \"nouveau.jpg\"",[670,1396,1190],{"class":676},[670,1398,1399,1402,1404,1407],{"class":672,"line":687},[670,1400,1401],{"class":676},"img.alt ",[670,1403,700],{"class":809},[670,1405,1406],{"class":703}," \"Description\"",[670,1408,1190],{"class":676},[670,1410,1411],{"class":672,"line":714},[670,1412,837],{"emptyLinePlaceholder":836},[670,1414,1415,1417,1420,1422,1424,1426,1428,1431],{"class":672,"line":736},[670,1416,810],{"class":809},[670,1418,1419],{"class":813}," lien",[670,1421,817],{"class":809},[670,1423,820],{"class":676},[670,1425,922],{"class":696},[670,1427,826],{"class":676},[670,1429,1430],{"class":703},"\"a\"",[670,1432,831],{"class":676},[670,1434,1435,1438,1440,1443],{"class":672,"line":845},[670,1436,1437],{"class":676},"lien.href ",[670,1439,700],{"class":809},[670,1441,1442],{"class":703}," \"https:\u002F\u002Fnsi.rocks\"",[670,1444,1190],{"class":676},[593,1446,1448],{"id":1447},"modifier-le-style","Modifier le style",[598,1450,1451],{},"Deux approches, à choisir selon le contexte :",[661,1453,1455],{"className":794,"code":1454,"language":796,"meta":666,"style":666},"const titre = document.getElementById(\"titre\");\n\n\u002F\u002F 1. Propriété par propriété (style inline)\ntitre.style.color = \"navy\";\ntitre.style.fontSize = \"32px\";       \u002F\u002F notez le camelCase\ntitre.style.backgroundColor = \"yellow\";\n\n\u002F\u002F 2. Ajouter \u002F retirer une classe CSS (préféré)\ntitre.classList.add(\"souligne\");\ntitre.classList.remove(\"ancien\");\ntitre.classList.toggle(\"actif\");     \u002F\u002F bascule on\u002Foff\n",[624,1456,1457,1475,1479,1484,1496,1512,1524,1528,1533,1548,1562],{"__ignoreMap":666},[670,1458,1459,1461,1463,1465,1467,1469,1471,1473],{"class":672,"line":673},[670,1460,810],{"class":809},[670,1462,814],{"class":813},[670,1464,817],{"class":809},[670,1466,820],{"class":676},[670,1468,823],{"class":696},[670,1470,826],{"class":676},[670,1472,704],{"class":703},[670,1474,831],{"class":676},[670,1476,1477],{"class":672,"line":687},[670,1478,837],{"emptyLinePlaceholder":836},[670,1480,1481],{"class":672,"line":714},[670,1482,1483],{"class":803},"\u002F\u002F 1. Propriété par propriété (style inline)\n",[670,1485,1486,1489,1491,1494],{"class":672,"line":736},[670,1487,1488],{"class":676},"titre.style.color ",[670,1490,700],{"class":809},[670,1492,1493],{"class":703}," \"navy\"",[670,1495,1190],{"class":676},[670,1497,1498,1501,1503,1506,1509],{"class":672,"line":845},[670,1499,1500],{"class":676},"titre.style.fontSize ",[670,1502,700],{"class":809},[670,1504,1505],{"class":703}," \"32px\"",[670,1507,1508],{"class":676},";       ",[670,1510,1511],{"class":803},"\u002F\u002F notez le camelCase\n",[670,1513,1514,1517,1519,1522],{"class":672,"line":866},[670,1515,1516],{"class":676},"titre.style.backgroundColor ",[670,1518,700],{"class":809},[670,1520,1521],{"class":703}," \"yellow\"",[670,1523,1190],{"class":676},[670,1525,1526],{"class":672,"line":871},[670,1527,837],{"emptyLinePlaceholder":836},[670,1529,1530],{"class":672,"line":877},[670,1531,1532],{"class":803},"\u002F\u002F 2. Ajouter \u002F retirer une classe CSS (préféré)\n",[670,1534,1535,1538,1541,1543,1546],{"class":672,"line":899},[670,1536,1537],{"class":676},"titre.classList.",[670,1539,1540],{"class":696},"add",[670,1542,826],{"class":676},[670,1544,1545],{"class":703},"\"souligne\"",[670,1547,831],{"class":676},[670,1549,1550,1552,1555,1557,1560],{"class":672,"line":904},[670,1551,1537],{"class":676},[670,1553,1554],{"class":696},"remove",[670,1556,826],{"class":676},[670,1558,1559],{"class":703},"\"ancien\"",[670,1561,831],{"class":676},[670,1563,1564,1566,1569,1571,1574,1577],{"class":672,"line":910},[670,1565,1537],{"class":676},[670,1567,1568],{"class":696},"toggle",[670,1570,826],{"class":676},[670,1572,1573],{"class":703},"\"actif\"",[670,1575,1576],{"class":676},");     ",[670,1578,1579],{"class":803},"\u002F\u002F bascule on\u002Foff\n",[1061,1581,1582],{},[598,1583,1584,1585,1588,1589,1592],{},"La méthode ",[602,1586,1587],{},"classList"," est presque toujours préférable à la modification\ndirecte de ",[624,1590,1591],{},".style"," : elle laisse le CSS gérer la présentation et le JS\ngérer le comportement (« telle classe est active »). Plus propre, plus\nmaintenable.",[661,1594,1598],{"className":1595,"code":1596,"language":1597,"meta":666,"style":666},"language-css shiki shiki-themes github-light github-light github-dark","\u002F* dans le CSS *\u002F\n.souligne { text-decoration: underline; }\n.actif    { background-color: yellow; }\n","css",[624,1599,1600,1605,1625],{"__ignoreMap":666},[670,1601,1602],{"class":672,"line":673},[670,1603,1604],{"class":803},"\u002F* dans le CSS *\u002F\n",[670,1606,1607,1610,1613,1616,1619,1622],{"class":672,"line":687},[670,1608,1609],{"class":696},".souligne",[670,1611,1612],{"class":676}," { ",[670,1614,1615],{"class":813},"text-decoration",[670,1617,1618],{"class":676},": ",[670,1620,1621],{"class":813},"underline",[670,1623,1624],{"class":676},"; }\n",[670,1626,1627,1630,1633,1636,1638,1641],{"class":672,"line":714},[670,1628,1629],{"class":696},".actif",[670,1631,1632],{"class":676},"    { ",[670,1634,1635],{"class":813},"background-color",[670,1637,1618],{"class":676},[670,1639,1640],{"class":813},"yellow",[670,1642,1624],{"class":676},[1089,1644,1647,1652],{"correct":1645,"slug":1646},"2","dom-interaction-c2",[1094,1648,1649],{"v-slot:question":666},[598,1650,1651],{},"Quelle méthode bascule une classe CSS on\u002Foff ?",[1094,1653,1654],{"v-slot:choices":666},[1102,1655,1656,1659,1662,1665],{},[1105,1657,1658],{},"classList.swap",[1105,1660,1661],{},"classList.flip",[1105,1663,1664],{},"classList.toggle",[1105,1666,1667],{},"classList.invert",[593,1669,1671],{"id":1670},"créer-et-insérer-un-élément","Créer et insérer un élément",[598,1673,1674],{},"Pour ajouter un nouvel élément à la page :",[661,1676,1678],{"className":794,"code":1677,"language":796,"meta":666,"style":666},"\u002F\u002F 1. Créer\nconst nouveau = document.createElement(\"p\");\n\n\u002F\u002F 2. Le remplir\nnouveau.textContent = \"Paragraphe ajouté par JS.\";\nnouveau.classList.add(\"ajout\");\n\n\u002F\u002F 3. L'insérer dans un parent existant\nconst conteneur = document.getElementById(\"conteneur\");\nconteneur.appendChild(nouveau);\n",[624,1679,1680,1685,1705,1709,1714,1726,1740,1744,1749,1769],{"__ignoreMap":666},[670,1681,1682],{"class":672,"line":673},[670,1683,1684],{"class":803},"\u002F\u002F 1. Créer\n",[670,1686,1687,1689,1692,1694,1696,1699,1701,1703],{"class":672,"line":687},[670,1688,810],{"class":809},[670,1690,1691],{"class":813}," nouveau",[670,1693,817],{"class":809},[670,1695,820],{"class":676},[670,1697,1698],{"class":696},"createElement",[670,1700,826],{"class":676},[670,1702,894],{"class":703},[670,1704,831],{"class":676},[670,1706,1707],{"class":672,"line":714},[670,1708,837],{"emptyLinePlaceholder":836},[670,1710,1711],{"class":672,"line":736},[670,1712,1713],{"class":803},"\u002F\u002F 2. Le remplir\n",[670,1715,1716,1719,1721,1724],{"class":672,"line":845},[670,1717,1718],{"class":676},"nouveau.textContent ",[670,1720,700],{"class":809},[670,1722,1723],{"class":703}," \"Paragraphe ajouté par JS.\"",[670,1725,1190],{"class":676},[670,1727,1728,1731,1733,1735,1738],{"class":672,"line":866},[670,1729,1730],{"class":676},"nouveau.classList.",[670,1732,1540],{"class":696},[670,1734,826],{"class":676},[670,1736,1737],{"class":703},"\"ajout\"",[670,1739,831],{"class":676},[670,1741,1742],{"class":672,"line":871},[670,1743,837],{"emptyLinePlaceholder":836},[670,1745,1746],{"class":672,"line":877},[670,1747,1748],{"class":803},"\u002F\u002F 3. L'insérer dans un parent existant\n",[670,1750,1751,1753,1756,1758,1760,1762,1764,1767],{"class":672,"line":899},[670,1752,810],{"class":809},[670,1754,1755],{"class":813}," conteneur",[670,1757,817],{"class":809},[670,1759,820],{"class":676},[670,1761,823],{"class":696},[670,1763,826],{"class":676},[670,1765,1766],{"class":703},"\"conteneur\"",[670,1768,831],{"class":676},[670,1770,1771,1774,1776],{"class":672,"line":904},[670,1772,1773],{"class":676},"conteneur.",[670,1775,637],{"class":696},[670,1777,1778],{"class":676},"(nouveau);\n",[598,1780,1781],{},"Pour supprimer un élément :",[661,1783,1785],{"className":794,"code":1784,"language":796,"meta":666,"style":666},"nouveau.remove();\n",[624,1786,1787],{"__ignoreMap":666},[670,1788,1789,1792,1794],{"class":672,"line":673},[670,1790,1791],{"class":676},"nouveau.",[670,1793,1554],{"class":696},[670,1795,1796],{"class":676},"();\n",[598,1798,1799,1800,1803,1804,1807],{},"(Avant 2019 il fallait ",[624,1801,1802],{},"parent.removeChild(enfant)"," ; aujourd'hui ",[624,1805,1806],{},".remove()","\nsur l'élément lui-même suffit.)",[593,1809,1811],{"id":1810},"un-exemple-complet-compteur-cliquable","Un exemple complet — compteur cliquable",[598,1813,1814],{},"Mettons bout à bout ce que vous avez vu : sélection, écouteur, modification.",[661,1816,1818],{"className":663,"code":1817,"language":665,"meta":666,"style":666},"\u003Cbutton id=\"bouton\">J'ai été cliqué 0 fois\u003C\u002Fbutton>\n",[624,1819,1820],{"__ignoreMap":666},[670,1821,1822,1824,1827,1829,1831,1834,1837,1839],{"class":672,"line":673},[670,1823,677],{"class":676},[670,1825,1826],{"class":680},"button",[670,1828,697],{"class":696},[670,1830,700],{"class":676},[670,1832,1833],{"class":703},"\"bouton\"",[670,1835,1836],{"class":676},">J'ai été cliqué 0 fois\u003C\u002F",[670,1838,1826],{"class":680},[670,1840,684],{"class":676},[661,1842,1844],{"className":794,"code":1843,"language":796,"meta":666,"style":666},"const bouton = document.getElementById(\"bouton\");\nlet compteur = 0;\n\nbouton.addEventListener(\"click\", function() {\n  compteur += 1;\n  bouton.textContent = `J'ai été cliqué ${compteur} fois`;\n});\n",[624,1845,1846,1865,1880,1884,1905,1918,1936],{"__ignoreMap":666},[670,1847,1848,1850,1853,1855,1857,1859,1861,1863],{"class":672,"line":673},[670,1849,810],{"class":809},[670,1851,1852],{"class":813}," bouton",[670,1854,817],{"class":809},[670,1856,820],{"class":676},[670,1858,823],{"class":696},[670,1860,826],{"class":676},[670,1862,1833],{"class":703},[670,1864,831],{"class":676},[670,1866,1867,1870,1873,1875,1878],{"class":672,"line":687},[670,1868,1869],{"class":809},"let",[670,1871,1872],{"class":676}," compteur ",[670,1874,700],{"class":809},[670,1876,1877],{"class":813}," 0",[670,1879,1190],{"class":676},[670,1881,1882],{"class":672,"line":714},[670,1883,837],{"emptyLinePlaceholder":836},[670,1885,1886,1889,1892,1894,1897,1899,1902],{"class":672,"line":736},[670,1887,1888],{"class":676},"bouton.",[670,1890,1891],{"class":696},"addEventListener",[670,1893,826],{"class":676},[670,1895,1896],{"class":703},"\"click\"",[670,1898,627],{"class":676},[670,1900,1901],{"class":809},"function",[670,1903,1904],{"class":676},"() {\n",[670,1906,1907,1910,1913,1916],{"class":672,"line":845},[670,1908,1909],{"class":676},"  compteur ",[670,1911,1912],{"class":809},"+=",[670,1914,1915],{"class":813}," 1",[670,1917,1190],{"class":676},[670,1919,1920,1923,1925,1928,1931,1934],{"class":672,"line":866},[670,1921,1922],{"class":676},"  bouton.textContent ",[670,1924,700],{"class":809},[670,1926,1927],{"class":703}," `J'ai été cliqué ${",[670,1929,1930],{"class":676},"compteur",[670,1932,1933],{"class":703},"} fois`",[670,1935,1190],{"class":676},[670,1937,1938],{"class":672,"line":871},[670,1939,1940],{"class":676},"});\n",[598,1942,1943,1944,1947,1948,648],{},"Au clic, le compteur s'incrémente et le ",[602,1945,1946],{},"texte du bouton"," est réécrit par\nJS dans le DOM. Aucune requête réseau, aucun rechargement. ",[602,1949,1950],{},"C'est le cœur\nde l'interactivité Web moderne",[593,1952,1954],{"id":1953},"un-exemple-plus-riche-formulaire-dynamique","Un exemple plus riche — formulaire dynamique",[661,1956,1958],{"className":663,"code":1957,"language":665,"meta":666,"style":666},"\u003Cform id=\"form\">\n  \u003Cinput type=\"text\" id=\"nom\" placeholder=\"Votre prénom\" required>\n  \u003Cbutton type=\"submit\">Saluer\u003C\u002Fbutton>\n\u003C\u002Fform>\n\u003Cp id=\"message\">\u003C\u002Fp>\n",[624,1959,1960,1976,2011,2031,2039],{"__ignoreMap":666},[670,1961,1962,1964,1967,1969,1971,1974],{"class":672,"line":673},[670,1963,677],{"class":676},[670,1965,1966],{"class":680},"form",[670,1968,697],{"class":696},[670,1970,700],{"class":676},[670,1972,1973],{"class":703},"\"form\"",[670,1975,684],{"class":676},[670,1977,1978,1980,1983,1986,1988,1991,1993,1995,1998,2001,2003,2006,2009],{"class":672,"line":687},[670,1979,690],{"class":676},[670,1981,1982],{"class":680},"input",[670,1984,1985],{"class":696}," type",[670,1987,700],{"class":676},[670,1989,1990],{"class":703},"\"text\"",[670,1992,697],{"class":696},[670,1994,700],{"class":676},[670,1996,1997],{"class":703},"\"nom\"",[670,1999,2000],{"class":696}," placeholder",[670,2002,700],{"class":676},[670,2004,2005],{"class":703},"\"Votre prénom\"",[670,2007,2008],{"class":696}," required",[670,2010,684],{"class":676},[670,2012,2013,2015,2017,2019,2021,2024,2027,2029],{"class":672,"line":714},[670,2014,690],{"class":676},[670,2016,1826],{"class":680},[670,2018,1985],{"class":696},[670,2020,700],{"class":676},[670,2022,2023],{"class":703},"\"submit\"",[670,2025,2026],{"class":676},">Saluer\u003C\u002F",[670,2028,1826],{"class":680},[670,2030,684],{"class":676},[670,2032,2033,2035,2037],{"class":672,"line":736},[670,2034,739],{"class":676},[670,2036,1966],{"class":680},[670,2038,684],{"class":676},[670,2040,2041,2043,2045,2047,2049,2052,2055,2057],{"class":672,"line":845},[670,2042,677],{"class":676},[670,2044,598],{"class":680},[670,2046,697],{"class":696},[670,2048,700],{"class":676},[670,2050,2051],{"class":703},"\"message\"",[670,2053,2054],{"class":676},">\u003C\u002F",[670,2056,598],{"class":680},[670,2058,684],{"class":676},[661,2060,2062],{"className":794,"code":2061,"language":796,"meta":666,"style":666},"const form = document.getElementById(\"form\");\nconst message = document.getElementById(\"message\");\n\nform.addEventListener(\"submit\", function(event) {\n  event.preventDefault();              \u002F\u002F bloquer la soumission classique\n  const nom = document.getElementById(\"nom\").value;\n  message.textContent = `Bonjour, ${nom} !`;\n  message.style.color = \"navy\";\n});\n",[624,2063,2064,2083,2102,2106,2130,2144,2165,2183,2194],{"__ignoreMap":666},[670,2065,2066,2068,2071,2073,2075,2077,2079,2081],{"class":672,"line":673},[670,2067,810],{"class":809},[670,2069,2070],{"class":813}," form",[670,2072,817],{"class":809},[670,2074,820],{"class":676},[670,2076,823],{"class":696},[670,2078,826],{"class":676},[670,2080,1973],{"class":703},[670,2082,831],{"class":676},[670,2084,2085,2087,2090,2092,2094,2096,2098,2100],{"class":672,"line":687},[670,2086,810],{"class":809},[670,2088,2089],{"class":813}," message",[670,2091,817],{"class":809},[670,2093,820],{"class":676},[670,2095,823],{"class":696},[670,2097,826],{"class":676},[670,2099,2051],{"class":703},[670,2101,831],{"class":676},[670,2103,2104],{"class":672,"line":714},[670,2105,837],{"emptyLinePlaceholder":836},[670,2107,2108,2111,2113,2115,2117,2119,2121,2123,2127],{"class":672,"line":736},[670,2109,2110],{"class":676},"form.",[670,2112,1891],{"class":696},[670,2114,826],{"class":676},[670,2116,2023],{"class":703},[670,2118,627],{"class":676},[670,2120,1901],{"class":809},[670,2122,826],{"class":676},[670,2124,2126],{"class":2125},"sP4rz","event",[670,2128,2129],{"class":676},") {\n",[670,2131,2132,2135,2138,2141],{"class":672,"line":845},[670,2133,2134],{"class":676},"  event.",[670,2136,2137],{"class":696},"preventDefault",[670,2139,2140],{"class":676},"();              ",[670,2142,2143],{"class":803},"\u002F\u002F bloquer la soumission classique\n",[670,2145,2146,2149,2152,2154,2156,2158,2160,2162],{"class":672,"line":866},[670,2147,2148],{"class":809},"  const",[670,2150,2151],{"class":813}," nom",[670,2153,817],{"class":809},[670,2155,820],{"class":676},[670,2157,823],{"class":696},[670,2159,826],{"class":676},[670,2161,1997],{"class":703},[670,2163,2164],{"class":676},").value;\n",[670,2166,2167,2170,2172,2175,2178,2181],{"class":672,"line":871},[670,2168,2169],{"class":676},"  message.textContent ",[670,2171,700],{"class":809},[670,2173,2174],{"class":703}," `Bonjour, ${",[670,2176,2177],{"class":676},"nom",[670,2179,2180],{"class":703},"} !`",[670,2182,1190],{"class":676},[670,2184,2185,2188,2190,2192],{"class":672,"line":877},[670,2186,2187],{"class":676},"  message.style.color ",[670,2189,700],{"class":809},[670,2191,1493],{"class":703},[670,2193,1190],{"class":676},[670,2195,2196],{"class":672,"line":899},[670,2197,1940],{"class":676},[598,2199,2200,2201,2206],{},"Ici, ",[602,2202,2203],{},[624,2204,2205],{},"event.preventDefault()"," empêche le navigateur de soumettre le\nformulaire (et donc de recharger la page), ce qui permet de gérer la saisie\nentièrement en JavaScript.",[1089,2208,2210,2215],{"correct":1645,"slug":2209},"dom-interaction-c3",[1094,2211,2212],{"v-slot:question":666},[598,2213,2214],{},"Quelle propriété d'un input texte permet de lire la valeur saisie en JavaScript ?",[1094,2216,2217],{"v-slot:choices":666},[1102,2218,2219,2221,2224,2227],{},[1105,2220,756],{},[1105,2222,2223],{},"content",[1105,2225,2226],{},"value",[1105,2228,1982],{},[593,2230,2232],{"id":2231},"cas-particuliers-et-pièges","Cas particuliers et pièges",[1102,2234,2235,2260,2277,2285],{},[1105,2236,2237,2242,2243,2246,2247,2249,2250,2252,2253,2255,2256,2259],{},[602,2238,2239,2241],{},[624,2240,1001],{}," non géré"," : ",[624,2244,2245],{},"document.getElementById(\"xyz\")"," peut renvoyer ",[624,2248,1001],{},"\nsi l'id n'existe pas. Tenter d'accéder à ",[624,2251,1223],{}," sur ",[624,2254,1001],{}," provoque\nune erreur. Toujours vérifier ou utiliser ",[624,2257,2258],{},"?."," (optional chaining).",[1105,2261,2262,2265,2266,2269,2270,2273,2274,648],{},[602,2263,2264],{},"Le script s'exécute trop tôt"," : si le script s'exécute avant que le HTML\nsoit chargé, les éléments n'existent pas encore dans le DOM. Utiliser\n",[624,2267,2268],{},"defer"," sur le ",[624,2271,2272],{},"\u003Cscript>"," ou écouter ",[624,2275,2276],{},"DOMContentLoaded",[1105,2278,2279,2284],{},[602,2280,2281,2283],{},[624,2282,857],{}," est vivant"," : la collection se met à jour\ntoute seule quand le DOM change — surprise garantie dans une boucle qui\najoute des éléments.",[1105,2286,2287,2293,2294,2242,2297,627,2300,2303],{},[602,2288,2289,2292],{},[624,2290,2291],{},"style.background-color"," ne marche pas"," : en JavaScript, les propriétés\nCSS sont en ",[624,2295,2296],{},"camelCase",[624,2298,2299],{},"style.backgroundColor",[624,2301,2302],{},"style.fontSize","…",[593,2305,2307],{"id":2306},"pour-aller-plus-loin","Pour aller plus loin",[598,2309,2310,2311,2314,2315,2318],{},"Le pattern ",[602,2312,2313],{},"événement + modification du DOM"," est le moteur de toute page\ninteractive. Les frameworks modernes (Vue, React, Svelte) automatisent ces\nopérations, mais reposent tous, en dessous, sur les mêmes API du DOM. Le cours\nsuivant ouvre l'horizon : comment cette page parle-t-elle au ",[602,2316,2317],{},"serveur"," via\nHTTP ?",[630,2320,2321],{},"html pre.shiki code .sxrX7, html code.shiki .sxrX7{--shiki-light:#24292E;--shiki-default:#24292E;--shiki-dark:#E1E4E8}html pre.shiki code .sovSZ, html code.shiki .sovSZ{--shiki-light:#22863A;--shiki-default:#22863A;--shiki-dark:#85E89D}html pre.shiki code .snPdu, html code.shiki .snPdu{--shiki-light:#6F42C1;--shiki-default:#6F42C1;--shiki-dark:#B392F0}html pre.shiki code .sIIMD, html code.shiki .sIIMD{--shiki-light:#032F62;--shiki-default:#032F62;--shiki-dark:#9ECBFF}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html pre.shiki code .sCsY4, html code.shiki .sCsY4{--shiki-light:#6A737D;--shiki-default:#6A737D;--shiki-dark:#6A737D}html pre.shiki code .s8jYJ, html code.shiki .s8jYJ{--shiki-light:#D73A49;--shiki-default:#D73A49;--shiki-dark:#F97583}html pre.shiki code .sBjJW, html code.shiki .sBjJW{--shiki-light:#005CC5;--shiki-default:#005CC5;--shiki-dark:#79B8FF}html pre.shiki code .sP4rz, html code.shiki .sP4rz{--shiki-light:#E36209;--shiki-default:#E36209;--shiki-dark:#FFAB70}",{"title":666,"searchDepth":687,"depth":687,"links":2323},[2324,2325,2326,2327,2328,2329,2330,2331,2332,2333,2334],{"id":595,"depth":687,"text":596},{"id":651,"depth":687,"text":652},{"id":785,"depth":687,"text":786},{"id":1118,"depth":687,"text":1119},{"id":1264,"depth":687,"text":1265},{"id":1447,"depth":687,"text":1448},{"id":1670,"depth":687,"text":1671},{"id":1810,"depth":687,"text":1811},{"id":1953,"depth":687,"text":1954},{"id":2231,"depth":687,"text":2232},{"id":2306,"depth":687,"text":2307},"Sélectionner, modifier et créer des éléments d'une page Web depuis JavaScript pour la rendre dynamique sans rechargement.",null,"md",{},[2340,2344,2346],{"slug":1092,"kind":2341,"question":1098,"choices":2342,"correct":1091,"multi":2343,"explanation":666},"qcm",[1107,1001,1112,1115],false,{"slug":1646,"kind":2341,"question":1651,"choices":2345,"correct":1645,"multi":2343,"explanation":666},[1658,1661,1664,1667],{"slug":2209,"kind":2341,"question":2214,"choices":2347,"correct":1645,"multi":2343,"explanation":666},[756,2223,2226,1982],{"title":347,"description":2335},"OoUupxdNQexQN1om0IvR95ywWDepinphtSEDIDPBAvs",{"id":2351,"title":2352,"bo":2353,"body":2354,"description":2787,"eval":2336,"extension":2337,"labo":2336,"meta":2788,"navigation":2343,"path":2789,"quizzes":2790,"readingTime":673,"seo":2791,"stem":2792,"tp":2336,"__hash__":2793},"coursMemo\u002F1.nsi-1ere\u002Fpe-ihm-web\u002F4.dom-interaction.memo.md","Manipulation du DOM — l'essentiel",[588],{"type":590,"value":2355,"toc":2777},[2356,2360,2369,2373,2412,2416,2478,2482,2566,2570,2625,2629,2653,2657,2699,2703,2774],[593,2357,2359],{"id":2358},"en-une-phrase","En une phrase",[598,2361,2362],{},[602,2363,2364,2365,2368],{},"Le DOM est l'arbre d'objets que JavaScript manipule pour modifier la page :\non sélectionne un élément (",[624,2366,2367],{},"document.querySelector",") puis on modifie son\ncontenu, ses attributs ou son style.",[593,2370,2372],{"id":2371},"à-mémoriser","À mémoriser",[1102,2374,2375,2380,2387,2396,2402],{},[1105,2376,2377,2378,648],{},"Point d'entrée : ",[624,2379,749],{},[1105,2381,2382,2383,2386],{},"HTML ≠ DOM. Le DOM est l'arbre ",[602,2384,2385],{},"vivant"," en mémoire.",[1105,2388,2389,2390,2392,2393,2395],{},"Sélection privilégiée : ",[624,2391,922],{}," (1er) \u002F ",[624,2394,955],{}," (tous).",[1105,2397,2398,2399,648],{},"Modifier le texte : ",[624,2400,2401],{},"element.textContent = \"…\"",[1105,2403,2404,2405,2408,2409,648],{},"Modifier le style : ",[624,2406,2407],{},"element.classList.add\u002Fremove\u002Ftoggle(\"…\")"," plutôt que\n",[624,2410,2411],{},".style.…",[593,2413,2415],{"id":2414},"sélection-méthodes-principales","Sélection — méthodes principales",[964,2417,2418,2426],{},[967,2419,2420],{},[970,2421,2422,2424],{},[973,2423,975],{},[973,2425,978],{},[983,2427,2428,2439,2448,2456,2468],{},[970,2429,2430,2434],{},[988,2431,2432],{},[624,2433,992],{},[988,2435,2436,2437],{},"L'élément, ou ",[624,2438,1001],{},[970,2440,2441,2445],{},[988,2442,2443],{},[624,2444,1013],{},[988,2446,2447],{},"Collection vivante",[970,2449,2450,2454],{},[988,2451,2452],{},[624,2453,1026],{},[988,2455,2447],{},[970,2457,2458,2463],{},[988,2459,2460],{},[624,2461,2462],{},"querySelector(\".c\")",[988,2464,2465,2466],{},"Premier élément, ou ",[624,2467,1001],{},[970,2469,2470,2475],{},[988,2471,2472],{},[624,2473,2474],{},"querySelectorAll(\"p\")",[988,2476,2477],{},"Liste statique",[593,2479,2481],{"id":2480},"modifier","Modifier",[661,2483,2485],{"className":794,"code":2484,"language":796,"meta":666,"style":666},"el.textContent = \"Bonjour\";          \u002F\u002F texte brut, sûr\nel.innerHTML   = \"\u003Cem>HTML\u003C\u002Fem>\";    \u002F\u002F HTML, attention XSS\nel.setAttribute(\"src\", \"x.jpg\");\nel.style.color = \"red\";              \u002F\u002F camelCase\nel.classList.add(\"actif\");\n",[624,2486,2487,2503,2519,2537,2553],{"__ignoreMap":666},[670,2488,2489,2492,2494,2497,2500],{"class":672,"line":673},[670,2490,2491],{"class":676},"el.textContent ",[670,2493,700],{"class":809},[670,2495,2496],{"class":703}," \"Bonjour\"",[670,2498,2499],{"class":676},";          ",[670,2501,2502],{"class":803},"\u002F\u002F texte brut, sûr\n",[670,2504,2505,2508,2510,2513,2516],{"class":672,"line":687},[670,2506,2507],{"class":676},"el.innerHTML   ",[670,2509,700],{"class":809},[670,2511,2512],{"class":703}," \"\u003Cem>HTML\u003C\u002Fem>\"",[670,2514,2515],{"class":676},";    ",[670,2517,2518],{"class":803},"\u002F\u002F HTML, attention XSS\n",[670,2520,2521,2524,2526,2528,2530,2532,2535],{"class":672,"line":714},[670,2522,2523],{"class":676},"el.",[670,2525,640],{"class":696},[670,2527,826],{"class":676},[670,2529,1319],{"class":703},[670,2531,627],{"class":676},[670,2533,2534],{"class":703},"\"x.jpg\"",[670,2536,831],{"class":676},[670,2538,2539,2542,2544,2547,2550],{"class":672,"line":736},[670,2540,2541],{"class":676},"el.style.color ",[670,2543,700],{"class":809},[670,2545,2546],{"class":703}," \"red\"",[670,2548,2549],{"class":676},";              ",[670,2551,2552],{"class":803},"\u002F\u002F camelCase\n",[670,2554,2555,2558,2560,2562,2564],{"class":672,"line":845},[670,2556,2557],{"class":676},"el.classList.",[670,2559,1540],{"class":696},[670,2561,826],{"class":676},[670,2563,1573],{"class":703},[670,2565,831],{"class":676},[593,2567,2569],{"id":2568},"créer-et-insérer","Créer et insérer",[661,2571,2573],{"className":794,"code":2572,"language":796,"meta":666,"style":666},"const p = document.createElement(\"p\");\np.textContent = \"Hello\";\nparent.appendChild(p);\np.remove();\n",[624,2574,2575,2594,2606,2616],{"__ignoreMap":666},[670,2576,2577,2579,2582,2584,2586,2588,2590,2592],{"class":672,"line":673},[670,2578,810],{"class":809},[670,2580,2581],{"class":813}," p",[670,2583,817],{"class":809},[670,2585,820],{"class":676},[670,2587,1698],{"class":696},[670,2589,826],{"class":676},[670,2591,894],{"class":703},[670,2593,831],{"class":676},[670,2595,2596,2599,2601,2604],{"class":672,"line":687},[670,2597,2598],{"class":676},"p.textContent ",[670,2600,700],{"class":809},[670,2602,2603],{"class":703}," \"Hello\"",[670,2605,1190],{"class":676},[670,2607,2608,2611,2613],{"class":672,"line":714},[670,2609,2610],{"class":676},"parent.",[670,2612,637],{"class":696},[670,2614,2615],{"class":676},"(p);\n",[670,2617,2618,2621,2623],{"class":672,"line":736},[670,2619,2620],{"class":676},"p.",[670,2622,1554],{"class":696},[670,2624,1796],{"class":676},[593,2626,2628],{"id":2627},"lire-la-valeur-dun-champ","Lire la valeur d'un champ",[661,2630,2632],{"className":794,"code":2631,"language":796,"meta":666,"style":666},"const valeur = document.getElementById(\"nom\").value;\n",[624,2633,2634],{"__ignoreMap":666},[670,2635,2636,2638,2641,2643,2645,2647,2649,2651],{"class":672,"line":673},[670,2637,810],{"class":809},[670,2639,2640],{"class":813}," valeur",[670,2642,817],{"class":809},[670,2644,820],{"class":676},[670,2646,823],{"class":696},[670,2648,826],{"class":676},[670,2650,1997],{"class":703},[670,2652,2164],{"class":676},[593,2654,2656],{"id":2655},"pièges-courants","Pièges courants",[1102,2658,2659,2668,2679,2691],{},[1105,2660,2661,2246,2663,2667],{},[624,2662,823],{},[602,2664,2665],{},[624,2666,1001],{}," — vérifier.",[1105,2669,2670,2673,2674,2676,2677,648],{},[624,2671,2672],{},"innerHTML"," + saisie utilisateur = faille ",[602,2675,1253],{},". Préférer ",[624,2678,626],{},[1105,2680,2681,2682,1254,2684,2687,2688,2690],{},"Propriétés CSS en JS : ",[602,2683,2296],{},[624,2685,2686],{},"backgroundColor",", pas\n",[624,2689,1635],{},").",[1105,2692,2693,2694,2696,2697,648],{},"Script qui s'exécute avant le HTML : utiliser ",[624,2695,2268],{}," ou\n",[624,2698,2276],{},[593,2700,2702],{"id":2701},"syntaxe-js-de-référence","Syntaxe JS de référence",[661,2704,2706],{"className":794,"code":2705,"language":796,"meta":666,"style":666},"const btn = document.querySelector(\"#bouton\");\nbtn.addEventListener(\"click\", function() {\n  btn.textContent = \"Cliqué !\";\n  btn.classList.add(\"actif\");\n});\n",[624,2707,2708,2728,2745,2757,2770],{"__ignoreMap":666},[670,2709,2710,2712,2715,2717,2719,2721,2723,2726],{"class":672,"line":673},[670,2711,810],{"class":809},[670,2713,2714],{"class":813}," btn",[670,2716,817],{"class":809},[670,2718,820],{"class":676},[670,2720,922],{"class":696},[670,2722,826],{"class":676},[670,2724,2725],{"class":703},"\"#bouton\"",[670,2727,831],{"class":676},[670,2729,2730,2733,2735,2737,2739,2741,2743],{"class":672,"line":687},[670,2731,2732],{"class":676},"btn.",[670,2734,1891],{"class":696},[670,2736,826],{"class":676},[670,2738,1896],{"class":703},[670,2740,627],{"class":676},[670,2742,1901],{"class":809},[670,2744,1904],{"class":676},[670,2746,2747,2750,2752,2755],{"class":672,"line":714},[670,2748,2749],{"class":676},"  btn.textContent ",[670,2751,700],{"class":809},[670,2753,2754],{"class":703}," \"Cliqué !\"",[670,2756,1190],{"class":676},[670,2758,2759,2762,2764,2766,2768],{"class":672,"line":736},[670,2760,2761],{"class":676},"  btn.classList.",[670,2763,1540],{"class":696},[670,2765,826],{"class":676},[670,2767,1573],{"class":703},[670,2769,831],{"class":676},[670,2771,2772],{"class":672,"line":845},[670,2773,1940],{"class":676},[630,2775,2776],{},"html pre.shiki code .sxrX7, html code.shiki .sxrX7{--shiki-light:#24292E;--shiki-default:#24292E;--shiki-dark:#E1E4E8}html pre.shiki code .s8jYJ, html code.shiki .s8jYJ{--shiki-light:#D73A49;--shiki-default:#D73A49;--shiki-dark:#F97583}html pre.shiki code .sIIMD, html code.shiki .sIIMD{--shiki-light:#032F62;--shiki-default:#032F62;--shiki-dark:#9ECBFF}html pre.shiki code .sCsY4, html code.shiki .sCsY4{--shiki-light:#6A737D;--shiki-default:#6A737D;--shiki-dark:#6A737D}html pre.shiki code .snPdu, html code.shiki .snPdu{--shiki-light:#6F42C1;--shiki-default:#6F42C1;--shiki-dark:#B392F0}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html pre.shiki code .sBjJW, html code.shiki .sBjJW{--shiki-light:#005CC5;--shiki-default:#005CC5;--shiki-dark:#79B8FF}",{"title":666,"searchDepth":687,"depth":687,"links":2778},[2779,2780,2781,2782,2783,2784,2785,2786],{"id":2358,"depth":687,"text":2359},{"id":2371,"depth":687,"text":2372},{"id":2414,"depth":687,"text":2415},{"id":2480,"depth":687,"text":2481},{"id":2568,"depth":687,"text":2569},{"id":2627,"depth":687,"text":2628},{"id":2655,"depth":687,"text":2656},{"id":2701,"depth":687,"text":2702},"Mémo de révision sur la sélection et la modification d'éléments via le DOM.",{},"\u002Fnsi-1ere\u002Fpe-ihm-web\u002Fdom-interaction.memo",[],{"title":2352,"description":2787},"1.nsi-1ere\u002Fpe-ihm-web\u002F4.dom-interaction.memo","6v33C6_IXdSrdAsLEA1yW6JIsarffiVCmWH0H2a5xNA",{"id":2795,"title":2796,"body":2797,"description":3374,"extension":2337,"meta":3375,"navigation":2343,"path":3376,"seo":3377,"stem":3378,"__hash__":3379},"coursSlides\u002F1.nsi-1ere\u002Fpe-ihm-web\u002F4.dom-interaction.slides.md","Manipulation du DOM — diapositives",{"type":590,"value":2798,"toc":3372},[2799,2802,2809,2812,2814,2821,2830,2832,2836,2878,2886,2888,2892,2919,2927,2929,2933,2976,2978,2980,3045,3047,3049,3103,3105,3109,3134,3224,3226,3230,3316,3318,3322,3357,3359,3363,3369],[693,2800,347],{"id":2801},"manipulation-du-dom",[598,2803,2804,2805,2808],{},"Modifier la page ",[602,2806,2807],{},"depuis JavaScript",", sans rechargement.",[2810,2811],"hr",{},[693,2813,652],{"id":651},[2815,2816],"illustration",{"alt":2817,"kind":2818,"src":2819,"svg":2820},"Arbre DOM : document en racine, puis html, head et body, puis h1 et p sous body","mermaid","\u002Fillustrations\u002F1.nsi-1ere\u002Fpe-ihm-web\u002Fdom-arbre.svg","\u003Csvg id=\"ill-1-nsi-1ere-pe-ihm-web-dom-arbre\" xmlns=\"http:\u002F\u002Fwww.w3.org\u002F2000\u002Fsvg\" xmlns:xlink=\"http:\u002F\u002Fwww.w3.org\u002F1999\u002Fxlink\" class=\"illustration-svg flowchart\" viewBox=\"0 0 307.29296875 396\" role=\"graphics-document document\" aria-roledescription=\"flowchart-v2\">\u003Cstyle>#ill-1-nsi-1ere-pe-ihm-web-dom-arbre{font-family:Geist,Inter,system-ui,-apple-system,sans-serif;font-size:14px;fill:var(--diagram-text);}@keyframes edge-animation-frame{from{stroke-dashoffset:0;}}@keyframes dash{to{stroke-dashoffset:0;}}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .edge-animation-slow{stroke-dasharray:9,5!important;stroke-dashoffset:900;animation:dash 50s linear infinite;stroke-linecap:round;}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .edge-animation-fast{stroke-dasharray:9,5!important;stroke-dashoffset:900;animation:dash 20s linear infinite;stroke-linecap:round;}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .error-icon{fill:#fdecec;}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .error-text{fill:var(--diagram-text);stroke:var(--diagram-text);}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .edge-thickness-normal{stroke-width:1px;}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .edge-thickness-thick{stroke-width:3.5px;}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .edge-pattern-solid{stroke-dasharray:0;}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .edge-thickness-invisible{stroke-width:0;fill:none;}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .edge-pattern-dashed{stroke-dasharray:3;}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .edge-pattern-dotted{stroke-dasharray:2;}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .marker{fill:var(--diagram-line);stroke:var(--diagram-line);}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .marker.cross{stroke:var(--diagram-line);}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre svg{font-family:Geist,Inter,system-ui,-apple-system,sans-serif;font-size:14px;}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre p{margin:0;}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .label{font-family:Geist,Inter,system-ui,-apple-system,sans-serif;color:var(--diagram-text);}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .cluster-label text{fill:var(--diagram-line);}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .cluster-label span{color:var(--diagram-line);}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .cluster-label span p{background-color:transparent;}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .label text,#ill-1-nsi-1ere-pe-ihm-web-dom-arbre span{fill:var(--diagram-text);color:var(--diagram-text);}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .node rect,#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .node circle,#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .node ellipse,#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .node polygon,#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .node path{fill:var(--diagram-node-bg);stroke:var(--diagram-node-border);stroke-width:1px;}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .rough-node .label text,#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .node .label text,#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .image-shape .label,#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .icon-shape .label{text-anchor:middle;}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .node .katex path{fill:#000;stroke:#000;stroke-width:1px;}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .rough-node .label,#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .node .label,#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .image-shape .label,#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .icon-shape .label{text-align:center;}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .node.clickable{cursor:pointer;}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .root .anchor path{fill:var(--diagram-line)!important;stroke-width:0;stroke:var(--diagram-line);}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .arrowheadPath{fill:rgba(255, 255, 255, 0);}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .edgePath .path{stroke:var(--diagram-line);stroke-width:1px;}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .flowchart-link{stroke:var(--diagram-line);fill:none;}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .edgeLabel{background-color:var(--diagram-surface);text-align:center;}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .edgeLabel p{background-color:var(--diagram-surface);}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .edgeLabel rect{opacity:0.5;background-color:var(--diagram-surface);fill:var(--diagram-surface);}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .labelBkg{background-color:rgba(250, 251, 252, 0.5);}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .cluster rect{fill:var(--diagram-surface);stroke:var(--diagram-border);stroke-width:1px;}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .cluster text{fill:var(--diagram-line);}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .cluster span{color:var(--diagram-line);}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre div.mermaidTooltip{position:absolute;text-align:center;max-width:200px;padding:2px;font-family:Geist,Inter,system-ui,-apple-system,sans-serif;font-size:12px;background:var(--diagram-surface);border:1px solid var(--diagram-border);border-radius:2px;pointer-events:none;z-index:100;}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .flowchartTitleText{text-anchor:middle;font-size:18px;fill:var(--diagram-text);}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre rect.text{fill:none;stroke-width:0;}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .icon-shape,#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .image-shape{background-color:var(--diagram-surface);text-align:center;}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .icon-shape p,#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .image-shape p{background-color:var(--diagram-surface);padding:2px;}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .icon-shape .label rect,#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .image-shape .label rect{opacity:0.5;background-color:var(--diagram-surface);fill:var(--diagram-surface);}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .label-icon{display:inline-block;height:1em;overflow:visible;vertical-align:-0.125em;}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .node .label-icon path{fill:currentColor;stroke:revert;stroke-width:revert;}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .node .neo-node{stroke:var(--diagram-node-border);}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [data-look=\"neo\"].node rect,#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [data-look=\"neo\"].cluster rect,#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [data-look=\"neo\"].node polygon{stroke:url(#ill-1-nsi-1ere-pe-ihm-web-dom-arbre-gradient);filter:drop-shadow( 1px 2px 2px rgba(185,185,185,1));}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [data-look=\"neo\"].node path{stroke:url(#ill-1-nsi-1ere-pe-ihm-web-dom-arbre-gradient);stroke-width:1px;}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [data-look=\"neo\"].node .outer-path{filter:drop-shadow( 1px 2px 2px rgba(185,185,185,1));}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [data-look=\"neo\"].node .neo-line path{stroke:var(--diagram-node-border);filter:none;}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [data-look=\"neo\"].node circle{stroke:url(#ill-1-nsi-1ere-pe-ihm-web-dom-arbre-gradient);filter:drop-shadow( 1px 2px 2px rgba(185,185,185,1));}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [data-look=\"neo\"].node circle .state-start{fill:var(--diagram-text);}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [data-look=\"neo\"].icon-shape .icon{fill:url(#ill-1-nsi-1ere-pe-ihm-web-dom-arbre-gradient);filter:drop-shadow( 1px 2px 2px rgba(185,185,185,1));}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [data-look=\"neo\"].icon-shape .icon-neo path{stroke:url(#ill-1-nsi-1ere-pe-ihm-web-dom-arbre-gradient);filter:drop-shadow( 1px 2px 2px rgba(185,185,185,1));}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .node rect,#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .node circle,#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .node ellipse,#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .node polygon,#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .node path{stroke-width:1.5px;}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .edgePath .path{stroke-width:1.5px;}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .label,#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .nodeLabel,#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .edgeLabel,#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .cluster-label,#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .messageText,#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .actor text{font-family:Geist,Inter,system-ui,sans-serif!important;font-weight:500!important;}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .nodeLabel,#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .cluster-label,#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .nodeLabel p,#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .cluster-label p{color:var(--diagram-text)!important;}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .nodeLabel .markdown-node-label,#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .nodeLabel .markdown-node-label p{color:var(--diagram-text)!important;}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .stateLabel text,#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .stateLabel{fill:var(--diagram-text)!important;font-weight:600!important;}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .edgeLabel{padding:0px 6px;background-color:var(--diagram-surface)!important;}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .edgeLabel rect.background,#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .edgeLabel rect{fill:var(--diagram-surface)!important;opacity:1!important;}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .edgeLabel .label text,#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .edgeLabel text{fill:var(--diagram-line)!important;}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .cluster rect{rx:4px;ry:4px;stroke-width:1px!important;stroke-dasharray:3,3!important;fill:transparent!important;}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .node rect,#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .node polygon,#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .stateGroup rect{rx:4px;ry:4px;}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre marker,#ill-1-nsi-1ere-pe-ihm-web-dom-arbre marker path{fill:var(--diagram-line)!important;stroke:var(--diagram-line)!important;}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .marker{fill:var(--diagram-line)!important;stroke:var(--diagram-line)!important;}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .actor{stroke-width:1.5px;}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .messageText,#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .messageText tspan{fill:var(--diagram-text)!important;}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .titleText{fill:var(--diagram-text)!important;font-weight:600!important;}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .note text,#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .note .nodeLabel{fill:var(--diagram-line)!important;color:var(--diagram-line)!important;}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .statediagram-cluster rect{fill:transparent!important;}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre .statediagram-state .divider{stroke:var(--diagram-border)!important;}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre :root{--mermaid-font-family:Geist,Inter,system-ui,-apple-system,sans-serif;}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [fill=\"#eef0fc\"]{fill:var(--diagram-node-bg)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [stroke=\"#eef0fc\"]{stroke:var(--diagram-node-bg)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [stop-color=\"#eef0fc\"]{stop-color:var(--diagram-node-bg)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [fill=\"rgb(238, 240, 252)\"]{fill:var(--diagram-node-bg)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [stroke=\"rgb(238, 240, 252)\"]{stroke:var(--diagram-node-bg)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [stop-color=\"rgb(238, 240, 252)\"]{stop-color:var(--diagram-node-bg)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [fill=\"#4948b8\"]{fill:var(--diagram-node-border)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [stroke=\"#4948b8\"]{stroke:var(--diagram-node-border)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [stop-color=\"#4948b8\"]{stop-color:var(--diagram-node-border)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [fill=\"rgb(73, 72, 184)\"]{fill:var(--diagram-node-border)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [stroke=\"rgb(73, 72, 184)\"]{stroke:var(--diagram-node-border)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [stop-color=\"rgb(73, 72, 184)\"]{stop-color:var(--diagram-node-border)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [fill=\"#c8cdf5\"]{fill:var(--diagram-accent-soft)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [stroke=\"#c8cdf5\"]{stroke:var(--diagram-accent-soft)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [stop-color=\"#c8cdf5\"]{stop-color:var(--diagram-accent-soft)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [fill=\"rgb(200, 205, 245)\"]{fill:var(--diagram-accent-soft)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [stroke=\"rgb(200, 205, 245)\"]{stroke:var(--diagram-accent-soft)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [stop-color=\"rgb(200, 205, 245)\"]{stop-color:var(--diagram-accent-soft)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [fill=\"#1f2127\"]{fill:var(--diagram-text)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [stroke=\"#1f2127\"]{stroke:var(--diagram-text)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [stop-color=\"#1f2127\"]{stop-color:var(--diagram-text)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [fill=\"rgb(31, 33, 39)\"]{fill:var(--diagram-text)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [stroke=\"rgb(31, 33, 39)\"]{stroke:var(--diagram-text)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [stop-color=\"rgb(31, 33, 39)\"]{stop-color:var(--diagram-text)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [fill=\"#000000\"]{fill:var(--diagram-text)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [stroke=\"#000000\"]{stroke:var(--diagram-text)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [stop-color=\"#000000\"]{stop-color:var(--diagram-text)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [fill=\"rgb(0, 0, 0)\"]{fill:var(--diagram-text)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [stroke=\"rgb(0, 0, 0)\"]{stroke:var(--diagram-text)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [stop-color=\"rgb(0, 0, 0)\"]{stop-color:var(--diagram-text)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [fill=\"#56595e\"]{fill:var(--diagram-line)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [stroke=\"#56595e\"]{stroke:var(--diagram-line)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [stop-color=\"#56595e\"]{stop-color:var(--diagram-line)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [fill=\"rgb(86, 89, 94)\"]{fill:var(--diagram-line)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [stroke=\"rgb(86, 89, 94)\"]{stroke:var(--diagram-line)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [stop-color=\"rgb(86, 89, 94)\"]{stop-color:var(--diagram-line)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [fill=\"#fafbfc\"]{fill:var(--diagram-surface)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [stroke=\"#fafbfc\"]{stroke:var(--diagram-surface)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [stop-color=\"#fafbfc\"]{stop-color:var(--diagram-surface)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [fill=\"rgb(250, 251, 252)\"]{fill:var(--diagram-surface)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [stroke=\"rgb(250, 251, 252)\"]{stroke:var(--diagram-surface)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [stop-color=\"rgb(250, 251, 252)\"]{stop-color:var(--diagram-surface)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [fill=\"#f3f4f6\"]{fill:var(--diagram-surface-alt)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [stroke=\"#f3f4f6\"]{stroke:var(--diagram-surface-alt)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [stop-color=\"#f3f4f6\"]{stop-color:var(--diagram-surface-alt)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [fill=\"rgb(243, 244, 246)\"]{fill:var(--diagram-surface-alt)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [stroke=\"rgb(243, 244, 246)\"]{stroke:var(--diagram-surface-alt)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [stop-color=\"rgb(243, 244, 246)\"]{stop-color:var(--diagram-surface-alt)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [fill=\"#c4c8cd\"]{fill:var(--diagram-border)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [stroke=\"#c4c8cd\"]{stroke:var(--diagram-border)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [stop-color=\"#c4c8cd\"]{stop-color:var(--diagram-border)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [fill=\"rgb(196, 200, 205)\"]{fill:var(--diagram-border)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [stroke=\"rgb(196, 200, 205)\"]{stroke:var(--diagram-border)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [stop-color=\"rgb(196, 200, 205)\"]{stop-color:var(--diagram-border)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [fill=\"#e5e7eb\"]{fill:var(--diagram-border)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [stroke=\"#e5e7eb\"]{stroke:var(--diagram-border)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [stop-color=\"#e5e7eb\"]{stop-color:var(--diagram-border)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [fill=\"rgb(229, 231, 235)\"]{fill:var(--diagram-border)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [stroke=\"rgb(229, 231, 235)\"]{stroke:var(--diagram-border)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [stop-color=\"rgb(229, 231, 235)\"]{stop-color:var(--diagram-border)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [fill=\"#e0e0e0\"]{fill:var(--diagram-border)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [stroke=\"#e0e0e0\"]{stroke:var(--diagram-border)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [stop-color=\"#e0e0e0\"]{stop-color:var(--diagram-border)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [fill=\"rgb(224, 224, 224)\"]{fill:var(--diagram-border)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [stroke=\"rgb(224, 224, 224)\"]{stroke:var(--diagram-border)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [stop-color=\"rgb(224, 224, 224)\"]{stop-color:var(--diagram-border)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [fill=\"#EDF2AE\"]{fill:var(--diagram-surface)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [stroke=\"#EDF2AE\"]{stroke:var(--diagram-surface)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [stop-color=\"#EDF2AE\"]{stop-color:var(--diagram-surface)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [fill=\"rgb(237, 242, 174)\"]{fill:var(--diagram-surface)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [stroke=\"rgb(237, 242, 174)\"]{stroke:var(--diagram-surface)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [stop-color=\"rgb(237, 242, 174)\"]{stop-color:var(--diagram-surface)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [fill=\"#fff5ad\"]{fill:var(--diagram-surface)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [stroke=\"#fff5ad\"]{stroke:var(--diagram-surface)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [stop-color=\"#fff5ad\"]{stop-color:var(--diagram-surface)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [fill=\"rgb(255, 245, 173)\"]{fill:var(--diagram-surface)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [stroke=\"rgb(255, 245, 173)\"]{stroke:var(--diagram-surface)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [stop-color=\"rgb(255, 245, 173)\"]{stop-color:var(--diagram-surface)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [fill=\"#666\"]{fill:var(--diagram-border)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [stroke=\"#666\"]{stroke:var(--diagram-border)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [stop-color=\"#666\"]{stop-color:var(--diagram-border)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [fill=\"rgb(0, 6, 102)\"]{fill:var(--diagram-border)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [stroke=\"rgb(0, 6, 102)\"]{stroke:var(--diagram-border)}#ill-1-nsi-1ere-pe-ihm-web-dom-arbre [stop-color=\"rgb(0, 6, 102)\"]{stop-color:var(--diagram-border)}\u003C\u002Fstyle>\u003Cg>\u003Cmarker id=\"ill-1-nsi-1ere-pe-ihm-web-dom-arbre_flowchart-v2-pointEnd\" class=\"marker flowchart-v2\" viewBox=\"0 0 10 10\" refX=\"5\" refY=\"5\" markerUnits=\"userSpaceOnUse\" markerWidth=\"8\" markerHeight=\"8\" orient=\"auto\">\u003Cpath d=\"M 0 0 L 10 5 L 0 10 z\" class=\"arrowMarkerPath\" style=\"stroke-width: 1; stroke-dasharray: 1, 0;\"\u002F>\u003C\u002Fmarker>\u003Cmarker id=\"ill-1-nsi-1ere-pe-ihm-web-dom-arbre_flowchart-v2-pointStart\" class=\"marker flowchart-v2\" viewBox=\"0 0 10 10\" refX=\"4.5\" refY=\"5\" markerUnits=\"userSpaceOnUse\" markerWidth=\"8\" markerHeight=\"8\" orient=\"auto\">\u003Cpath d=\"M 0 5 L 10 10 L 10 0 z\" class=\"arrowMarkerPath\" style=\"stroke-width: 1; stroke-dasharray: 1, 0;\"\u002F>\u003C\u002Fmarker>\u003Cmarker id=\"ill-1-nsi-1ere-pe-ihm-web-dom-arbre_flowchart-v2-pointEnd-margin\" class=\"marker flowchart-v2\" viewBox=\"0 0 11.5 14\" refX=\"11.5\" refY=\"7\" markerUnits=\"userSpaceOnUse\" markerWidth=\"10.5\" markerHeight=\"14\" orient=\"auto\">\u003Cpath d=\"M 0 0 L 11.5 7 L 0 14 z\" class=\"arrowMarkerPath\" style=\"stroke-width: 0; stroke-dasharray: 1, 0;\"\u002F>\u003C\u002Fmarker>\u003Cmarker id=\"ill-1-nsi-1ere-pe-ihm-web-dom-arbre_flowchart-v2-pointStart-margin\" class=\"marker flowchart-v2\" viewBox=\"0 0 11.5 14\" refX=\"1\" refY=\"7\" markerUnits=\"userSpaceOnUse\" markerWidth=\"11.5\" markerHeight=\"14\" orient=\"auto\">\u003Cpolygon points=\"0,7 11.5,14 11.5,0\" class=\"arrowMarkerPath\" style=\"stroke-width: 0; stroke-dasharray: 1, 0;\"\u002F>\u003C\u002Fmarker>\u003Cmarker id=\"ill-1-nsi-1ere-pe-ihm-web-dom-arbre_flowchart-v2-circleEnd\" class=\"marker flowchart-v2\" viewBox=\"0 0 10 10\" refX=\"11\" refY=\"5\" markerUnits=\"userSpaceOnUse\" markerWidth=\"11\" markerHeight=\"11\" orient=\"auto\">\u003Ccircle cx=\"5\" cy=\"5\" r=\"5\" class=\"arrowMarkerPath\" style=\"stroke-width: 1; stroke-dasharray: 1, 0;\"\u002F>\u003C\u002Fmarker>\u003Cmarker id=\"ill-1-nsi-1ere-pe-ihm-web-dom-arbre_flowchart-v2-circleStart\" class=\"marker flowchart-v2\" viewBox=\"0 0 10 10\" refX=\"-1\" refY=\"5\" markerUnits=\"userSpaceOnUse\" markerWidth=\"11\" markerHeight=\"11\" orient=\"auto\">\u003Ccircle cx=\"5\" cy=\"5\" r=\"5\" class=\"arrowMarkerPath\" style=\"stroke-width: 1; stroke-dasharray: 1, 0;\"\u002F>\u003C\u002Fmarker>\u003Cmarker id=\"ill-1-nsi-1ere-pe-ihm-web-dom-arbre_flowchart-v2-circleEnd-margin\" class=\"marker flowchart-v2\" viewBox=\"0 0 10 10\" refY=\"5\" refX=\"12.25\" markerUnits=\"userSpaceOnUse\" markerWidth=\"14\" markerHeight=\"14\" orient=\"auto\">\u003Ccircle cx=\"5\" cy=\"5\" r=\"5\" class=\"arrowMarkerPath\" style=\"stroke-width: 0; stroke-dasharray: 1, 0;\"\u002F>\u003C\u002Fmarker>\u003Cmarker id=\"ill-1-nsi-1ere-pe-ihm-web-dom-arbre_flowchart-v2-circleStart-margin\" class=\"marker flowchart-v2\" viewBox=\"0 0 10 10\" refX=\"-2\" refY=\"5\" markerUnits=\"userSpaceOnUse\" markerWidth=\"14\" markerHeight=\"14\" orient=\"auto\">\u003Ccircle cx=\"5\" cy=\"5\" r=\"5\" class=\"arrowMarkerPath\" style=\"stroke-width: 0; stroke-dasharray: 1, 0;\"\u002F>\u003C\u002Fmarker>\u003Cmarker id=\"ill-1-nsi-1ere-pe-ihm-web-dom-arbre_flowchart-v2-crossEnd\" class=\"marker cross flowchart-v2\" viewBox=\"0 0 11 11\" refX=\"12\" refY=\"5.2\" markerUnits=\"userSpaceOnUse\" markerWidth=\"11\" markerHeight=\"11\" orient=\"auto\">\u003Cpath d=\"M 1,1 l 9,9 M 10,1 l -9,9\" class=\"arrowMarkerPath\" style=\"stroke-width: 2; stroke-dasharray: 1, 0;\"\u002F>\u003C\u002Fmarker>\u003Cmarker id=\"ill-1-nsi-1ere-pe-ihm-web-dom-arbre_flowchart-v2-crossStart\" class=\"marker cross flowchart-v2\" viewBox=\"0 0 11 11\" refX=\"-1\" refY=\"5.2\" markerUnits=\"userSpaceOnUse\" markerWidth=\"11\" markerHeight=\"11\" orient=\"auto\">\u003Cpath d=\"M 1,1 l 9,9 M 10,1 l -9,9\" class=\"arrowMarkerPath\" style=\"stroke-width: 2; stroke-dasharray: 1, 0;\"\u002F>\u003C\u002Fmarker>\u003Cmarker id=\"ill-1-nsi-1ere-pe-ihm-web-dom-arbre_flowchart-v2-crossEnd-margin\" class=\"marker cross flowchart-v2\" viewBox=\"0 0 15 15\" refX=\"17.7\" refY=\"7.5\" markerUnits=\"userSpaceOnUse\" markerWidth=\"12\" markerHeight=\"12\" orient=\"auto\">\u003Cpath d=\"M 1,1 L 14,14 M 1,14 L 14,1\" class=\"arrowMarkerPath\" style=\"stroke-width: 2.5;\"\u002F>\u003C\u002Fmarker>\u003Cmarker id=\"ill-1-nsi-1ere-pe-ihm-web-dom-arbre_flowchart-v2-crossStart-margin\" class=\"marker cross flowchart-v2\" viewBox=\"0 0 15 15\" refX=\"-3.5\" refY=\"7.5\" markerUnits=\"userSpaceOnUse\" markerWidth=\"12\" markerHeight=\"12\" orient=\"auto\">\u003Cpath d=\"M 1,1 L 14,14 M 1,14 L 14,1\" class=\"arrowMarkerPath\" style=\"stroke-width: 2.5; stroke-dasharray: 1, 0;\"\u002F>\u003C\u002Fmarker>\u003Cg class=\"root\">\u003Cg class=\"clusters\"\u002F>\u003Cg class=\"edgePaths\">\u003Cpath d=\"M128.793,61L128.793,65.667C128.793,70.333,128.793,79.667,128.793,88.333C128.793,97,128.793,105,128.793,109L128.793,113\" id=\"ill-1-nsi-1ere-pe-ihm-web-dom-arbre-L_doc_html_0\" class=\"edge-thickness-normal edge-pattern-solid edge-thickness-normal edge-pattern-solid flowchart-link\" style=\";\" data-edge=\"true\" data-et=\"edge\" data-id=\"L_doc_html_0\" data-points=\"W3sieCI6MTI4Ljc5Mjk2ODc1LCJ5Ijo2MX0seyJ4IjoxMjguNzkyOTY4NzUsInkiOjg5fSx7IngiOjEyOC43OTI5Njg3NSwieSI6MTE3fV0=\" data-look=\"classic\" marker-end=\"url(#ill-1-nsi-1ere-pe-ihm-web-dom-arbre_flowchart-v2-pointEnd)\"\u002F>\u003Cpath d=\"M93.558,170L87.353,174.667C81.148,179.333,68.738,188.667,62.533,197.333C56.328,206,56.328,214,56.328,218L56.328,222\" id=\"ill-1-nsi-1ere-pe-ihm-web-dom-arbre-L_html_head_0\" class=\"edge-thickness-normal edge-pattern-solid edge-thickness-normal edge-pattern-solid flowchart-link\" style=\";\" data-edge=\"true\" data-et=\"edge\" data-id=\"L_html_head_0\" data-points=\"W3sieCI6OTMuNTU3NzY5NDk1NDEyODQsInkiOjE3MH0seyJ4Ijo1Ni4zMjgxMjUsInkiOjE5OH0seyJ4Ijo1Ni4zMjgxMjUsInkiOjIyNn1d\" data-look=\"classic\" marker-end=\"url(#ill-1-nsi-1ere-pe-ihm-web-dom-arbre_flowchart-v2-pointEnd)\"\u002F>\u003Cpath d=\"M164.028,170L170.233,174.667C176.438,179.333,188.848,188.667,195.053,197.333C201.258,206,201.258,214,201.258,218L201.258,222\" id=\"ill-1-nsi-1ere-pe-ihm-web-dom-arbre-L_html_body_0\" class=\"edge-thickness-normal edge-pattern-solid edge-thickness-normal edge-pattern-solid flowchart-link\" style=\";\" data-edge=\"true\" data-et=\"edge\" data-id=\"L_html_body_0\" data-points=\"W3sieCI6MTY0LjAyODE2ODAwNDU4NzE0LCJ5IjoxNzB9LHsieCI6MjAxLjI1NzgxMjUsInkiOjE5OH0seyJ4IjoyMDEuMjU3ODEyNSwieSI6MjI2fV0=\" data-look=\"classic\" marker-end=\"url(#ill-1-nsi-1ere-pe-ihm-web-dom-arbre_flowchart-v2-pointEnd)\"\u002F>\u003Cpath d=\"M171.234,279L165.947,283.667C160.66,288.333,150.086,297.667,144.799,306.333C139.512,315,139.512,323,139.512,327L139.512,331\" id=\"ill-1-nsi-1ere-pe-ihm-web-dom-arbre-L_body_h1_0\" class=\"edge-thickness-normal edge-pattern-solid edge-thickness-normal edge-pattern-solid flowchart-link\" style=\";\" data-edge=\"true\" data-et=\"edge\" data-id=\"L_body_h1_0\" data-points=\"W3sieCI6MTcxLjIzNDQ4MjUxMTQ2NzksInkiOjI3OX0seyJ4IjoxMzkuNTExNzE4NzUsInkiOjMwN30seyJ4IjoxMzkuNTExNzE4NzUsInkiOjMzNX1d\" data-look=\"classic\" marker-end=\"url(#ill-1-nsi-1ere-pe-ihm-web-dom-arbre_flowchart-v2-pointEnd)\"\u002F>\u003Cpath d=\"M231.281,279L236.568,283.667C241.855,288.333,252.43,297.667,257.717,306.333C263.004,315,263.004,323,263.004,327L263.004,331\" id=\"ill-1-nsi-1ere-pe-ihm-web-dom-arbre-L_body_p_0\" class=\"edge-thickness-normal edge-pattern-solid edge-thickness-normal edge-pattern-solid flowchart-link\" style=\";\" data-edge=\"true\" data-et=\"edge\" data-id=\"L_body_p_0\" data-points=\"W3sieCI6MjMxLjI4MTE0MjQ4ODUzMjEsInkiOjI3OX0seyJ4IjoyNjMuMDAzOTA2MjUsInkiOjMwN30seyJ4IjoyNjMuMDAzOTA2MjUsInkiOjMzNX1d\" data-look=\"classic\" marker-end=\"url(#ill-1-nsi-1ere-pe-ihm-web-dom-arbre_flowchart-v2-pointEnd)\"\u002F>\u003C\u002Fg>\u003Cg class=\"edgeLabels\">\u003Cg class=\"edgeLabel\">\u003Cg class=\"label\" data-id=\"L_doc_html_0\" transform=\"translate(0, 0)\">\u003Ctext y=\"-10.1\" text-anchor=\"middle\">\u003Ctspan class=\"text-outer-tspan row\" x=\"0\" y=\"-0.1em\" dy=\"1.1em\" text-anchor=\"middle\"\u002F>\u003C\u002Ftext>\u003C\u002Fg>\u003C\u002Fg>\u003Cg>\u003Crect class=\"background\" style=\"stroke: none\"\u002F>\u003C\u002Fg>\u003Cg class=\"edgeLabel\">\u003Cg class=\"label\" data-id=\"L_html_head_0\" transform=\"translate(0, 0)\">\u003Ctext y=\"-10.1\" text-anchor=\"middle\">\u003Ctspan class=\"text-outer-tspan row\" x=\"0\" y=\"-0.1em\" dy=\"1.1em\" text-anchor=\"middle\"\u002F>\u003C\u002Ftext>\u003C\u002Fg>\u003C\u002Fg>\u003Cg>\u003Crect class=\"background\" style=\"stroke: none\"\u002F>\u003C\u002Fg>\u003Cg class=\"edgeLabel\">\u003Cg class=\"label\" data-id=\"L_html_body_0\" transform=\"translate(0, 0)\">\u003Ctext y=\"-10.1\" text-anchor=\"middle\">\u003Ctspan class=\"text-outer-tspan row\" x=\"0\" y=\"-0.1em\" dy=\"1.1em\" text-anchor=\"middle\"\u002F>\u003C\u002Ftext>\u003C\u002Fg>\u003C\u002Fg>\u003Cg>\u003Crect class=\"background\" style=\"stroke: none\"\u002F>\u003C\u002Fg>\u003Cg class=\"edgeLabel\">\u003Cg class=\"label\" data-id=\"L_body_h1_0\" transform=\"translate(0, 0)\">\u003Ctext y=\"-10.1\" text-anchor=\"middle\">\u003Ctspan class=\"text-outer-tspan row\" x=\"0\" y=\"-0.1em\" dy=\"1.1em\" text-anchor=\"middle\"\u002F>\u003C\u002Ftext>\u003C\u002Fg>\u003C\u002Fg>\u003Cg>\u003Crect class=\"background\" style=\"stroke: none\"\u002F>\u003C\u002Fg>\u003Cg class=\"edgeLabel\">\u003Cg class=\"label\" data-id=\"L_body_p_0\" transform=\"translate(0, 0)\">\u003Ctext y=\"-10.1\" text-anchor=\"middle\">\u003Ctspan class=\"text-outer-tspan row\" x=\"0\" y=\"-0.1em\" dy=\"1.1em\" text-anchor=\"middle\"\u002F>\u003C\u002Ftext>\u003C\u002Fg>\u003C\u002Fg>\u003Cg>\u003Crect class=\"background\" style=\"stroke: none\"\u002F>\u003C\u002Fg>\u003C\u002Fg>\u003Cg class=\"nodes\">\u003Cg class=\"node default\" id=\"ill-1-nsi-1ere-pe-ihm-web-dom-arbre-flowchart-doc-0\" data-look=\"classic\" transform=\"translate(128.79296875, 34.5)\">\u003Crect class=\"basic label-container\" style=\"\" x=\"-65.3046875\" y=\"-22.5\" width=\"130.609375\" height=\"45\"\u002F>\u003Cg class=\"label\" style=\"\" transform=\"translate(-33.3046875, -10.5)\">\u003Crect\u002F>\u003CforeignObject width=\"66.609375\" height=\"21\">\u003Cdiv xmlns=\"http:\u002F\u002Fwww.w3.org\u002F1999\u002Fxhtml\" style=\"display: table-cell; white-space: nowrap; line-height: 1.5; max-width: 200px; text-align: center;\">\u003Cspan class=\"nodeLabel\">\u003Cp>document\u003C\u002Fp>\u003C\u002Fspan>\u003C\u002Fdiv>\u003C\u002FforeignObject>\u003C\u002Fg>\u003C\u002Fg>\u003Cg class=\"node default\" id=\"ill-1-nsi-1ere-pe-ihm-web-dom-arbre-flowchart-html-1\" data-look=\"classic\" transform=\"translate(128.79296875, 143.5)\">\u003Crect class=\"basic label-container\" style=\"\" x=\"-46.6875\" y=\"-22.5\" width=\"93.375\" height=\"45\"\u002F>\u003Cg class=\"label\" style=\"\" transform=\"translate(-14.6875, -10.5)\">\u003Crect\u002F>\u003CforeignObject width=\"29.375\" height=\"21\">\u003Cdiv xmlns=\"http:\u002F\u002Fwww.w3.org\u002F1999\u002Fxhtml\" style=\"display: table-cell; white-space: nowrap; line-height: 1.5; max-width: 200px; text-align: center;\">\u003Cspan class=\"nodeLabel\">\u003Cp>html\u003C\u002Fp>\u003C\u002Fspan>\u003C\u002Fdiv>\u003C\u002FforeignObject>\u003C\u002Fg>\u003C\u002Fg>\u003Cg class=\"node default\" id=\"ill-1-nsi-1ere-pe-ihm-web-dom-arbre-flowchart-head-2\" data-look=\"classic\" transform=\"translate(56.328125, 252.5)\">\u003Crect class=\"basic label-container\" style=\"\" x=\"-48.328125\" y=\"-22.5\" width=\"96.65625\" height=\"45\"\u002F>\u003Cg class=\"label\" style=\"\" transform=\"translate(-16.328125, -10.5)\">\u003Crect\u002F>\u003CforeignObject width=\"32.65625\" height=\"21\">\u003Cdiv xmlns=\"http:\u002F\u002Fwww.w3.org\u002F1999\u002Fxhtml\" style=\"display: table-cell; white-space: nowrap; line-height: 1.5; max-width: 200px; text-align: center;\">\u003Cspan class=\"nodeLabel\">\u003Cp>head\u003C\u002Fp>\u003C\u002Fspan>\u003C\u002Fdiv>\u003C\u002FforeignObject>\u003C\u002Fg>\u003C\u002Fg>\u003Cg class=\"node default\" id=\"ill-1-nsi-1ere-pe-ihm-web-dom-arbre-flowchart-body-3\" data-look=\"classic\" transform=\"translate(201.2578125, 252.5)\">\u003Crect class=\"basic label-container\" style=\"\" x=\"-48.6015625\" y=\"-22.5\" width=\"97.203125\" height=\"45\"\u002F>\u003Cg class=\"label\" style=\"\" transform=\"translate(-16.6015625, -10.5)\">\u003Crect\u002F>\u003CforeignObject width=\"33.203125\" height=\"21\">\u003Cdiv xmlns=\"http:\u002F\u002Fwww.w3.org\u002F1999\u002Fxhtml\" style=\"display: table-cell; white-space: nowrap; line-height: 1.5; max-width: 200px; text-align: center;\">\u003Cspan class=\"nodeLabel\">\u003Cp>body\u003C\u002Fp>\u003C\u002Fspan>\u003C\u002Fdiv>\u003C\u002FforeignObject>\u003C\u002Fg>\u003C\u002Fg>\u003Cg class=\"node default\" id=\"ill-1-nsi-1ere-pe-ihm-web-dom-arbre-flowchart-h1-4\" data-look=\"classic\" transform=\"translate(139.51171875, 361.5)\">\u003Crect class=\"basic label-container\" style=\"\" x=\"-39.203125\" y=\"-22.5\" width=\"78.40625\" height=\"45\"\u002F>\u003Cg class=\"label\" style=\"\" transform=\"translate(-7.203125, -10.5)\">\u003Crect\u002F>\u003CforeignObject width=\"14.40625\" height=\"21\">\u003Cdiv xmlns=\"http:\u002F\u002Fwww.w3.org\u002F1999\u002Fxhtml\" style=\"display: table-cell; white-space: nowrap; line-height: 1.5; max-width: 200px; text-align: center;\">\u003Cspan class=\"nodeLabel\">\u003Cp>h1\u003C\u002Fp>\u003C\u002Fspan>\u003C\u002Fdiv>\u003C\u002FforeignObject>\u003C\u002Fg>\u003C\u002Fg>\u003Cg class=\"node default\" id=\"ill-1-nsi-1ere-pe-ihm-web-dom-arbre-flowchart-p-5\" data-look=\"classic\" transform=\"translate(263.00390625, 361.5)\">\u003Crect class=\"basic label-container\" style=\"\" x=\"-36.2890625\" y=\"-22.5\" width=\"72.578125\" height=\"45\"\u002F>\u003Cg class=\"label\" style=\"\" transform=\"translate(-4.2890625, -10.5)\">\u003Crect\u002F>\u003CforeignObject width=\"8.578125\" height=\"21\">\u003Cdiv xmlns=\"http:\u002F\u002Fwww.w3.org\u002F1999\u002Fxhtml\" style=\"display: table-cell; white-space: nowrap; line-height: 1.5; max-width: 200px; text-align: center;\">\u003Cspan class=\"nodeLabel\">\u003Cp>p\u003C\u002Fp>\u003C\u002Fspan>\u003C\u002Fdiv>\u003C\u002FforeignObject>\u003C\u002Fg>\u003C\u002Fg>\u003C\u002Fg>\u003C\u002Fg>\u003C\u002Fg>\u003Cdefs>\u003Cfilter id=\"ill-1-nsi-1ere-pe-ihm-web-dom-arbre-drop-shadow\" height=\"130%\" width=\"130%\">\u003CfeDropShadow dx=\"4\" dy=\"4\" stdDeviation=\"0\" flood-opacity=\"0.06\" flood-color=\"#000000\"\u002F>\u003C\u002Ffilter>\u003C\u002Fdefs>\u003Cdefs>\u003Cfilter id=\"ill-1-nsi-1ere-pe-ihm-web-dom-arbre-drop-shadow-small\" height=\"150%\" width=\"150%\">\u003CfeDropShadow dx=\"2\" dy=\"2\" stdDeviation=\"0\" flood-opacity=\"0.06\" flood-color=\"#000000\"\u002F>\u003C\u002Ffilter>\u003C\u002Fdefs>\u003ClinearGradient id=\"ill-1-nsi-1ere-pe-ihm-web-dom-arbre-gradient\" gradientUnits=\"objectBoundingBox\" x1=\"0%\" y1=\"0%\" x2=\"100%\" y2=\"0%\">\u003Cstop offset=\"0%\" stop-color=\"#4948b8\" stop-opacity=\"1\"\u002F>\u003Cstop offset=\"100%\" stop-color=\"#c4c8cd\" stop-opacity=\"1\"\u002F>\u003C\u002FlinearGradient>\u003C\u002Fsvg>",[598,2822,2823,2824,2827,2828,648],{},"L'",[602,2825,2826],{},"arbre vivant"," d'objets construit par le navigateur depuis le HTML.\nPoint d'entrée : ",[624,2829,749],{},[2810,2831],{},[693,2833,2835],{"id":2834},"sélectionner","Sélectionner",[661,2837,2839],{"className":794,"code":2838,"language":796,"meta":666,"style":666},"document.getElementById(\"titre\");\ndocument.querySelector(\".intro\");\ndocument.querySelectorAll(\"p\");\n",[624,2840,2841,2854,2866],{"__ignoreMap":666},[670,2842,2843,2846,2848,2850,2852],{"class":672,"line":673},[670,2844,2845],{"class":676},"document.",[670,2847,823],{"class":696},[670,2849,826],{"class":676},[670,2851,704],{"class":703},[670,2853,831],{"class":676},[670,2855,2856,2858,2860,2862,2864],{"class":672,"line":687},[670,2857,2845],{"class":676},[670,2859,922],{"class":696},[670,2861,826],{"class":676},[670,2863,927],{"class":703},[670,2865,831],{"class":676},[670,2867,2868,2870,2872,2874,2876],{"class":672,"line":714},[670,2869,2845],{"class":676},[670,2871,955],{"class":696},[670,2873,826],{"class":676},[670,2875,894],{"class":703},[670,2877,831],{"class":676},[598,2879,2880,2882,2883,2885],{},[624,2881,922],{}," + ",[624,2884,955],{}," = à privilégier.",[2810,2887],{},[693,2889,2891],{"id":2890},"modifier-le-texte","Modifier le texte",[661,2893,2895],{"className":794,"code":2894,"language":796,"meta":666,"style":666},"el.textContent = \"Nouveau texte\";\nel.innerHTML   = \"\u003Cem>en italique\u003C\u002Fem>\";\n",[624,2896,2897,2908],{"__ignoreMap":666},[670,2898,2899,2901,2903,2906],{"class":672,"line":673},[670,2900,2491],{"class":676},[670,2902,700],{"class":809},[670,2904,2905],{"class":703}," \"Nouveau texte\"",[670,2907,1190],{"class":676},[670,2909,2910,2912,2914,2917],{"class":672,"line":687},[670,2911,2507],{"class":676},[670,2913,700],{"class":809},[670,2915,2916],{"class":703}," \"\u003Cem>en italique\u003C\u002Fem>\"",[670,2918,1190],{"class":676},[598,2920,2921,2923,2924,2926],{},[624,2922,626],{}," = sûr.\n",[624,2925,2672],{}," = puissant mais risque XSS.",[2810,2928],{},[693,2930,2932],{"id":2931},"modifier-les-attributs","Modifier les attributs",[661,2934,2936],{"className":794,"code":2935,"language":796,"meta":666,"style":666},"img.setAttribute(\"src\", \"photo.jpg\");\nimg.alt = \"Nouvelle description\";\nlien.href = \"https:\u002F\u002Fnsi.rocks\";\n",[624,2937,2938,2955,2966],{"__ignoreMap":666},[670,2939,2940,2942,2944,2946,2948,2950,2953],{"class":672,"line":673},[670,2941,1336],{"class":676},[670,2943,640],{"class":696},[670,2945,826],{"class":676},[670,2947,1319],{"class":703},[670,2949,627],{"class":676},[670,2951,2952],{"class":703},"\"photo.jpg\"",[670,2954,831],{"class":676},[670,2956,2957,2959,2961,2964],{"class":672,"line":687},[670,2958,1401],{"class":676},[670,2960,700],{"class":809},[670,2962,2963],{"class":703}," \"Nouvelle description\"",[670,2965,1190],{"class":676},[670,2967,2968,2970,2972,2974],{"class":672,"line":714},[670,2969,1437],{"class":676},[670,2971,700],{"class":809},[670,2973,1442],{"class":703},[670,2975,1190],{"class":676},[2810,2977],{},[693,2979,1448],{"id":1447},[661,2981,2983],{"className":794,"code":2982,"language":796,"meta":666,"style":666},"\u002F\u002F Direct (à éviter)\nel.style.color = \"navy\";\nel.style.backgroundColor = \"yellow\";\n\n\u002F\u002F Par classe (préféré)\nel.classList.add(\"actif\");\nel.classList.toggle(\"ouvert\");\n",[624,2984,2985,2990,3000,3011,3015,3020,3032],{"__ignoreMap":666},[670,2986,2987],{"class":672,"line":673},[670,2988,2989],{"class":803},"\u002F\u002F Direct (à éviter)\n",[670,2991,2992,2994,2996,2998],{"class":672,"line":687},[670,2993,2541],{"class":676},[670,2995,700],{"class":809},[670,2997,1493],{"class":703},[670,2999,1190],{"class":676},[670,3001,3002,3005,3007,3009],{"class":672,"line":714},[670,3003,3004],{"class":676},"el.style.backgroundColor ",[670,3006,700],{"class":809},[670,3008,1521],{"class":703},[670,3010,1190],{"class":676},[670,3012,3013],{"class":672,"line":736},[670,3014,837],{"emptyLinePlaceholder":836},[670,3016,3017],{"class":672,"line":845},[670,3018,3019],{"class":803},"\u002F\u002F Par classe (préféré)\n",[670,3021,3022,3024,3026,3028,3030],{"class":672,"line":866},[670,3023,2557],{"class":676},[670,3025,1540],{"class":696},[670,3027,826],{"class":676},[670,3029,1573],{"class":703},[670,3031,831],{"class":676},[670,3033,3034,3036,3038,3040,3043],{"class":672,"line":871},[670,3035,2557],{"class":676},[670,3037,1568],{"class":696},[670,3039,826],{"class":676},[670,3041,3042],{"class":703},"\"ouvert\"",[670,3044,831],{"class":676},[2810,3046],{},[693,3048,2569],{"id":2568},[661,3050,3052],{"className":794,"code":3051,"language":796,"meta":666,"style":666},"const p = document.createElement(\"p\");\np.textContent = \"Ajouté par JS\";\nparent.appendChild(p);\n\np.remove();\n",[624,3053,3054,3072,3083,3091,3095],{"__ignoreMap":666},[670,3055,3056,3058,3060,3062,3064,3066,3068,3070],{"class":672,"line":673},[670,3057,810],{"class":809},[670,3059,2581],{"class":813},[670,3061,817],{"class":809},[670,3063,820],{"class":676},[670,3065,1698],{"class":696},[670,3067,826],{"class":676},[670,3069,894],{"class":703},[670,3071,831],{"class":676},[670,3073,3074,3076,3078,3081],{"class":672,"line":687},[670,3075,2598],{"class":676},[670,3077,700],{"class":809},[670,3079,3080],{"class":703}," \"Ajouté par JS\"",[670,3082,1190],{"class":676},[670,3084,3085,3087,3089],{"class":672,"line":714},[670,3086,2610],{"class":676},[670,3088,637],{"class":696},[670,3090,2615],{"class":676},[670,3092,3093],{"class":672,"line":736},[670,3094,837],{"emptyLinePlaceholder":836},[670,3096,3097,3099,3101],{"class":672,"line":845},[670,3098,2620],{"class":676},[670,3100,1554],{"class":696},[670,3102,1796],{"class":676},[2810,3104],{},[693,3106,3108],{"id":3107},"exemple-compteur","Exemple : compteur",[661,3110,3112],{"className":663,"code":3111,"language":665,"meta":666,"style":666},"\u003Cbutton id=\"b\">0 clics\u003C\u002Fbutton>\n",[624,3113,3114],{"__ignoreMap":666},[670,3115,3116,3118,3120,3122,3124,3127,3130,3132],{"class":672,"line":673},[670,3117,677],{"class":676},[670,3119,1826],{"class":680},[670,3121,697],{"class":696},[670,3123,700],{"class":676},[670,3125,3126],{"class":703},"\"b\"",[670,3128,3129],{"class":676},">0 clics\u003C\u002F",[670,3131,1826],{"class":680},[670,3133,684],{"class":676},[661,3135,3137],{"className":794,"code":3136,"language":796,"meta":666,"style":666},"const b = document.getElementById(\"b\");\nlet n = 0;\nb.addEventListener(\"click\", () => {\n  n += 1;\n  b.textContent = `${n} clics`;\n});\n",[624,3138,3139,3158,3171,3191,3202,3220],{"__ignoreMap":666},[670,3140,3141,3143,3146,3148,3150,3152,3154,3156],{"class":672,"line":673},[670,3142,810],{"class":809},[670,3144,3145],{"class":813}," b",[670,3147,817],{"class":809},[670,3149,820],{"class":676},[670,3151,823],{"class":696},[670,3153,826],{"class":676},[670,3155,3126],{"class":703},[670,3157,831],{"class":676},[670,3159,3160,3162,3165,3167,3169],{"class":672,"line":687},[670,3161,1869],{"class":809},[670,3163,3164],{"class":676}," n ",[670,3166,700],{"class":809},[670,3168,1877],{"class":813},[670,3170,1190],{"class":676},[670,3172,3173,3176,3178,3180,3182,3185,3188],{"class":672,"line":714},[670,3174,3175],{"class":676},"b.",[670,3177,1891],{"class":696},[670,3179,826],{"class":676},[670,3181,1896],{"class":703},[670,3183,3184],{"class":676},", () ",[670,3186,3187],{"class":809},"=>",[670,3189,3190],{"class":676}," {\n",[670,3192,3193,3196,3198,3200],{"class":672,"line":736},[670,3194,3195],{"class":676},"  n ",[670,3197,1912],{"class":809},[670,3199,1915],{"class":813},[670,3201,1190],{"class":676},[670,3203,3204,3207,3209,3212,3215,3218],{"class":672,"line":845},[670,3205,3206],{"class":676},"  b.textContent ",[670,3208,700],{"class":809},[670,3210,3211],{"class":703}," `${",[670,3213,3214],{"class":676},"n",[670,3216,3217],{"class":703},"} clics`",[670,3219,1190],{"class":676},[670,3221,3222],{"class":672,"line":866},[670,3223,1940],{"class":676},[2810,3225],{},[693,3227,3229],{"id":3228},"exemple-formulaire-dynamique","Exemple : formulaire dynamique",[661,3231,3233],{"className":794,"code":3232,"language":796,"meta":666,"style":666},"form.addEventListener(\"submit\", (event) => {\n  event.preventDefault();\n  const nom = document.getElementById(\"nom\").value;\n  document.getElementById(\"msg\").textContent =\n    `Bonjour, ${nom} !`;\n});\n",[624,3234,3235,3257,3265,3283,3301,3312],{"__ignoreMap":666},[670,3236,3237,3239,3241,3243,3245,3248,3250,3253,3255],{"class":672,"line":673},[670,3238,2110],{"class":676},[670,3240,1891],{"class":696},[670,3242,826],{"class":676},[670,3244,2023],{"class":703},[670,3246,3247],{"class":676},", (",[670,3249,2126],{"class":2125},[670,3251,3252],{"class":676},") ",[670,3254,3187],{"class":809},[670,3256,3190],{"class":676},[670,3258,3259,3261,3263],{"class":672,"line":687},[670,3260,2134],{"class":676},[670,3262,2137],{"class":696},[670,3264,1796],{"class":676},[670,3266,3267,3269,3271,3273,3275,3277,3279,3281],{"class":672,"line":714},[670,3268,2148],{"class":809},[670,3270,2151],{"class":813},[670,3272,817],{"class":809},[670,3274,820],{"class":676},[670,3276,823],{"class":696},[670,3278,826],{"class":676},[670,3280,1997],{"class":703},[670,3282,2164],{"class":676},[670,3284,3285,3288,3290,3292,3295,3298],{"class":672,"line":736},[670,3286,3287],{"class":676},"  document.",[670,3289,823],{"class":696},[670,3291,826],{"class":676},[670,3293,3294],{"class":703},"\"msg\"",[670,3296,3297],{"class":676},").textContent ",[670,3299,3300],{"class":809},"=\n",[670,3302,3303,3306,3308,3310],{"class":672,"line":845},[670,3304,3305],{"class":703},"    `Bonjour, ${",[670,3307,2177],{"class":676},[670,3309,2180],{"class":703},[670,3311,1190],{"class":676},[670,3313,3314],{"class":672,"line":866},[670,3315,1940],{"class":676},[2810,3317],{},[693,3319,3321],{"id":3320},"pièges","Pièges",[1102,3323,3324,3332,3345,3352],{},[1105,3325,3326,2246,3328],{},[624,3327,823],{},[602,3329,3330],{},[624,3331,1001],{},[1105,3333,3334,3335,1254,3337,3340,3341,3344],{},"CSS en JS : ",[602,3336,2296],{},[624,3338,3339],{},"fontSize",", pas ",[624,3342,3343],{},"font-size",")",[1105,3346,3347,3349,3350],{},[624,3348,2672],{}," + saisie utilisateur = ",[602,3351,1253],{},[1105,3353,3354,3355],{},"Script avant le HTML chargé : utiliser ",[624,3356,2268],{},[2810,3358],{},[693,3360,3362],{"id":3361},"à-retenir","À retenir",[598,3364,3365,3368],{},[602,3366,3367],{},"Événement + modification du DOM = page interactive.","\nC'est le moteur de tout le Web moderne.",[630,3370,3371],{},"html pre.shiki code .sxrX7, html code.shiki .sxrX7{--shiki-light:#24292E;--shiki-default:#24292E;--shiki-dark:#E1E4E8}html pre.shiki code .snPdu, html code.shiki .snPdu{--shiki-light:#6F42C1;--shiki-default:#6F42C1;--shiki-dark:#B392F0}html pre.shiki code .sIIMD, html code.shiki .sIIMD{--shiki-light:#032F62;--shiki-default:#032F62;--shiki-dark:#9ECBFF}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html pre.shiki code .s8jYJ, html code.shiki .s8jYJ{--shiki-light:#D73A49;--shiki-default:#D73A49;--shiki-dark:#F97583}html pre.shiki code .sCsY4, html code.shiki .sCsY4{--shiki-light:#6A737D;--shiki-default:#6A737D;--shiki-dark:#6A737D}html pre.shiki code .sBjJW, html code.shiki .sBjJW{--shiki-light:#005CC5;--shiki-default:#005CC5;--shiki-dark:#79B8FF}html pre.shiki code .sovSZ, html code.shiki .sovSZ{--shiki-light:#22863A;--shiki-default:#22863A;--shiki-dark:#85E89D}html pre.shiki code .sP4rz, html code.shiki .sP4rz{--shiki-light:#E36209;--shiki-default:#E36209;--shiki-dark:#FFAB70}",{"title":666,"searchDepth":687,"depth":687,"links":3373},[],"Deck projetable pour la séance sur le DOM.",{},"\u002Fnsi-1ere\u002Fpe-ihm-web\u002Fdom-interaction.slides",{"title":2796,"description":3374},"1.nsi-1ere\u002Fpe-ihm-web\u002F4.dom-interaction.slides","BJ8KFZes7FK3ePW4tPtTHMnYvRJI1jy4n6UwT60kmVA",{"id":2351,"title":2352,"bo":3381,"body":3382,"description":2787,"eval":2336,"extension":2337,"labo":2336,"meta":3734,"navigation":2343,"path":2789,"quizzes":3735,"readingTime":673,"seo":3736,"stem":2792,"tp":2336,"__hash__":2793},[588],{"type":590,"value":3383,"toc":3724},[3384,3386,3392,3394,3420,3422,3478,3480,3548,3550,3598,3600,3622,3624,3656,3658,3722],[593,3385,2359],{"id":2358},[598,3387,3388],{},[602,3389,2364,3390,2368],{},[624,3391,2367],{},[593,3393,2372],{"id":2371},[1102,3395,3396,3400,3404,3410,3414],{},[1105,3397,2377,3398,648],{},[624,3399,749],{},[1105,3401,2382,3402,2386],{},[602,3403,2385],{},[1105,3405,2389,3406,2392,3408,2395],{},[624,3407,922],{},[624,3409,955],{},[1105,3411,2398,3412,648],{},[624,3413,2401],{},[1105,3415,2404,3416,2408,3418,648],{},[624,3417,2407],{},[624,3419,2411],{},[593,3421,2415],{"id":2414},[964,3423,3424,3432],{},[967,3425,3426],{},[970,3427,3428,3430],{},[973,3429,975],{},[973,3431,978],{},[983,3433,3434,3444,3452,3460,3470],{},[970,3435,3436,3440],{},[988,3437,3438],{},[624,3439,992],{},[988,3441,2436,3442],{},[624,3443,1001],{},[970,3445,3446,3450],{},[988,3447,3448],{},[624,3449,1013],{},[988,3451,2447],{},[970,3453,3454,3458],{},[988,3455,3456],{},[624,3457,1026],{},[988,3459,2447],{},[970,3461,3462,3466],{},[988,3463,3464],{},[624,3465,2462],{},[988,3467,2465,3468],{},[624,3469,1001],{},[970,3471,3472,3476],{},[988,3473,3474],{},[624,3475,2474],{},[988,3477,2477],{},[593,3479,2481],{"id":2480},[661,3481,3482],{"className":794,"code":2484,"language":796,"meta":666,"style":666},[624,3483,3484,3496,3508,3524,3536],{"__ignoreMap":666},[670,3485,3486,3488,3490,3492,3494],{"class":672,"line":673},[670,3487,2491],{"class":676},[670,3489,700],{"class":809},[670,3491,2496],{"class":703},[670,3493,2499],{"class":676},[670,3495,2502],{"class":803},[670,3497,3498,3500,3502,3504,3506],{"class":672,"line":687},[670,3499,2507],{"class":676},[670,3501,700],{"class":809},[670,3503,2512],{"class":703},[670,3505,2515],{"class":676},[670,3507,2518],{"class":803},[670,3509,3510,3512,3514,3516,3518,3520,3522],{"class":672,"line":714},[670,3511,2523],{"class":676},[670,3513,640],{"class":696},[670,3515,826],{"class":676},[670,3517,1319],{"class":703},[670,3519,627],{"class":676},[670,3521,2534],{"class":703},[670,3523,831],{"class":676},[670,3525,3526,3528,3530,3532,3534],{"class":672,"line":736},[670,3527,2541],{"class":676},[670,3529,700],{"class":809},[670,3531,2546],{"class":703},[670,3533,2549],{"class":676},[670,3535,2552],{"class":803},[670,3537,3538,3540,3542,3544,3546],{"class":672,"line":845},[670,3539,2557],{"class":676},[670,3541,1540],{"class":696},[670,3543,826],{"class":676},[670,3545,1573],{"class":703},[670,3547,831],{"class":676},[593,3549,2569],{"id":2568},[661,3551,3552],{"className":794,"code":2572,"language":796,"meta":666,"style":666},[624,3553,3554,3572,3582,3590],{"__ignoreMap":666},[670,3555,3556,3558,3560,3562,3564,3566,3568,3570],{"class":672,"line":673},[670,3557,810],{"class":809},[670,3559,2581],{"class":813},[670,3561,817],{"class":809},[670,3563,820],{"class":676},[670,3565,1698],{"class":696},[670,3567,826],{"class":676},[670,3569,894],{"class":703},[670,3571,831],{"class":676},[670,3573,3574,3576,3578,3580],{"class":672,"line":687},[670,3575,2598],{"class":676},[670,3577,700],{"class":809},[670,3579,2603],{"class":703},[670,3581,1190],{"class":676},[670,3583,3584,3586,3588],{"class":672,"line":714},[670,3585,2610],{"class":676},[670,3587,637],{"class":696},[670,3589,2615],{"class":676},[670,3591,3592,3594,3596],{"class":672,"line":736},[670,3593,2620],{"class":676},[670,3595,1554],{"class":696},[670,3597,1796],{"class":676},[593,3599,2628],{"id":2627},[661,3601,3602],{"className":794,"code":2631,"language":796,"meta":666,"style":666},[624,3603,3604],{"__ignoreMap":666},[670,3605,3606,3608,3610,3612,3614,3616,3618,3620],{"class":672,"line":673},[670,3607,810],{"class":809},[670,3609,2640],{"class":813},[670,3611,817],{"class":809},[670,3613,820],{"class":676},[670,3615,823],{"class":696},[670,3617,826],{"class":676},[670,3619,1997],{"class":703},[670,3621,2164],{"class":676},[593,3623,2656],{"id":2655},[1102,3625,3626,3634,3642,3650],{},[1105,3627,3628,2246,3630,2667],{},[624,3629,823],{},[602,3631,3632],{},[624,3633,1001],{},[1105,3635,3636,2673,3638,2676,3640,648],{},[624,3637,2672],{},[602,3639,1253],{},[624,3641,626],{},[1105,3643,2681,3644,1254,3646,2687,3648,2690],{},[602,3645,2296],{},[624,3647,2686],{},[624,3649,1635],{},[1105,3651,2693,3652,2696,3654,648],{},[624,3653,2268],{},[624,3655,2276],{},[593,3657,2702],{"id":2701},[661,3659,3660],{"className":794,"code":2705,"language":796,"meta":666,"style":666},[624,3661,3662,3680,3696,3706,3718],{"__ignoreMap":666},[670,3663,3664,3666,3668,3670,3672,3674,3676,3678],{"class":672,"line":673},[670,3665,810],{"class":809},[670,3667,2714],{"class":813},[670,3669,817],{"class":809},[670,3671,820],{"class":676},[670,3673,922],{"class":696},[670,3675,826],{"class":676},[670,3677,2725],{"class":703},[670,3679,831],{"class":676},[670,3681,3682,3684,3686,3688,3690,3692,3694],{"class":672,"line":687},[670,3683,2732],{"class":676},[670,3685,1891],{"class":696},[670,3687,826],{"class":676},[670,3689,1896],{"class":703},[670,3691,627],{"class":676},[670,3693,1901],{"class":809},[670,3695,1904],{"class":676},[670,3697,3698,3700,3702,3704],{"class":672,"line":714},[670,3699,2749],{"class":676},[670,3701,700],{"class":809},[670,3703,2754],{"class":703},[670,3705,1190],{"class":676},[670,3707,3708,3710,3712,3714,3716],{"class":672,"line":736},[670,3709,2761],{"class":676},[670,3711,1540],{"class":696},[670,3713,826],{"class":676},[670,3715,1573],{"class":703},[670,3717,831],{"class":676},[670,3719,3720],{"class":672,"line":845},[670,3721,1940],{"class":676},[630,3723,2776],{},{"title":666,"searchDepth":687,"depth":687,"links":3725},[3726,3727,3728,3729,3730,3731,3732,3733],{"id":2358,"depth":687,"text":2359},{"id":2371,"depth":687,"text":2372},{"id":2414,"depth":687,"text":2415},{"id":2480,"depth":687,"text":2481},{"id":2568,"depth":687,"text":2569},{"id":2627,"depth":687,"text":2628},{"id":2655,"depth":687,"text":2656},{"id":2701,"depth":687,"text":2702},{},[],{"title":2352,"description":2787},{"id":2795,"title":2796,"body":3738,"description":3374,"extension":2337,"meta":4236,"navigation":2343,"path":3376,"seo":4237,"stem":3378,"__hash__":3379},{"type":590,"value":3739,"toc":4234},[3740,3742,3746,3748,3750,3752,3758,3760,3762,3802,3808,3810,3812,3836,3842,3844,3846,3886,3888,3890,3950,3952,3954,4006,4008,4010,4032,4110,4112,4114,4192,4194,4196,4224,4226,4228,4232],[693,3741,347],{"id":2801},[598,3743,2804,3744,2808],{},[602,3745,2807],{},[2810,3747],{},[693,3749,652],{"id":651},[2815,3751],{"alt":2817,"kind":2818,"src":2819,"svg":2820},[598,3753,2823,3754,2827,3756,648],{},[602,3755,2826],{},[624,3757,749],{},[2810,3759],{},[693,3761,2835],{"id":2834},[661,3763,3764],{"className":794,"code":2838,"language":796,"meta":666,"style":666},[624,3765,3766,3778,3790],{"__ignoreMap":666},[670,3767,3768,3770,3772,3774,3776],{"class":672,"line":673},[670,3769,2845],{"class":676},[670,3771,823],{"class":696},[670,3773,826],{"class":676},[670,3775,704],{"class":703},[670,3777,831],{"class":676},[670,3779,3780,3782,3784,3786,3788],{"class":672,"line":687},[670,3781,2845],{"class":676},[670,3783,922],{"class":696},[670,3785,826],{"class":676},[670,3787,927],{"class":703},[670,3789,831],{"class":676},[670,3791,3792,3794,3796,3798,3800],{"class":672,"line":714},[670,3793,2845],{"class":676},[670,3795,955],{"class":696},[670,3797,826],{"class":676},[670,3799,894],{"class":703},[670,3801,831],{"class":676},[598,3803,3804,2882,3806,2885],{},[624,3805,922],{},[624,3807,955],{},[2810,3809],{},[693,3811,2891],{"id":2890},[661,3813,3814],{"className":794,"code":2894,"language":796,"meta":666,"style":666},[624,3815,3816,3826],{"__ignoreMap":666},[670,3817,3818,3820,3822,3824],{"class":672,"line":673},[670,3819,2491],{"class":676},[670,3821,700],{"class":809},[670,3823,2905],{"class":703},[670,3825,1190],{"class":676},[670,3827,3828,3830,3832,3834],{"class":672,"line":687},[670,3829,2507],{"class":676},[670,3831,700],{"class":809},[670,3833,2916],{"class":703},[670,3835,1190],{"class":676},[598,3837,3838,2923,3840,2926],{},[624,3839,626],{},[624,3841,2672],{},[2810,3843],{},[693,3845,2932],{"id":2931},[661,3847,3848],{"className":794,"code":2935,"language":796,"meta":666,"style":666},[624,3849,3850,3866,3876],{"__ignoreMap":666},[670,3851,3852,3854,3856,3858,3860,3862,3864],{"class":672,"line":673},[670,3853,1336],{"class":676},[670,3855,640],{"class":696},[670,3857,826],{"class":676},[670,3859,1319],{"class":703},[670,3861,627],{"class":676},[670,3863,2952],{"class":703},[670,3865,831],{"class":676},[670,3867,3868,3870,3872,3874],{"class":672,"line":687},[670,3869,1401],{"class":676},[670,3871,700],{"class":809},[670,3873,2963],{"class":703},[670,3875,1190],{"class":676},[670,3877,3878,3880,3882,3884],{"class":672,"line":714},[670,3879,1437],{"class":676},[670,3881,700],{"class":809},[670,3883,1442],{"class":703},[670,3885,1190],{"class":676},[2810,3887],{},[693,3889,1448],{"id":1447},[661,3891,3892],{"className":794,"code":2982,"language":796,"meta":666,"style":666},[624,3893,3894,3898,3908,3918,3922,3926,3938],{"__ignoreMap":666},[670,3895,3896],{"class":672,"line":673},[670,3897,2989],{"class":803},[670,3899,3900,3902,3904,3906],{"class":672,"line":687},[670,3901,2541],{"class":676},[670,3903,700],{"class":809},[670,3905,1493],{"class":703},[670,3907,1190],{"class":676},[670,3909,3910,3912,3914,3916],{"class":672,"line":714},[670,3911,3004],{"class":676},[670,3913,700],{"class":809},[670,3915,1521],{"class":703},[670,3917,1190],{"class":676},[670,3919,3920],{"class":672,"line":736},[670,3921,837],{"emptyLinePlaceholder":836},[670,3923,3924],{"class":672,"line":845},[670,3925,3019],{"class":803},[670,3927,3928,3930,3932,3934,3936],{"class":672,"line":866},[670,3929,2557],{"class":676},[670,3931,1540],{"class":696},[670,3933,826],{"class":676},[670,3935,1573],{"class":703},[670,3937,831],{"class":676},[670,3939,3940,3942,3944,3946,3948],{"class":672,"line":871},[670,3941,2557],{"class":676},[670,3943,1568],{"class":696},[670,3945,826],{"class":676},[670,3947,3042],{"class":703},[670,3949,831],{"class":676},[2810,3951],{},[693,3953,2569],{"id":2568},[661,3955,3956],{"className":794,"code":3051,"language":796,"meta":666,"style":666},[624,3957,3958,3976,3986,3994,3998],{"__ignoreMap":666},[670,3959,3960,3962,3964,3966,3968,3970,3972,3974],{"class":672,"line":673},[670,3961,810],{"class":809},[670,3963,2581],{"class":813},[670,3965,817],{"class":809},[670,3967,820],{"class":676},[670,3969,1698],{"class":696},[670,3971,826],{"class":676},[670,3973,894],{"class":703},[670,3975,831],{"class":676},[670,3977,3978,3980,3982,3984],{"class":672,"line":687},[670,3979,2598],{"class":676},[670,3981,700],{"class":809},[670,3983,3080],{"class":703},[670,3985,1190],{"class":676},[670,3987,3988,3990,3992],{"class":672,"line":714},[670,3989,2610],{"class":676},[670,3991,637],{"class":696},[670,3993,2615],{"class":676},[670,3995,3996],{"class":672,"line":736},[670,3997,837],{"emptyLinePlaceholder":836},[670,3999,4000,4002,4004],{"class":672,"line":845},[670,4001,2620],{"class":676},[670,4003,1554],{"class":696},[670,4005,1796],{"class":676},[2810,4007],{},[693,4009,3108],{"id":3107},[661,4011,4012],{"className":663,"code":3111,"language":665,"meta":666,"style":666},[624,4013,4014],{"__ignoreMap":666},[670,4015,4016,4018,4020,4022,4024,4026,4028,4030],{"class":672,"line":673},[670,4017,677],{"class":676},[670,4019,1826],{"class":680},[670,4021,697],{"class":696},[670,4023,700],{"class":676},[670,4025,3126],{"class":703},[670,4027,3129],{"class":676},[670,4029,1826],{"class":680},[670,4031,684],{"class":676},[661,4033,4034],{"className":794,"code":3136,"language":796,"meta":666,"style":666},[624,4035,4036,4054,4066,4082,4092,4106],{"__ignoreMap":666},[670,4037,4038,4040,4042,4044,4046,4048,4050,4052],{"class":672,"line":673},[670,4039,810],{"class":809},[670,4041,3145],{"class":813},[670,4043,817],{"class":809},[670,4045,820],{"class":676},[670,4047,823],{"class":696},[670,4049,826],{"class":676},[670,4051,3126],{"class":703},[670,4053,831],{"class":676},[670,4055,4056,4058,4060,4062,4064],{"class":672,"line":687},[670,4057,1869],{"class":809},[670,4059,3164],{"class":676},[670,4061,700],{"class":809},[670,4063,1877],{"class":813},[670,4065,1190],{"class":676},[670,4067,4068,4070,4072,4074,4076,4078,4080],{"class":672,"line":714},[670,4069,3175],{"class":676},[670,4071,1891],{"class":696},[670,4073,826],{"class":676},[670,4075,1896],{"class":703},[670,4077,3184],{"class":676},[670,4079,3187],{"class":809},[670,4081,3190],{"class":676},[670,4083,4084,4086,4088,4090],{"class":672,"line":736},[670,4085,3195],{"class":676},[670,4087,1912],{"class":809},[670,4089,1915],{"class":813},[670,4091,1190],{"class":676},[670,4093,4094,4096,4098,4100,4102,4104],{"class":672,"line":845},[670,4095,3206],{"class":676},[670,4097,700],{"class":809},[670,4099,3211],{"class":703},[670,4101,3214],{"class":676},[670,4103,3217],{"class":703},[670,4105,1190],{"class":676},[670,4107,4108],{"class":672,"line":866},[670,4109,1940],{"class":676},[2810,4111],{},[693,4113,3229],{"id":3228},[661,4115,4116],{"className":794,"code":3232,"language":796,"meta":666,"style":666},[624,4117,4118,4138,4146,4164,4178,4188],{"__ignoreMap":666},[670,4119,4120,4122,4124,4126,4128,4130,4132,4134,4136],{"class":672,"line":673},[670,4121,2110],{"class":676},[670,4123,1891],{"class":696},[670,4125,826],{"class":676},[670,4127,2023],{"class":703},[670,4129,3247],{"class":676},[670,4131,2126],{"class":2125},[670,4133,3252],{"class":676},[670,4135,3187],{"class":809},[670,4137,3190],{"class":676},[670,4139,4140,4142,4144],{"class":672,"line":687},[670,4141,2134],{"class":676},[670,4143,2137],{"class":696},[670,4145,1796],{"class":676},[670,4147,4148,4150,4152,4154,4156,4158,4160,4162],{"class":672,"line":714},[670,4149,2148],{"class":809},[670,4151,2151],{"class":813},[670,4153,817],{"class":809},[670,4155,820],{"class":676},[670,4157,823],{"class":696},[670,4159,826],{"class":676},[670,4161,1997],{"class":703},[670,4163,2164],{"class":676},[670,4165,4166,4168,4170,4172,4174,4176],{"class":672,"line":736},[670,4167,3287],{"class":676},[670,4169,823],{"class":696},[670,4171,826],{"class":676},[670,4173,3294],{"class":703},[670,4175,3297],{"class":676},[670,4177,3300],{"class":809},[670,4179,4180,4182,4184,4186],{"class":672,"line":845},[670,4181,3305],{"class":703},[670,4183,2177],{"class":676},[670,4185,2180],{"class":703},[670,4187,1190],{"class":676},[670,4189,4190],{"class":672,"line":866},[670,4191,1940],{"class":676},[2810,4193],{},[693,4195,3321],{"id":3320},[1102,4197,4198,4206,4214,4220],{},[1105,4199,4200,2246,4202],{},[624,4201,823],{},[602,4203,4204],{},[624,4205,1001],{},[1105,4207,3334,4208,1254,4210,3340,4212,3344],{},[602,4209,2296],{},[624,4211,3339],{},[624,4213,3343],{},[1105,4215,4216,3349,4218],{},[624,4217,2672],{},[602,4219,1253],{},[1105,4221,3354,4222],{},[624,4223,2268],{},[2810,4225],{},[693,4227,3362],{"id":3361},[598,4229,4230,3368],{},[602,4231,3367],{},[630,4233,3371],{},{"title":666,"searchDepth":687,"depth":687,"links":4235},[],{},{"title":2796,"description":3374},1788035581357]