如何在网页中显示.html文件的内容？

问题描述 投票：0回答：4

我有两个html文件Editor.html和Test.html。我想将Test.html文件的源代码放入Editor.html中的内容可编辑div中。我可以简单地使用java脚本吗？

javascript html
4个回答
0
投票

在这种情况下我会尝试使用iframe。您可以使用window.frames完全获取iframe内容：

window.frames['iframe_name'].document.getElementById('div_in_iframe');

你可以通常替换喜欢的内容。

0
投票

通过ajax。

jquery图书馆使ajax轻松工作

   <script src="/jquery.min.js"></script>

   <div id="myeditable" contenteditable="true"></div>

  <script type="text/javascript">

   /* the simplest method in the library */
    $("#myeditable").load("/test.html");

   </script>

还有其他很棒的javascript速记库，就像prototype一样

0
投票

像这样的东西加上你想要的任何格式都应该这样做。也就是说，如果您正在寻找编写代码的方法，然后单击按钮将内容传递给iframe以查看结果。

<html>
<head><title>Test</title></head>

    <script>
    function writer()
    {
    var page = document.getElementById('box').value
    document.getElementById('realbox').contentWindow.document.body.innerHTML = page
    }
    </script>
<body>

    <textarea rows ="50%" cols="100%" id='editbox'></textarea>
    <iframe style="background-color: red;" id='realbox' height="100%" width="100%">/iframe>
    <input type="button" onclick="writer()" value="write">

</body>
</html>
0
投票

您可以使用iframe加载网页，然后使用javascript获取其HTML代码

<iframe src="test.html" style="display:none;" name="myFrame">
</iframe>
<textarea id="result"></textarea>

和javascript是

<script>
var frame = window.frames["myFrame"].document;
var data = frame.getElementsByTagName('html')[0].innerHTML;
    document.getElementById("result").innerHTML = data;
</script>

此代码将有助于获取HTML文件标记内的所有HTML代码（在本例中为test.html）。

但它不会打印标签本身，所以使用：

document.getElementById("result").innerHTML = "<HTML>"+data"</HTML>";

但我建议使用Jquery Library尽可能使用AJAX。

最新问题
© www.soinside.com 2019 - 2024. All rights reserved.