{"id":788,"date":"2024-09-03T11:14:57","date_gmt":"2024-09-03T09:14:57","guid":{"rendered":"https:\/\/pacific-webtools.com\/web-extractor\/?p=788"},"modified":"2024-09-03T11:48:15","modified_gmt":"2024-09-03T09:48:15","slug":"extracteur-site-entier-html-css-js","status":"publish","type":"post","link":"https:\/\/pacific-webtools.com\/web-extractor\/extracteur-site-entier-html-css-js\/","title":{"rendered":"Extraire le code HTML CSS Js d’un site web entier"},"content":{"rendered":"\t\t
\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\n\n\n\n\nPacific Web Extractor - Extraction Dynamique du Site<\/title>\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Roboto:wght@300;400;700&display=swap\" rel=\"stylesheet\">\n<link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.1.1\/css\/all.min.css\">\n<script src=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/jszip\/3.7.1\/jszip.min.js\"><\/script>\n<style>\n\/* Styles g\u00e9n\u00e9raux *\/\n:root {\n --primary-color: #3498db;\n --secondary-color: #2980b9;\n --background-color: #f5f7fa;\n --text-color: #2c3e50;\n --border-color: #e0e0e0;\n --button-color: #3498db;\n --button-hover-color: #2980b9;\n --header-color: #34495e;\n --border-radius: 8px;\n --dark-background-color: #2c3e50;\n --dark-text-color: #ecf0f1;\n --dark-card-bg-color: #333;\n --dark-card-border-color: #444;\n --dark-icon-color: #3498db;\n}\n\nbody, html {\n margin: 0;\n padding: 0;\n font-family: 'Roboto', sans-serif;\n height: 100%;\n background-color: var(--background-color);\n color: var(--text-color);\n transition: all 0.3s ease;\n overflow-x: hidden;\n}\n\n.container {\n display: flex;\n flex-direction: column;\n min-height: 100vh;\n width: 100%;\n max-width: none;\n}\n\n.hero-section {\n background: linear-gradient(135deg, #3498db, #2980b9);\n padding: 2rem;\n text-align: center;\n color: white;\n position: relative;\n overflow: hidden;\n min-height: 100vh;\n display: flex;\n flex-direction: column;\n justify-content: center;\n width: 100%;\n box-sizing: border-box;\n}\n\n.hero-section::before {\n content: '';\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background: linear-gradient(135deg, #3498db, #2980b9);\n opacity: 0.7;\n z-index: 1;\n}\n\n.hero-content {\n position: relative;\n z-index: 2;\n flex-grow: 1;\n display: flex;\n flex-direction: column;\n justify-content: center;\n align-items: center;\n width: 100%;\n max-width: none;\n}\n\n.matrix-bg {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n overflow: hidden;\n z-index: 0;\n background-color: transparent; \/* Modifier en transparent pour le mode normal *\/\n}\n\n.hero-section h1 {\n font-size: 2rem;\n margin-bottom: 1rem;\n font-weight: 700;\n}\n\n.hero-section p {\n font-size: 1rem;\n max-width: 800px;\n margin: 0 auto 1.5rem;\n line-height: 1.6;\n padding: 0 1rem;\n}\n\n.input-group {\n display: flex;\n flex-direction: column;\n gap: 0.8rem;\n max-width: 600px;\n margin: 0 auto;\n justify-content: center;\n align-items: stretch;\n width: 100%;\n}\n\n#url-input {\n padding: 0.8rem;\n font-size: 1rem;\n border: 1px solid var(--border-color);\n border-radius: var(--border-radius);\n background-color: white;\n color: var(--text-color);\n flex: 1;\n min-width: 0;\n width: 100%;\n box-sizing: border-box;\n}\n\n.btn {\n padding: 0.8rem 1.5rem;\n background-color: var(--button-color);\n color: white;\n border: none;\n border-radius: var(--border-radius);\n cursor: pointer;\n font-size: 1rem;\n font-weight: 600;\n transition: all 0.3s ease;\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 0.5rem;\n white-space: nowrap;\n width: 100%;\n}\n\n.btn:hover {\n background-color: var(--button-hover-color);\n}\n\n@media (min-width: 768px) {\n .input-group {\n flex-direction: row;\n }\n\n #url-input {\n flex: 1;\n width: auto;\n }\n\n .btn {\n width: auto;\n }\n}\n\n#theme-toggle {\n position: fixed;\n bottom: 20px;\n right: 20px;\n z-index: 1000;\n background: none;\n border: none;\n cursor: pointer;\n font-size: 2rem;\n transition: all 0.3s ease;\n animation: float 2s ease-in-out infinite;\n}\n\n@keyframes float {\n 0% { transform: translateY(0px); }\n 50% { transform: translateY(-10px); }\n 100% { transform: translateY(0px); }\n}\n\n.tooltip {\n position: relative;\n display: inline-block;\n cursor: pointer;\n}\n\n.tooltip .tooltiptext {\n visibility: hidden;\n width: 160px;\n background-color: #555;\n color: #fff;\n text-align: center;\n border-radius: 6px;\n padding: 5px 0;\n position: absolute;\n z-index: 1;\n bottom: 125%;\n left: 50%;\n margin-left: -80px;\n opacity: 0;\n transition: opacity 0.3s;\n}\n\n.tooltip .tooltiptext::after {\n content: '';\n position: absolute;\n top: 100%;\n left: 50%;\n margin-left: -5px;\n border-width: 5px;\n border-style: solid;\n border-color: #555 transparent transparent transparent;\n}\n\n.tooltip:hover .tooltiptext {\n visibility: visible;\n opacity: 1;\n}\n\n.feature-section {\n padding: 2rem;\n background-color: var(--background-color);\n border-top: 1px solid var(--border-color);\n display: none;\n box-shadow: 0 -5px 15px rgba(0, 0, 0, 0.1);\n width: 100%;\n box-sizing: border-box;\n}\n\n.feature-section h2 {\n font-size: 2rem;\n color: var(--primary-color);\n text-align: center;\n margin-bottom: 1.5rem;\n text-transform: uppercase;\n letter-spacing: 2px;\n}\n\n.sr-only {\n position: absolute;\n width: 1px;\n height: 1px;\n padding: 0;\n margin: -1px;\n overflow: hidden;\n clip: rect(0, 0, 0, 0);\n white-space: nowrap;\n border-width: 0;\n}\n\n\/* Animation de chargement *\/\n.loading-overlay {\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background-color: rgba(0, 0, 0, 0.7);\n display: flex;\n justify-content: center;\n align-items: center;\n z-index: 9999;\n opacity: 0;\n visibility: hidden;\n transition: opacity 0.3s ease, visibility 0.3s ease;\n}\n\n.loading-overlay.active {\n opacity: 1;\n visibility: visible;\n}\n\n.loading-spinner {\n width: 50px;\n height: 50px;\n border: 5px solid #f3f3f3;\n border-top: 5px solid #3498db;\n border-radius: 50%;\n animation: spin 1s linear infinite;\n}\n\n@keyframes spin {\n 0% { transform: rotate(0deg); }\n 100% { transform: rotate(360deg); }\n}\n\n\/* Nouvelle barre de progression stylis\u00e9e *\/\n.progress-container {\n width: 100%;\n max-width: 800px;\n margin: 30px auto;\n background-color: var(--background-color);\n border-radius: 15px;\n box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1);\n padding: 30px;\n position: relative;\n overflow: hidden;\n}\n\n.progress-container::before {\n content: '';\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n height: 5px;\n background: linear-gradient(to right, var(--primary-color), var(--secondary-color));\n}\n\n#progress-bar {\n width: 100%;\n height: 25px;\n background-color: rgba(var(--border-color-rgb), 0.2);\n border-radius: 12.5px;\n overflow: hidden;\n position: relative;\n box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.1);\n}\n\n#progress {\n width: 0;\n height: 100%;\n background: linear-gradient(45deg, var(--primary-color), var(--secondary-color));\n transition: width 0.5s ease;\n position: relative;\n border-radius: 12.5px;\n}\n\n#progress::after {\n content: '';\n position: absolute;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background: linear-gradient(\n 45deg,\n rgba(255, 255, 255, 0.2) 25%,\n transparent 25%,\n transparent 50%,\n rgba(255, 255, 255, 0.2) 50%,\n rgba(255, 255, 255, 0.2) 75%,\n transparent 75%,\n transparent\n );\n background-size: 50px 50px;\n animation: move 2s linear infinite;\n overflow: hidden;\n}\n\n@keyframes move {\n 0% {\n background-position: 0 0;\n }\n 100% {\n background-position: 50px 50px;\n }\n}\n\n#progress-text {\n text-align: center;\n margin-top: 15px;\n font-weight: bold;\n font-size: 16px;\n color: var(--text-color);\n}\n\n\/* Compteur stylis\u00e9 *\/\n.timer-container {\n display: flex;\n justify-content: center;\n align-items: center;\n margin-top: 30px;\n}\n\n.timer {\n display: flex;\n justify-content: center;\n align-items: center;\n width: 120px;\n height: 120px;\n border-radius: 50%;\n background: linear-gradient(135deg, var(--primary-color), var(--secondary-color));\n color: white;\n font-size: 24px;\n font-weight: bold;\n box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);\n position: relative;\n}\n\n.timer::before {\n content: '';\n position: absolute;\n top: 5px;\n left: 5px;\n right: 5px;\n bottom: 5px;\n border-radius: 50%;\n border: 2px solid rgba(255, 255, 255, 0.3);\n}\n\n.timer-label {\n font-size: 16px;\n margin-top: 15px;\n text-align: center;\n color: var(--text-color);\n font-weight: 600;\n}\n\n\/* Styles pour les boutons dans la feature-section *\/\n.feature-section .btn {\n margin: 20px auto;\n max-width: 300px;\n transition: all 0.3s ease;\n}\n\n.feature-section .btn:hover {\n transform: translateY(-3px);\n box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);\n}\n\n#select-all {\n background-color: var(--secondary-color);\n}\n\n#download-selected {\n background-color: #27ae60;\n}\n\n\/* Responsive design pour la feature-section *\/\n@media (max-width: 768px) {\n .feature-section {\n padding: 1rem;\n }\n\n .progress-container {\n padding: 20px;\n }\n\n .timer {\n width: 100px;\n height: 100px;\n font-size: 20px;\n }\n\n .feature-section .btn {\n max-width: 100%;\n }\n\n .cards-container {\n grid-template-columns: 1fr;\n }\n}\n\n\/* Styles pour les cartes Google - inchang\u00e9s *\/\n.cards-container {\n display: grid;\n grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));\n gap: 20px;\n padding: 20px;\n width: 100%;\n box-sizing: border-box;\n}\n\n.card {\n background-color: white;\n border-radius: 8px;\n box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);\n padding: 20px;\n display: flex;\n flex-direction: column;\n transition: transform 0.5s ease, box-shadow 0.5s ease;\n}\n\n.card-header {\n display: flex;\n align-items: center;\n margin-bottom: 10px;\n}\n\n.card-favicon {\n width: 16px;\n height: 16px;\n margin-right: 10px;\n}\n\n.card-title {\n font-size: 18px;\n font-weight: bold;\n margin: 0;\n}\n\n.card-url {\n color: #006621;\n font-size: 14px;\n margin-bottom: 10px;\n word-break: break-all;\n}\n\n.card-description {\n font-size: 14px;\n color: #545454;\n flex-grow: 1;\n}\n\n.card-checkbox {\n margin-top: 10px;\n align-self: flex-start;\n}\n\n\/* Animation pour les nouvelles cartes *\/\n@keyframes fadeIn {\n from { opacity: 0; transform: translateY(-10px); }\n to { opacity: 1; transform: translateY(0); }\n}\n\n.new-card {\n animation: fadeIn 0.5s ease-out;\n}\n\n\/* Ajout de padding pour am\u00e9liorer la lisibilit\u00e9 et l'ergonomie *\/\n.hero-section, .feature-section {\n padding: 3rem;\n}\n\n.card {\n padding: 1.5rem;\n}\n\n@media (max-width: 768px) {\n .hero-section, .feature-section {\n padding: 2rem;\n }\n\n .card {\n padding: 1rem;\n }\n}\n\n\/* Styles pour le nouveau bloc de notice *\/\n.notice-section {\n background: linear-gradient(135deg, #d6eaff, #f0f9ff);\n padding: 3rem;\n text-align: center;\n border-top: 1px solid var(--border-color);\n position: relative;\n overflow: hidden;\n box-shadow: 0 -5px 15px rgba(0, 0, 0, 0.1);\n animation: backgroundMove 10s linear infinite;\n}\n\n@keyframes backgroundMove {\n 0% { background-position: 0 0; }\n 100% { background-position: 200% 200%; }\n}\n\n.notice-section h2 {\n font-size: 2rem;\n color: var(--primary-color);\n margin-bottom: 2rem;\n}\n\n.notice-cards {\n display: grid;\n grid-template-columns: repeat(3, 1fr);\n gap: 2rem;\n max-width: 1200px;\n margin: 0 auto;\n justify-content: center;\n align-items: center;\n}\n\n.notice-card {\n background-color: white;\n border-radius: 8px;\n box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);\n padding: 1.5rem;\n display: flex;\n flex-direction: column;\n align-items: center;\n text-align: center;\n position: relative;\n overflow: hidden;\n transition: transform 0.5s ease, box-shadow 0.5s ease;\n}\n\n.notice-card:hover {\n transform: scale(1.05) rotate(1deg);\n box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);\n}\n\n.notice-card h3 {\n font-size: 1.2rem;\n color: var(--primary-color);\n margin-bottom: 1rem;\n}\n\n.notice-card p {\n font-size: 0.9rem;\n color: var(--text-color);\n line-height: 1.6;\n}\n\n.notice-card i {\n font-size: 2.5rem;\n color: var(--primary-color);\n margin-bottom: 1rem;\n transition: transform 0.5s ease;\n}\n\n.notice-card:hover i {\n transform: scale(1.3) rotate(20deg);\n}\n\n@media (max-width: 1024px) {\n .notice-cards {\n grid-template-columns: repeat(2, 1fr);\n }\n}\n\n@media (max-width: 768px) {\n .notice-cards {\n grid-template-columns: 1fr;\n }\n}\n\n\/* Am\u00e9lioration du mode dark pour le fond Matrix et les textes *\/\n.dark-theme .hero-section,\n.dark-theme .feature-section,\n.dark-theme .btn {\n background-color: var(--dark-background-color);\n color: var(--dark-text-color);\n}\n\n.dark-theme .card {\n background-color: var(--dark-card-bg-color); \/* Couleur de fond plus sombre pour le mode dark *\/\n color: var(--dark-text-color); \/* Couleur du texte en blanc pour le mode dark *\/\n border-color: var(--dark-card-border-color); \/* Bordure plus sombre pour le mode dark *\/\n}\n\n.dark-theme .card-url {\n color: var(--dark-icon-color); \/* Couleur des liens pour le mode dark *\/\n}\n\n.dark-theme .card-description {\n color: var(--dark-text-color); \/* Couleur du texte de description pour le mode dark *\/\n}\n\n.dark-theme .matrix-bg {\n background-color: transparent; \/* Utiliser transparent pour permettre le contr\u00f4le via JS *\/\n}\n\n.dark-theme .timer {\n color: var(--dark-text-color);\n border-color: rgba(255, 255, 255, 0.3);\n}\n\n.dark-theme .loading-spinner {\n border-color: #f3f3f3;\n border-top-color: var(--primary-color);\n}\n\n.dark-theme .tooltip .tooltiptext {\n background-color: #333;\n}\n\n.dark-theme .progress-container,\n.dark-theme .cards-container {\n background-color: var(--dark-background-color);\n color: var(--dark-text-color);\n border-color: var(--dark-card-border-color);\n}\n\n.dark-theme .notice-section {\n background: linear-gradient(135deg, #1a1a1a, #333); \/* Fond sombre pour le mode dark *\/\n}\n\n.dark-theme .notice-card {\n background-color: var(--dark-card-bg-color);\n color: var(--dark-text-color);\n border-color: var(--dark-card-border-color);\n}\n\n.dark-theme .notice-card i {\n color: var(--dark-icon-color); \/* Couleur des ic\u00f4nes en mode sombre *\/\n}\n\n.dark-theme .notice-card h3,\n.dark-theme .notice-card p,\n.dark-theme .notice-card a {\n color: var(--dark-text-color); \/* Texte en blanc pour une meilleure lisibilit\u00e9 en mode sombre *\/\n}\n\n.dark-theme .notice-card .btn {\n background-color: var(--dark-icon-color);\n color: white;\n}\n\n<\/style>\n<\/head>\n<body>\n <div class=\"container\">\n <section class=\"hero-section\">\n <canvas id=\"matrix-canvas\" class=\"matrix-bg\"><\/canvas>\n <div class=\"hero-content\">\n <h1>Pacific Web Extractor: Votre Extracteur de Code Multi-Pages<\/h1>\n <p>Pacific Web Extractor r\u00e9volutionne l'exploration du web en permettant l'extraction rapide et efficace du contenu de sites entiers. Cet outil puissant offre aux d\u00e9veloppeurs, chercheurs et professionnels du marketing digital la possibilit\u00e9 d'analyser, archiver et exploiter des donn\u00e9es web \u00e0 grande \u00e9chelle. Gr\u00e2ce \u00e0 son interface intuitive et ses fonctionnalit\u00e9s avanc\u00e9es, Pacific Web Extractor simplifie le processus de collecte d'informations, rendant l'analyse de contenu web plus accessible que jamais. Que vous soyez en qu\u00eate d'inspiration, de veille concurrentielle ou de donn\u00e9es pour vos projets, cet outil deviendra rapidement indispensable dans votre arsenal num\u00e9rique.<\/p>\n <div class=\"input-group\">\n <div class=\"tooltip\">\n <input type=\"text\" id=\"url-input\" placeholder=\"Entrez l'URL du site web\" aria-label=\"URL du site web\">\n <span class=\"tooltiptext\">Entrez l'URL de base du site \u00e0 analyser<\/span>\n <\/div>\n <div class=\"tooltip\">\n <button id=\"extract-btn\" class=\"btn\" aria-label=\"Extraire les pages\"><i class=\"fas fa-search\" aria-hidden=\"true\"><\/i> Extraire les pages<\/button>\n <span class=\"tooltiptext\">Extraire toutes les pages du site<\/span>\n <\/div>\n <!-- Nouveau bouton T\u00e9l\u00e9charger toutes les pages -->\n <div class=\"tooltip\">\n <button id=\"download-all-btn\" class=\"btn\" aria-label=\"T\u00e9l\u00e9charger toutes les pages\"><i class=\"fas fa-download\" aria-hidden=\"true\"><\/i> T\u00e9l\u00e9charger toutes les pages<\/button>\n <span class=\"tooltiptext\">T\u00e9l\u00e9charger toutes les pages en HTML<\/span>\n <\/div>\n <\/div>\n <\/div>\n <\/section>\n \n <section id=\"feature-section\" class=\"feature-section\">\n <h2>Pages extraites<\/h2>\n <div class=\"progress-container\">\n <div id=\"progress-bar\">\n <div id=\"progress\"><\/div>\n <\/div>\n <div id=\"progress-text\"><\/div>\n <div class=\"timer-container\">\n <div style=\"display: flex; flex-direction: column; align-items: center;\">\n <div id=\"estimated-time\" class=\"timer\">00:00<\/div>\n <div class=\"timer-label\">Temps restant estim\u00e9<\/div>\n <\/div>\n <\/div>\n <\/div>\n <div style=\"display: flex; justify-content: center; align-items: center;\">\n <button id=\"select-all\" class=\"btn\">S\u00e9lectionner tout<\/button>\n <\/div>\n <div id=\"cards-container\" class=\"cards-container\">\n <!-- Les cartes seront ajout\u00e9es dynamiquement ici -->\n <\/div>\n <button id=\"download-selected\" class=\"btn\" style=\"display: none;\"><i class=\"fas fa-file-download\" aria-hidden=\"true\"><\/i> T\u00e9l\u00e9charger pages s\u00e9lectionn\u00e9es<\/button>\n <\/section>\n\n <section class=\"notice-section\">\n <h2>Comment \u00e7a marche ?<\/h2>\n <div class=\"notice-cards\">\n <div class=\"notice-card\">\n <i class=\"fas fa-lightbulb\"><\/i>\n <h3>Conseil<\/h3>\n <p>Pour une exp\u00e9rience optimale, nous recommandons l'utilisation de l'extension Chrome Nopecha. Elle vous aidera \u00e0 contourner les CAPTCHAs et autres m\u00e9canismes de s\u00e9curit\u00e9 qui pourraient ralentir l'extraction.<\/p>\n <a href=\"https:\/\/chrome.google.com\/webstore\/detail\/nopecha-captcha-solver\/dknlfmjaanfblgfdfebhijalfmhmjjjo\" target=\"_blank\" class=\"btn\">T\u00e9l\u00e9charger Nopecha<\/a>\n <\/div>\n <div class=\"notice-card\">\n <i class=\"fas fa-keyboard\"><\/i>\n <h3>Entrez l'URL<\/h3>\n <p>Commencez par saisir l'adresse du site web que vous souhaitez analyser dans la barre de recherche de Pacific Web Extractor. Notre outil est pr\u00eat \u00e0 explorer n'importe quel site pour vous.<\/p>\n <\/div>\n <div class=\"notice-card\">\n <i class=\"fas fa-rocket\"><\/i>\n <h3>Lancement de l'extraction<\/h3>\n <p>Cliquez sur le bouton d'extraction. Notre algorithme avanc\u00e9 parcourra alors l'ensemble du site, collectant les donn\u00e9es pertinentes de chaque page. Vous pouvez suivre la progression en temps r\u00e9el.<\/p>\n <\/div>\n <div class=\"notice-card\">\n <i class=\"fas fa-eye\"><\/i>\n <h3>Visualisation des r\u00e9sultats<\/h3>\n <p>Une fois l'extraction termin\u00e9e, vous verrez une liste d\u00e9taill\u00e9e de toutes les pages du site, pr\u00e9sent\u00e9es sous forme de cartes faciles \u00e0 lire, avec le titre, l'URL et une br\u00e8ve description de chaque page.<\/p>\n <\/div>\n <div class=\"notice-card\">\n <i class=\"fas fa-check-square\"><\/i>\n <h3>S\u00e9lection des pages<\/h3>\n <p>Parcourez les r\u00e9sultats et s\u00e9lectionnez les pages qui vous int\u00e9ressent le plus. Vous pouvez choisir autant de pages que vous le souhaitez pour un t\u00e9l\u00e9chargement ult\u00e9rieur.<\/p>\n <\/div>\n <div class=\"notice-card\">\n <i class=\"fas fa-download\"><\/i>\n <h3>T\u00e9l\u00e9chargement<\/h3>\n <p>Une fois votre s\u00e9lection faite, cliquez sur \"T\u00e9l\u00e9charger pages s\u00e9lectionn\u00e9es\". Un fichier ZIP contenant toutes les pages HTML choisies sera g\u00e9n\u00e9r\u00e9 et t\u00e9l\u00e9charg\u00e9 sur votre appareil.<\/p>\n <\/div>\n <\/div>\n <\/section>\n <\/div>\n\n <button id=\"theme-toggle\" aria-label=\"Changer le th\u00e8me\">\ud83c\udf34<\/button>\n\n <!-- Animation de chargement -->\n <div class=\"loading-overlay\">\n <div class=\"loading-spinner\"><\/div>\n <\/div>\n\n <script>\n const urlInput = document.getElementById('url-input');\n const extractBtn = document.getElementById('extract-btn');\n const downloadAllBtn = document.getElementById('download-all-btn');\n const themeToggle = document.getElementById('theme-toggle');\n const loadingOverlay = document.querySelector('.loading-overlay');\n const cardsContainer = document.getElementById('cards-container');\n const selectAllBtn = document.getElementById('select-all');\n const downloadSelectedBtn = document.getElementById('download-selected');\n const progressBar = document.getElementById('progress');\n const progressText = document.getElementById('progress-text');\n const estimatedTimeElement = document.getElementById('estimated-time');\n const featureSection = document.getElementById('feature-section');\n const canvas = document.getElementById('matrix-canvas');\n const ctx = canvas.getContext('2d');\n\n const FORBIDDEN_DOMAIN = 'https:\/\/pacific-webtools.com';\n\n function showLoading() {\n loadingOverlay.classList.add('active');\n }\n\n function hideLoading() {\n loadingOverlay.classList.remove('active');\n }\n\n function normalizeUrl(url) {\n if (!url.startsWith('http:\/\/') && !url.startsWith('https:\/\/')) {\n url = 'https:\/\/' + url;\n }\n try {\n const parsedUrl = new URL(url);\n return parsedUrl.toString();\n } catch (error) {\n console.error('URL invalide:', error);\n return null;\n }\n }\n\n function extractDomainName(url) {\n try {\n const parsedUrl = new URL(url);\n return parsedUrl.hostname.replace(\/^www\\.\/, '');\n } catch (error) {\n console.error('Invalid URL:', error);\n return 'domain';\n }\n }\n\n async function fetchPage(url) {\n const response = await fetch(`https:\/\/api.allorigins.win\/get?url=${encodeURIComponent(url)}`);\n if (response.ok) {\n const data = await response.json();\n return data.contents;\n } else {\n throw new Error(`Failed to fetch URL: ${url}`);\n }\n }\n\n function getInternalLinks(baseUrl, html) {\n const parser = new DOMParser();\n const doc = parser.parseFromString(html, 'text\/html');\n const links = Array.from(doc.querySelectorAll('a[href]'));\n const internalLinks = links\n .map(link => {\n const href = link.getAttribute('href');\n if (!href) return null;\n try {\n return new URL(href, baseUrl).href;\n } catch (error) {\n console.error('Invalid URL:', error);\n return null;\n }\n })\n .filter(url => url && url.startsWith(baseUrl));\n return [...new Set(internalLinks)]; \/\/ Remove duplicates\n }\n\n function getPageTitle(html) {\n const parser = new DOMParser();\n const doc = parser.parseFromString(html, 'text\/html');\n const titleElement = doc.querySelector('title');\n return titleElement ? titleElement.textContent : 'Sans titre';\n }\n\n function getMetaDescription(html) {\n const parser = new DOMParser();\n const doc = parser.parseFromString(html, 'text\/html');\n const metaDescription = doc.querySelector('meta[name=\"description\"]');\n return metaDescription ? metaDescription.getAttribute('content') : 'Pas de description disponible';\n }\n\n function getFaviconUrl(baseUrl) {\n return `https:\/\/www.google.com\/s2\/favicons?domain=${encodeURIComponent(baseUrl)}`;\n }\n\n function addPageToCards(page, index) {\n const card = document.createElement('div');\n card.classList.add('card', 'new-card');\n card.innerHTML = `\n <div class=\"card-header\">\n <img decoding=\"async\" src=\"${getFaviconUrl(page.url)}\" alt=\"Favicon\" class=\"card-favicon\">\n <h3 class=\"card-title\">${page.title}<\/h3>\n <\/div>\n <p class=\"card-url\">${page.url}<\/p>\n <p class=\"card-description\">${page.description}<\/p>\n <label class=\"card-checkbox\">\n <input type=\"checkbox\" id=\"page-${index}\" data-url=\"${page.url}\">\n S\u00e9lectionner\n <\/label>\n `;\n cardsContainer.appendChild(card);\n }\n\n function formatTime(seconds) {\n const hours = Math.floor(seconds \/ 3600);\n const minutes = Math.floor((seconds % 3600) \/ 60);\n const remainingSeconds = Math.floor(seconds % 60);\n \n let formattedTime = '';\n if (hours > 0) formattedTime += `${hours.toString().padStart(2, '0')}:`;\n formattedTime += `${minutes.toString().padStart(2, '0')}:${remainingSeconds.toString().padStart(2, '0')}`;\n \n return formattedTime;\n }\n\n async function extractPages(baseUrl) {\n if (baseUrl.startsWith(FORBIDDEN_DOMAIN)) {\n alert(\"L'extraction n'est pas autoris\u00e9e pour ce domaine.\");\n return 0;\n }\n\n const visitedUrls = new Set();\n const urlsToVisit = [baseUrl];\n let extractedCount = 0;\n let firstPageExtracted = false;\n let startTime = Date.now();\n\n while (urlsToVisit.length > 0) {\n const currentUrl = urlsToVisit.shift();\n if (visitedUrls.has(currentUrl)) continue;\n\n try {\n const html = await fetchPage(currentUrl);\n const title = getPageTitle(html);\n const description = getMetaDescription(html);\n addPageToCards({ url: currentUrl, title, description }, extractedCount);\n extractedCount++;\n visitedUrls.add(currentUrl);\n\n if (!firstPageExtracted) {\n firstPageExtracted = true;\n hideLoading();\n downloadSelectedBtn.style.display = 'block';\n featureSection.style.display = 'block'; \/\/ Afficher la section des r\u00e9sultats\n }\n\n const newLinks = getInternalLinks(baseUrl, html);\n for (const link of newLinks) {\n if (!visitedUrls.has(link) && !urlsToVisit.includes(link)) {\n urlsToVisit.push(link);\n }\n }\n\n \/\/ Mise \u00e0 jour de la barre de progression et du temps estim\u00e9\n const progress = (extractedCount \/ (extractedCount + urlsToVisit.length)) * 100;\n progressBar.style.width = `${progress}%`;\n progressText.textContent = `${extractedCount} pages extraites sur ${extractedCount + urlsToVisit.length} estim\u00e9es`;\n\n const elapsedTime = (Date.now() - startTime) \/ 1000; \/\/ en secondes\n const averageTimePerPage = elapsedTime \/ extractedCount;\n const remainingPages = urlsToVisit.length;\n const estimatedRemainingTime = averageTimePerPage * remainingPages;\n estimatedTimeElement.textContent = formatTime(estimatedRemainingTime);\n\n } catch (error) {\n console.error(`Erreur lors de l'extraction de ${currentUrl}:`, error);\n }\n }\n\n return extractedCount;\n }\n\n async function downloadAllPages(baseUrl) {\n if (baseUrl.startsWith(FORBIDDEN_DOMAIN)) {\n alert(\"Le t\u00e9l\u00e9chargement n'est pas autoris\u00e9 pour ce domaine.\");\n return;\n }\n\n const visitedUrls = new Set();\n const urlsToVisit = [baseUrl];\n const zip = new JSZip();\n const domainName = extractDomainName(baseUrl);\n let downloadCount = 0;\n let currentZipIndex = 1;\n let currentZip = zip.folder(`${domainName}_${currentZipIndex}`);\n let startTime = Date.now();\n\n showLoading();\n\n while (urlsToVisit.length > 0) {\n const currentUrl = urlsToVisit.shift();\n if (visitedUrls.has(currentUrl)) continue;\n\n try {\n const html = await fetchPage(currentUrl);\n const fileName = currentUrl.replace(\/[^a-z0-9]\/gi, '_').toLowerCase() + '.html';\n currentZip.file(fileName, html);\n downloadCount++;\n visitedUrls.add(currentUrl);\n\n if (downloadCount % 8 === 0) {\n \/\/ G\u00e9n\u00e9rer et t\u00e9l\u00e9charger le ZIP actuel\n const zipBlob = await currentZip.generateAsync({type: 'blob'});\n const zipUrl = URL.createObjectURL(zipBlob);\n const link = document.createElement('a');\n link.href = zipUrl;\n link.download = `${domainName}_${currentZipIndex}.zip`;\n document.body.appendChild(link);\n link.click();\n document.body.removeChild(link);\n\n \/\/ Cr\u00e9er un nouveau ZIP pour les 8 prochaines pages\n currentZipIndex++;\n currentZip = zip.folder(`${domainName}_${currentZipIndex}`);\n }\n\n const newLinks = getInternalLinks(baseUrl, html);\n for (const link of newLinks) {\n if (!visitedUrls.has(link) && !urlsToVisit.includes(link)) {\n urlsToVisit.push(link);\n }\n }\n\n \/\/ Mise \u00e0 jour de la barre de progression et du temps estim\u00e9\n const progress = (downloadCount \/ (downloadCount + urlsToVisit.length)) * 100;\n progressBar.style.width = `${progress}%`;\n progressText.textContent = `${downloadCount} pages t\u00e9l\u00e9charg\u00e9es sur ${downloadCount + urlsToVisit.length} estim\u00e9es`;\n\n const elapsedTime = (Date.now() - startTime) \/ 1000; \/\/ en secondes\n const averageTimePerPage = elapsedTime \/ downloadCount;\n const remainingPages = urlsToVisit.length;\n const estimatedRemainingTime = averageTimePerPage * remainingPages;\n estimatedTimeElement.textContent = formatTime(estimatedRemainingTime);\n\n } catch (error) {\n console.error(`Erreur lors du t\u00e9l\u00e9chargement de ${currentUrl}:`, error);\n }\n }\n\n \/\/ T\u00e9l\u00e9charger le dernier ZIP s'il contient des fichiers\n if (downloadCount % 8 !== 0) {\n const zipBlob = await currentZip.generateAsync({type: 'blob'});\n const zipUrl = URL.createObjectURL(zipBlob);\n const link = document.createElement('a');\n link.href = zipUrl;\n link.download = `${domainName}_${currentZipIndex}.zip`;\n document.body.appendChild(link);\n link.click();\n document.body.removeChild(link);\n }\n\n hideLoading();\n alert(`T\u00e9l\u00e9chargement termin\u00e9 ! ${downloadCount} pages ont \u00e9t\u00e9 t\u00e9l\u00e9charg\u00e9es.`);\n }\n\n extractBtn.addEventListener('click', async () => {\n const url = normalizeUrl(urlInput.value);\n if (!url) {\n alert('Veuillez entrer une URL valide');\n return;\n }\n\n cardsContainer.innerHTML = '';\n showLoading();\n progressBar.style.width = '0%';\n progressText.textContent = '';\n estimatedTimeElement.textContent = '00:00';\n\n const extractedCount = await extractPages(url);\n hideLoading();\n alert(`Extraction termin\u00e9e ! ${extractedCount} pages ont \u00e9t\u00e9 extraites.`);\n });\n\n downloadAllBtn.addEventListener('click', async () => {\n const url = normalizeUrl(urlInput.value);\n if (!url) {\n alert('Veuillez entrer une URL valide');\n return;\n }\n\n await downloadAllPages(url);\n });\n\n selectAllBtn.addEventListener('click', () => {\n const checkboxes = document.querySelectorAll('.card-checkbox input[type=\"checkbox\"]');\n const allChecked = Array.from(checkboxes).every(cb => cb.checked);\n checkboxes.forEach(cb => cb.checked = !allChecked);\n });\n\n downloadSelectedBtn.addEventListener('click', async () => {\n const selectedCheckboxes = document.querySelectorAll('.card-checkbox input[type=\"checkbox\"]:checked');\n if (selectedCheckboxes.length === 0) {\n alert('Veuillez s\u00e9lectionner au moins une page \u00e0 t\u00e9l\u00e9charger.');\n return;\n }\n\n showLoading();\n\n const zip = new JSZip();\n const domainName = extractDomainName(urlInput.value);\n let downloadCount = 0;\n let currentZipIndex = 1;\n let currentZip = zip.folder(`${domainName}_${currentZipIndex}`);\n\n for (const checkbox of selectedCheckboxes) {\n const url = checkbox.dataset.url;\n try {\n const html = await fetchPage(url);\n const fileName = url.replace(\/[^a-z0-9]\/gi, '_').toLowerCase() + '.html';\n currentZip.file(fileName, html);\n downloadCount++;\n\n if (downloadCount % 8 === 0) {\n \/\/ G\u00e9n\u00e9rer et t\u00e9l\u00e9charger le ZIP actuel\n const zipBlob = await currentZip.generateAsync({type: 'blob'});\n const zipUrl = URL.createObjectURL(zipBlob);\n const link = document.createElement('a');\n link.href = zipUrl;\n link.download = `${domainName}_${currentZipIndex}.zip`;\n document.body.appendChild(link);\n link.click();\n document.body.removeChild(link);\n\n \/\/ Cr\u00e9er un nouveau ZIP pour les 8 prochaines pages\n currentZipIndex++;\n currentZip = zip.folder(`${domainName}_${currentZipIndex}`);\n }\n } catch (error) {\n console.error(`Erreur lors du t\u00e9l\u00e9chargement de ${url}:`, error);\n }\n }\n\n \/\/ T\u00e9l\u00e9charger le dernier ZIP s'il contient des fichiers\n if (downloadCount % 8 !== 0) {\n const zipBlob = await currentZip.generateAsync({type: 'blob'});\n const zipUrl = URL.createObjectURL(zipBlob);\n const link = document.createElement('a');\n link.href = zipUrl;\n link.download = `${domainName}_${currentZipIndex}.zip`;\n document.body.appendChild(link);\n link.click();\n document.body.removeChild(link);\n }\n\n hideLoading();\n alert(`T\u00e9l\u00e9chargement termin\u00e9 ! ${downloadCount} pages ont \u00e9t\u00e9 t\u00e9l\u00e9charg\u00e9es.`);\n });\n\n themeToggle.addEventListener('click', () => {\n document.body.classList.toggle('dark-theme');\n themeToggle.textContent = document.body.classList.contains('dark-theme') ? '\ud83c\udf1e' : '\ud83c\udf34';\n\n \/\/ Change matrix background color based on theme\n if (document.body.classList.contains('dark-theme')) {\n canvas.style.backgroundColor = '#000'; \/\/ Set background color to black in dark mode\n } else {\n canvas.style.backgroundColor = 'transparent'; \/\/ Set background color to transparent in light mode\n }\n });\n\n \/\/ Matrix animation\n let width = canvas.width = window.innerWidth;\n let height = canvas.height = window.innerHeight;\n\n const columns = Math.floor(width \/ 20);\n const drops = [];\n\n for (let i = 0; i < columns; i++) {\n drops[i] = 1;\n }\n\n const matrix = '0101010101010101010101010101010101010101010101010101';\n\n function drawMatrix() {\n ctx.fillStyle = document.body.classList.contains('dark-theme') ? 'rgba(0, 0, 0, 1)' : 'rgba(52, 152, 219, 0.1)'; \/\/ Change fill style based on theme\n ctx.fillRect(0, 0, width, height);\n\n ctx.fillStyle = '#fff'; \/* Couleur blanche pour le texte *\/\n ctx.font = '15px monospace';\n\n for (let i = 0; i < drops.length; i++) {\n const text = matrix[Math.floor(Math.random() * matrix.length)];\n ctx.fillText(text, i * 20, drops[i] * 20);\n\n if (drops[i] * 20 > height && Math.random() > 0.975) {\n drops[i] = 0;\n }\n drops[i]++;\n }\n }\n\n setInterval(drawMatrix, 50);\n\n window.addEventListener('resize', () => {\n width = canvas.width = window.innerWidth;\n height = canvas.height = window.innerHeight;\n });\n <\/script>\n<\/body>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Pacific Web Extractor – Extraction Dynamique du Site Pacific Web Extractor: Votre Extracteur de Code Multi-Pages Pacific Web Extractor r\u00e9volutionne l’exploration du web en permettant l’extraction rapide et efficace du contenu de sites entiers. Cet outil puissant offre aux d\u00e9veloppeurs, chercheurs et professionnels du marketing digital la possibilit\u00e9 d’analyser, archiver et exploiter des donn\u00e9es web […]<\/p>\n","protected":false},"author":1,"featured_media":795,"comment_status":"open","ping_status":"open","sticky":false,"template":"elementor_header_footer","format":"standard","meta":{"footnotes":""},"categories":[4],"tags":[],"class_list":["post-788","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-web-ressources"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v25.6 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Extraire le code HTML CSS Js d'un site web entier - Web Extractor<\/title>\n<meta name=\"description\" content=\"Extraire le HTML, CSS, JS de sites entiers en 3 clics ! Inspirez-vous des plus beaux sites internet gr\u00e2ce \u00e0 notre outil pour d\u00e9veloppeur Web.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/pacific-webtools.com\/web-extractor\/extracteur-site-entier-html-css-js\/\" \/>\n<meta property=\"og:locale\" content=\"fr_FR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Extraire le code HTML CSS Js d'un site web entier - Web Extractor\" \/>\n<meta property=\"og:description\" content=\"Extraire le HTML, CSS, JS de sites entiers en 3 clics ! Inspirez-vous des plus beaux sites internet gr\u00e2ce \u00e0 notre outil pour d\u00e9veloppeur Web.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/pacific-webtools.com\/web-extractor\/extracteur-site-entier-html-css-js\/\" \/>\n<meta property=\"og:site_name\" content=\"Web Extractor\" \/>\n<meta property=\"article:published_time\" content=\"2024-09-03T09:14:57+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2024-09-03T09:48:15+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/pacific-webtools.com\/web-extractor\/wp-content\/uploads\/2024\/09\/Extraction-code-html-css-js-fullwebsite.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1380\" \/>\n\t<meta property=\"og:image:height\" content=\"920\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"admin\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"\u00c9crit par\" \/>\n\t<meta name=\"twitter:data1\" content=\"admin\" \/>\n\t<meta name=\"twitter:label2\" content=\"Dur\u00e9e de lecture estim\u00e9e\" \/>\n\t<meta name=\"twitter:data2\" content=\"2 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/pacific-webtools.com\/web-extractor\/extracteur-site-entier-html-css-js\/\",\"url\":\"https:\/\/pacific-webtools.com\/web-extractor\/extracteur-site-entier-html-css-js\/\",\"name\":\"Extraire le code HTML CSS Js d'un site web entier - Web Extractor\",\"isPartOf\":{\"@id\":\"https:\/\/pacific-webtools.com\/web-extractor\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/pacific-webtools.com\/web-extractor\/extracteur-site-entier-html-css-js\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/pacific-webtools.com\/web-extractor\/extracteur-site-entier-html-css-js\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/pacific-webtools.com\/web-extractor\/wp-content\/uploads\/2024\/09\/Extraction-code-html-css-js-fullwebsite.webp\",\"datePublished\":\"2024-09-03T09:14:57+00:00\",\"dateModified\":\"2024-09-03T09:48:15+00:00\",\"author\":{\"@id\":\"https:\/\/pacific-webtools.com\/web-extractor\/#\/schema\/person\/0f95670ed0b3b265a488dae146fdda48\"},\"description\":\"Extraire le HTML, CSS, JS de sites entiers en 3 clics ! Inspirez-vous des plus beaux sites internet gr\u00e2ce \u00e0 notre outil pour d\u00e9veloppeur Web.\",\"breadcrumb\":{\"@id\":\"https:\/\/pacific-webtools.com\/web-extractor\/extracteur-site-entier-html-css-js\/#breadcrumb\"},\"inLanguage\":\"fr-FR\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/pacific-webtools.com\/web-extractor\/extracteur-site-entier-html-css-js\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\/\/pacific-webtools.com\/web-extractor\/extracteur-site-entier-html-css-js\/#primaryimage\",\"url\":\"https:\/\/pacific-webtools.com\/web-extractor\/wp-content\/uploads\/2024\/09\/Extraction-code-html-css-js-fullwebsite.webp\",\"contentUrl\":\"https:\/\/pacific-webtools.com\/web-extractor\/wp-content\/uploads\/2024\/09\/Extraction-code-html-css-js-fullwebsite.webp\",\"width\":1380,\"height\":920,\"caption\":\"Exemple de code HTML, CSS et JavaScript extrait d'un site web complet.\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/pacific-webtools.com\/web-extractor\/extracteur-site-entier-html-css-js\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/pacific-webtools.com\/web-extractor\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Extraire le code HTML CSS Js d’un site web entier\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/pacific-webtools.com\/web-extractor\/#website\",\"url\":\"https:\/\/pacific-webtools.com\/web-extractor\/\",\"name\":\"Web Extractor\",\"description\":\"Extracteur de Code\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/pacific-webtools.com\/web-extractor\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"fr-FR\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/pacific-webtools.com\/web-extractor\/#\/schema\/person\/0f95670ed0b3b265a488dae146fdda48\",\"name\":\"admin\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"fr-FR\",\"@id\":\"https:\/\/pacific-webtools.com\/web-extractor\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/94a5a2d7ac834dce40e1e25743dcb576?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/94a5a2d7ac834dce40e1e25743dcb576?s=96&d=mm&r=g\",\"caption\":\"admin\"},\"sameAs\":[\"https:\/\/pacific-webtools.com\/web-extractor\"],\"url\":\"https:\/\/pacific-webtools.com\/web-extractor\/author\/admin\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Extraire le code HTML CSS Js d'un site web entier - Web Extractor","description":"Extraire le HTML, CSS, JS de sites entiers en 3 clics ! Inspirez-vous des plus beaux sites internet gr\u00e2ce \u00e0 notre outil pour d\u00e9veloppeur Web.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/pacific-webtools.com\/web-extractor\/extracteur-site-entier-html-css-js\/","og_locale":"fr_FR","og_type":"article","og_title":"Extraire le code HTML CSS Js d'un site web entier - Web Extractor","og_description":"Extraire le HTML, CSS, JS de sites entiers en 3 clics ! Inspirez-vous des plus beaux sites internet gr\u00e2ce \u00e0 notre outil pour d\u00e9veloppeur Web.","og_url":"https:\/\/pacific-webtools.com\/web-extractor\/extracteur-site-entier-html-css-js\/","og_site_name":"Web Extractor","article_published_time":"2024-09-03T09:14:57+00:00","article_modified_time":"2024-09-03T09:48:15+00:00","og_image":[{"width":1380,"height":920,"url":"https:\/\/pacific-webtools.com\/web-extractor\/wp-content\/uploads\/2024\/09\/Extraction-code-html-css-js-fullwebsite.jpg","type":"image\/jpeg"}],"author":"admin","twitter_card":"summary_large_image","twitter_misc":{"\u00c9crit par":"admin","Dur\u00e9e de lecture estim\u00e9e":"2 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/pacific-webtools.com\/web-extractor\/extracteur-site-entier-html-css-js\/","url":"https:\/\/pacific-webtools.com\/web-extractor\/extracteur-site-entier-html-css-js\/","name":"Extraire le code HTML CSS Js d'un site web entier - Web Extractor","isPartOf":{"@id":"https:\/\/pacific-webtools.com\/web-extractor\/#website"},"primaryImageOfPage":{"@id":"https:\/\/pacific-webtools.com\/web-extractor\/extracteur-site-entier-html-css-js\/#primaryimage"},"image":{"@id":"https:\/\/pacific-webtools.com\/web-extractor\/extracteur-site-entier-html-css-js\/#primaryimage"},"thumbnailUrl":"https:\/\/pacific-webtools.com\/web-extractor\/wp-content\/uploads\/2024\/09\/Extraction-code-html-css-js-fullwebsite.webp","datePublished":"2024-09-03T09:14:57+00:00","dateModified":"2024-09-03T09:48:15+00:00","author":{"@id":"https:\/\/pacific-webtools.com\/web-extractor\/#\/schema\/person\/0f95670ed0b3b265a488dae146fdda48"},"description":"Extraire le HTML, CSS, JS de sites entiers en 3 clics ! Inspirez-vous des plus beaux sites internet gr\u00e2ce \u00e0 notre outil pour d\u00e9veloppeur Web.","breadcrumb":{"@id":"https:\/\/pacific-webtools.com\/web-extractor\/extracteur-site-entier-html-css-js\/#breadcrumb"},"inLanguage":"fr-FR","potentialAction":[{"@type":"ReadAction","target":["https:\/\/pacific-webtools.com\/web-extractor\/extracteur-site-entier-html-css-js\/"]}]},{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/pacific-webtools.com\/web-extractor\/extracteur-site-entier-html-css-js\/#primaryimage","url":"https:\/\/pacific-webtools.com\/web-extractor\/wp-content\/uploads\/2024\/09\/Extraction-code-html-css-js-fullwebsite.webp","contentUrl":"https:\/\/pacific-webtools.com\/web-extractor\/wp-content\/uploads\/2024\/09\/Extraction-code-html-css-js-fullwebsite.webp","width":1380,"height":920,"caption":"Exemple de code HTML, CSS et JavaScript extrait d'un site web complet."},{"@type":"BreadcrumbList","@id":"https:\/\/pacific-webtools.com\/web-extractor\/extracteur-site-entier-html-css-js\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/pacific-webtools.com\/web-extractor\/"},{"@type":"ListItem","position":2,"name":"Extraire le code HTML CSS Js d’un site web entier"}]},{"@type":"WebSite","@id":"https:\/\/pacific-webtools.com\/web-extractor\/#website","url":"https:\/\/pacific-webtools.com\/web-extractor\/","name":"Web Extractor","description":"Extracteur de Code","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/pacific-webtools.com\/web-extractor\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"fr-FR"},{"@type":"Person","@id":"https:\/\/pacific-webtools.com\/web-extractor\/#\/schema\/person\/0f95670ed0b3b265a488dae146fdda48","name":"admin","image":{"@type":"ImageObject","inLanguage":"fr-FR","@id":"https:\/\/pacific-webtools.com\/web-extractor\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/94a5a2d7ac834dce40e1e25743dcb576?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/94a5a2d7ac834dce40e1e25743dcb576?s=96&d=mm&r=g","caption":"admin"},"sameAs":["https:\/\/pacific-webtools.com\/web-extractor"],"url":"https:\/\/pacific-webtools.com\/web-extractor\/author\/admin\/"}]}},"_links":{"self":[{"href":"https:\/\/pacific-webtools.com\/web-extractor\/wp-json\/wp\/v2\/posts\/788"}],"collection":[{"href":"https:\/\/pacific-webtools.com\/web-extractor\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/pacific-webtools.com\/web-extractor\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/pacific-webtools.com\/web-extractor\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/pacific-webtools.com\/web-extractor\/wp-json\/wp\/v2\/comments?post=788"}],"version-history":[{"count":5,"href":"https:\/\/pacific-webtools.com\/web-extractor\/wp-json\/wp\/v2\/posts\/788\/revisions"}],"predecessor-version":[{"id":793,"href":"https:\/\/pacific-webtools.com\/web-extractor\/wp-json\/wp\/v2\/posts\/788\/revisions\/793"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/pacific-webtools.com\/web-extractor\/wp-json\/wp\/v2\/media\/795"}],"wp:attachment":[{"href":"https:\/\/pacific-webtools.com\/web-extractor\/wp-json\/wp\/v2\/media?parent=788"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/pacific-webtools.com\/web-extractor\/wp-json\/wp\/v2\/categories?post=788"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/pacific-webtools.com\/web-extractor\/wp-json\/wp\/v2\/tags?post=788"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}