este es mi html
<!DOCTYPE html> <html lang="en"> <body> <div id='data'></div> </body> </html>Este es un ejemplo de html que quiero buscar
<html amp="" lang="en"> <head>..........</head> <body> <header amp-fx="float-in-top"> <div class="head-container"></div> <div id="lang-list" hidden="" amp-fx="float-in-top"></div> <main class="container"> <article class="post no-sidebar"> <div class="m-card single-page">.........</div> </article> <div class="clear"></div> </main> <footer role="contentinfo" class="site-footer no-padding--important"> <div class="container"></div> </footer> </div> </header> </body> </html>Este es el código que sé cómo obtener y agregar html completo a mi id = 'datos'
const url = `https://www.example.com/`; let response = fetch(url); fetch(url) .then(response => response.text()) .then(html => {document.getElementById('data').append(html)}); .catch((err) => console.log("Can't access " + url + " response. Blocked by browser?" + err));pero no quiero agregar html completo, pero solo quiero obtener class="m-card single-page" de example.com y agregarlo a mi id='data'. no se como por favor aconsejenme gracias
Como enfoque, se podrían usar varias cosas aquí:
const someHTML = '<main><h1>Some HTML with</h1> <div class="m-card single-page">Lorem dolorem</div></main>'; const parser = new DOMParser(); const parsedHTML = parser.parseFromString(someHTML, "text/html"); const partOfHTMLDOM = parsedHTML.querySelector('.m-card.single-page'); const partOfHTMLDOMString = partOfHTMLDOM.outerHTML; console.log({parsedHTML, partOfHTMLDOM, partOfHTMLDOMString});