如何從 html 中提取特定元素

Question

我正在嘗試使用我擁有的功能從 html 中提取一個元素。

document.querySelector('#get_html').addEventListener('click', function () {
    var url = document.querySelector('#url_html');



    var request = new XMLHttpRequest();
    request.open("GET", url.value);
    request.send();

    request.onload = function() {
       console.log(request.response);
    };

})

我有一個輸入，我在其中放置了頁面的 url，該函數為我提供了頁面的完整 html

<!DOCTYPE html>
<html lang="en">
    <head>
      <meta charset="UTF-8">
      <meta http-equiv="X-UA-Compatible" content="IE=edge">
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <title>Document</title>
    </head>
    <body>
      <div class="offer">
           <div class="card"></div>
           <div class="card"></div>
           <div class="card"></div>
           <div class="card"></div>
      </div>
    </body>
</html>

這是它扔給我的 html，現在我想要的是用 offer 類提取那個 div 元素

Answer 1

您可以使用parseFromString將響應中的字符串轉換為可以查詢 DOM 的格式。

 var responseText = `<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <div class="offer"> <div class="card"></div> <div class="card"></div> <div class="card"></div> <div class="card"></div> </div> </body> </html>`; const parser = new DOMParser(); const doc = parser.parseFromString(responseText, "text/html"); console.log(doc.querySelector(".offer"));

如何從 html 中提取特定元素

問題描述

1 個解決方案

解決方案1
2 已采納 2022-07-06 16:46:16

如何從 html 中提取特定元素

問題描述

1 個解決方案

解決方案1 2 已采納 2022-07-06 16:46:16

解決方案1
2 已采納 2022-07-06 16:46:16