读取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已经执行，并且"错过了总线"

在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文件。

[编辑]注意对象线。尤其是数据＝"0"；test.txt"；对象的一部分。如果不创建test.txt并在第一行添加一些文本，脚本将无法运行。[结束编辑]

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>