读取 HTML 对象标签中的数据

Question

我在服务器上存储了一个文本文件，在 HTML 中存储了一个对象，如下所示：

<object id="data" type="text/plain" data="test.txt"></object>

如何在Javascript中读取test.txt的内容？我到目前为止是：

var data = document.getElementByID("data");

但我不知道如何读取对象标签内的 HTML 文档。

Answer 1

object 标签必须向服务器发出单独的请求，然后加载该内容。同时，您的 JavaScript 已经执行并且 "misses the bus."

运行您的代码在 object 的 onload 事件中。

然后使用.contentDocument.body.childNodes[0].innerHTML查看文本文件。

var object = document.getElementById("data");
object.onload = function() {
    var data = object.contentDocument.body.childNodes[0].innerHTML;
    // use the data
};

Answer 2

我创建了一个简单的功能和按钮作为示例。只需复制 html 和 js 代码，它应该适合您。只需确保为要导入的对象创建适当的 txt 或 html 文件即可。

function getObjectData()
{
    //alert("getObjectData");
    
    var myData = "";
    var object = document.getElementById("data");
    
    //get data inside object data
    var myData = object.contentDocument.body.childNodes[0].innerHTML;

    alert("myData => " + myData + " <= myData" );
}

#data{
    height: 36px;
    border: solid 1px red;
    /*overflow: hidden;*/
}

<div class="main">
    <object id="data" type="text/plain" data="test.txt"></object>
</div>
<br />
<button onclick="getObjectData()">Get Object Data</button>

读取 HTML 对象标签中的数据

Read data in HTML object tag

javascript

html

object-tag