从外部HTML文档中获取文本

Get the text from an external HTML document

本文关键字：获取 取文本 文档 HTML 从外部      更新时间：2023-09-26

我的目标是从HTML文档中获取文本，该文档不调用.jsp文件中的任何函数。

我环顾四周，以为我已经找到了问题的答案，但它似乎不起作用，其他答案包括使用jQuery（我既不熟悉也不允许使用）。

这是我迄今为止的代码：

function getText(divID) {
    var w = window.open("test.html");
    var body = w.document.body;
    var div = document.getElementById(divID);
    var textContent = body.textContent || body.innerText;
    console.log(textContent);
    //div.appendChild(document.createTextNode(textContent));
}

正如您所看到的，我正在尝试获取一个HTML文档的正文，并将其显示在另一个文档中。我走对了吗？

编辑：好的，所以我似乎把我的问题弄得很困惑。我调用了一个名为html.html的HTML文档中的函数，但我想从test.html中获取文本，然后将其显示在html.html中。它必须是这样的，因为我不能假设我想从中读取的HTML文档会在其头部包含我的.jsp文件。

目前我出现以下错误。

未捕获的类型错误：无法读取未定义的属性"body"

其他window中的document.body是undefined的原因是因为其他window尚未加载和呈现文档。

一种解决方案是等待onload事件。

function getText(divID) {
    var w = window.open("test.html");
    w.addEventListener("load", function() {
        var body = w.document.body;
        var div = document.getElementById(divID);
        var textContent = body.textContent || body.innerText;
        console.log(textContent);
    });
}

确保在用户事件（如单击）上运行getText函数，否则window.open将失败。

如果您只想获取另一个窗口的内容，那么使用AJAX可能是一个更好的选择。

function getText(divID) {
    var xhr = new XMLHttpRequest();
    xhr.onreadystatechange = function() {
        if (xhr.readyState == 4 ) {
            var body = xhr.response.body;
            var div = document.getElementById(divID);
            var textContent = body.textContent || body.innerText;
            console.log(textContent);
        }
    };
    xhr.open("GET", "test.html", true);
    xhr.responseType = "document";
    xhr.send();
}
相关文章：