如何从 DOMParser 获取所有 HTML 内容，不包括外部 body 标签？

DOM(文档对象模型)允许我们动态访问和操作 HTML 数据。也可以使用 DOMParser 提取 HTML 文件中的所有文本数据。 DOM 解析器返回一个 HTML/XML/SVG 对象。所有对象都可以使用 JavaScript 中的 []运算符访问。

HTML DOM 对象树：

使用 DOMParser 从 HTML 文档中获取所有文本的步骤：

1. 声明一个 DOMParser 实例。
   句法：

   const parser = new DOMParser();

2. 使用.parseFromString() function解析文档。它需要两个参数，要解析的字符串和文档类型。
   句法：

   const parsedDocument = parser.parseFromString(
           htmlInput, "text/html");

3. 使用 doc.all 元素访问整个 HTML 页面，现在获取存储在^第0^个索引处的根元素。我们还可以使用 getElementByID() 来获取特定元素的内容。
   句法：

   var allText = parsedDocument.all[0].textContent;

最后，我们将使用 doc.all[0] 的 textContent 属性从所有 HTML 元素中获取文本。

例子：

    Geeks for geeks
    
Content to be parsed 

输出：

This is the title 
Geeks for geeks
Content to be parsed

代码：

  

    
        Dom Parser Inner Content
    

  

    
        DomParser to get 
        all HTML content
    
  
    
        Click on the button Below 
        to parse the HTML document
    
  
    
     
  
    
    
        Parse now
    
  
    
  
        // Input HTML string to be parsed
        var htmlInput = `
    <title> This is the title </title>
    <div>
      <span>Geeks for geeks</span>
      <p> Content to be parsed </p>
    </div>
  `;
  
        // Created instance
        const parser = new DOMParser();
  
        // Parsing
        const parsedDocument =
                    parser.parseFromString(
                    htmlInput, "text/html");
  
        // Getting text
        function printOutput() {
  
            var allText = parsedDocument
                     .all[0].textContent;
  
            // Printing on page and console
            document.getElementById("output")
                        .innerHTML = allText;
  
            console.log(parsedDocument
                        .all[0].textContent);
        }
    

  

输出：
在按下按钮之前：

按下按钮后：

还可以使用 getElementsByClassName(‘className’) 和 getElementById(‘IDName’) 检索来自各个组件的文本内容。

将要解析的文档作为字符串并打印结果的 Javascript函数。

function parse(htmlInput) {
  
    // Creating Praser instance
    const parser = new DOMParser();
  
    // Parsing the document using DOM Parser
    // and storing the returned HTML object in
    // a variable
    const parsedDocument = parser
        .parseFromString(htmlInput, "text/html");
  
    // Retrieve all text content from DOM object
    var allText = parsedDocument.all[0].textContent;
  
    // Printing the output to webpage and
    console.log(parsedDocument.all[0].textContent);
}