如何在没有 iframe 的情况下呈现要放置在第三方网页的 div 中的 HTML 文本？

Question

I want to generate html as well as SVG code based on my Subsciber`s any of the position of on web page (or you can say any of the div).我想根据我的订阅者在网页上的任何位置（或者你可以说任何一个 div）生成 html 和 SVG 代码。

I want to give some javascript code to be put in side of that page`s div so at that div whole my code place.我想将一些 javascript 代码放在该页面的 div 旁边，以便在该 div 整个我的代码位置。

I don't want to use iframe because height and width is not defined its automated.我不想使用 iframe，因为高度和宽度不是自动定义的。

here what i have tried and i am still trying.这是我尝试过的，我仍在尝试。

<html>
    <head>
        <title>TODO supply a title</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
    </head>
    <body>
        <div>TODO write content</div>        
        <div>

            <script>

                (function(){
                    var xhr=new XMLHttpRequest();

                    xhr.open("get","request Url of my side",true);
                    xhr.send();

                    xhr.onreadystatechange = function(){ 
                        if(xhr.readyState==4 && xhr.status==200){
                            document.write(xhr.responseText);
                        }
                    };
                }());

            </script>

        </div>   
    </body>
</html>

But what happening here is before response came whole page was loaded and document.write() erase existing content and place my responseText .但是这里发生的事情是在响应来之前加载整个页面并且document.write()删除现有内容并放置我的responseText 。

Any Help will be appreciated.任何帮助将不胜感激。

Answer 1

JQuery solution. jQuery 解决方案。 You can write similar in pure java, but its a bit harder.你可以用纯 Java 写类似的东西，但它有点难。 Inside <div id="results"></div> you will get your response.在<div id="results"></div>你会得到你的回应。

$.ajax({
  url: "test.html",
  cache: false
})
  .done(function( html ) {
    $( "#results" ).append( html );
  });

Reference: http://api.jquery.com/jquery.ajax/参考： http : //api.jquery.com/jquery.ajax/

EDIT: Pure Javascript solution:编辑：纯 Javascript 解决方案：

Async=true:异步=真：

xhttp.onreadystatechange = function() {
  if (xhttp.readyState == 4 && xhttp.status == 200) {
    document.getElementById("results").innerHTML = xhttp.responseText;
  }
};
xhttp.open("GET", "test.html", true);
xhttp.send();

Async=false:异步=假：

xhttp.open("GET", "test.html", false);
xhttp.send();
document.getElementById("results").innerHTML = xhttp.responseText;

Reference: http://www.w3schools.com/ajax/ajax_xmlhttprequest_send.asp参考： http : //www.w3schools.com/ajax/ajax_xmlhttprequest_send.asp

Answer 2

its just take me long time to find document.scripts我只是花了很长时间才找到 document.scripts

<html>
    <head>
        <title>TODO supply a title</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
    </head>
    <body>
        <div>TODO write content</div> 
        Here Is The Code
        <div>
        <script>
            (function(t){
                var xhr=new XMLHttpRequest();xhr.open("get","request url",true);xhr.send();
                xhr.onreadystatechange=function(){ if(xhr.readyState==4 && xhr.status==200){ 
                        document.scripts[document.scripts.length-1].parentNode.innerHTML=xhr.responseText;}}
                 }(this));
        </script>
        </div>

    </body>
</html>

如何在没有 iframe 的情况下呈现要放置在第三方网页的 div 中的 HTML 文本？

问题描述

2 个解决方案

解决方案1
1 2016-05-05 11:00:44

解决方案2
0 已采纳 2016-05-05 12:07:12

如何在没有 iframe 的情况下呈现要放置在第三方网页的 div 中的 HTML 文本？

问题描述

2 个解决方案

解决方案1 1 2016-05-05 11:00:44

解决方案2 0 已采纳 2016-05-05 12:07:12

解决方案1
1 2016-05-05 11:00:44

解决方案2
0 已采纳 2016-05-05 12:07:12