javascript - How to display content of a .html file in a web page? - Stack Overflow

I have two html files Editor.html and Test.html. I want to get the source code of Test.html file into a

I have two html files Editor.html and Test.html. I want to get the source code of Test.html file into a content editable div in Editor.html. Can I do this simply using java script?

I have two html files Editor.html and Test.html. I want to get the source code of Test.html file into a content editable div in Editor.html. Can I do this simply using java script?

Share Improve this question edited May 22, 2012 at 5:16 user1408470 asked May 21, 2012 at 17:48 user1408470user1408470 1,5153 gold badges16 silver badges21 bronze badges 1
  • I found a solution using HTML5 FileReader API with javascript. dotnetobject./… Thanks for the replies.. – user1408470 Commented May 22, 2012 at 17:19
Add a ment  | 

4 Answers 4

Reset to default 1

I would try to use iframes in that case. You can pletely get the iframe content with window.frames:

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

and you can replace the content of like usually.

via ajax.

the jquery library makes light work of 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>

There are other great javascript shorthand libraries too like prototype

Something like this bined with whatever formatting you would like should do it. That is if you're looking for a way to write code and then click the button to pass the content to the iframe to see what es out.

<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>

You can use an iframe to load the webpage and then get its HTML code using javascript

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

and javascript is

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

This code will help to get all the HTML codes inside the tag of your HTML file (In this case test.html).

But it will not print the tag itself so to do so use:

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

But I remend to use AJAX if possible by using Jquery Library.

发布者:admin,转转请注明出处:http://www.yc00.com/questions/1744747957a4591419.html

相关推荐

发表回复

评论列表(0条)

  • 暂无评论

联系我们

400-800-8888

在线咨询: QQ交谈

邮件:admin@example.com

工作时间:周一至周五,9:30-18:30,节假日休息

关注微信