JavaScript Document.Write Ersetzt alle Körperinhalte bei Verwendung von AJAX

Ich erstelle einen einfachen Ajax-Aufruf, der den Inhalt einer angegebenen URL abruft und auf die Seite schreibt. Das Problem, das ich habe ist, dass es den gesamten Körper Inhalte mit diesen InformationenJavaScript Document.Write Ersetzt alle Körperinhalte bei Verwendung von AJAX

hier ist die JS ersetzt:

(function(){ 
    var mb = window.mb = {}; 

    function get_ad(url, parameters){ 
     var result = ""; 
     var http_request = false; 

     if (window.XMLHttpRequest) { // Mozilla, Safari,... 
      http_request = new XMLHttpRequest(); 
      if (http_request.overrideMimeType) { 
       http_request.overrideMimeType('text/html'); 
      } 
     } else if (window.ActiveXObject) { // IE 
      var avers = ["Microsoft.XmlHttp", "MSXML2.XmlHttp", "MSXML2.XmlHttp.3.0", "MSXML2.XmlHttp.4.0", "MSXML2.XmlHttp.5.0"]; 
      for (var i = avers.length -1; i >= 0; i--) { 
       try { 
        http_request = new ActiveXObject(avers[i]); 
        if (http_request){ 
         break; 
        } 
       } catch(e) {} 
      } 
     } 
     if (!http_request) { 
      alert('Cannot create XMLHTTP instance'); 
      return false; 
     } 

     http_request.onreadystatechange = function(){ 
               if (http_request.readyState == 4) { 
               if (http_request.status == 200) { 
                gen_output(http_request.responseText); 
               } else { 
                alert('Error'); 
               } 
               } 
              } 

     http_request.open('GET', url + parameters, true); 
     http_request.send(null); 
    } 

    function gen_output(ad_content){ 
     document.write("<div id=\"mb_ad\">"); 
     document.write(ad_content); 
     document.write("</div>"); 
    } 

    get_ad("http://localhost/test/test.html", ""); 
})();

und hier ist der html:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>Untitled Document</title> 
</head> 

<body> 
    i am text before <br/> 
    <script type="text/javascript" src="mb.js"></script> 
    <br /> 
    i am text after 
</body> 
</html>

mit Firebug zu inspizieren, Ich sehe nicht den Text vor oder den Text nach, nur die <div id="mb_ad"> und den Inhalt von der test.html Seite. Wenn ich den Ajax-Anruf entferne und einfach 3 document.writes den Text vor und den Text danach richtig anzeigen. jQuery ist keine Option, ich muss dies ohne die Hilfe einer großen Bibliothek tun, da Größe und Geschwindigkeit von wesentlicher Bedeutung sind.

Quelle

2010-03-02 Russ Bradberry

ich nicht finden kann, was mit Ihrem Code falsch sein könnte, ich denke, es ist mehr Kontrolle benötigen/Unterbrechungspunkt. aber für die "jQuery ist keine Option", stimme ich wirklich nicht zu, 24ko von Javascript (das ist wahrscheinlich zwischengespeichert, wenn Google CDN verwenden) macht wirklich keinen Unterschied auf einer Webseite. Wenn Sie diese starke Anforderung haben, bin ich mir nicht sicher, ob eine Website oder gar eine Netzwerkanwendung eine gute Idee ist. – Mathieu

Darüber hinaus könnten Sie Lightweight-Bibliothek wie DOMAssistant oder ähnliches verwenden. – dusoft

es hat mit der Tatsache zu tun, dass dieses Skript in andere Websites eingefügt wird, so dass eine Bibliothek wie Jquery zu einer Website hinzufügen, die wahrscheinlich andere Bibliotheken oder vielleicht sogar jquery selbst verwendet, wird nur Probleme verursachen. –

Sie können document.write nicht verwenden, nachdem das Dokument vollständig geladen wurde. Wenn Sie dies tun, öffnet der Browser ein neues Dokument, das den aktuellen ersetzt.

Verwenden Sie die innerHTML Eigenschaft HTML-Code innerhalb eines Elements zu setzen:

function gen_output(ad_content){ 
    document.getElementById('mb_ad').innerHTML = ad_content; 
}

Setzen Sie das Element vor dem Skript, so dass Sie sicher sind, dass es existiert, wenn die Callback-Funktion aufgerufen wird:

i am text before 
<div id="mb_ad"></div> 
i am text after 
<script type="text/javascript" src="mb.js"></script>

Es spielt keine Rolle, wo Sie das Skript platzieren, da nichts in das Dokument geschrieben wird, wo es ist.

Quelle

2010-03-02 00:16:09 Guffa

ist es überhaupt möglich zu erreichen, was ich ohne ein separates "div" versuche? Dies sollte etwas sein, das in eine Client-Site eingebettet ist, und ich wurde gebeten, dies mit einem einzigen Script-Aufruf zu tun. –

Ja, Sie könnten document.write verwenden, um das div auf die Seite zu schreiben, bevor Sie den AJAX-Anruf tätigen. – Guffa

das funktioniert super, danke! –

var div = document.createElement('div'); 
div.id = 'mb_ad'; 
div.innerHTML = ad_content;

Jetzt können Sie diesen Knoten anhängen, wo immer Sie möchten.

Quelle

2010-03-02 00:17:02

bei kippen Sie den Remote-Skript steuern Sie so etwas wie so zu schreiben, vielleicht in der Lage:

<script> 
var tmp = document.write; 

document.write = function() { 
    document.getElementById('someId').innerHTML = [].concat.apply([], arguments).join(''); 
}; 
</script> 
<script .....> 
document.write = tmp;

Nun, es ein gemeiner Hack, aber es scheint zu funktionieren ...

Quelle

2011-03-23 18:02:05

Sie verwenden können, <script>document.body.innerHTML+="//Your HTML Code Here";</script>

Quelle

2013-05-19 21:07:56

Same Leon Fedotov Antwort, aber mehr jQuery

{ 
    var old_write = document.write; 

    var $zone = $('.zone.zone_' + name); 
    // redefine document.write in this closure 
    document.write = function() { 
    $zone.append([].concat.apply([], arguments).join('')); 
    }; 
    // OA_output[name] contains dangerous document.write 
    $zone.html(OA_output[name]); 

    document.write = old_write; 
}

Quelle

2015-06-19 07:12:37

I das gleiche Problem mit dem folgenden Code hatte:

$html[] = '<script> 
      if($("#mf_dialogs").length == 0) { 
       document.write("<div id=\"mf_dialogs\"></div>"); 
      } 
      </script>';

Der folgende Code ersetzt document.write effizient:

$html = '<div id="dialogHolder"></div> 
     <script> 
       if($("#mf_dialogs").length == 0) { 
        document.getElementById("dialogHolder").innerHTML="<div id=\"mf_dialogs\"></div>"; 
       } 
     </script>';

Quelle

2017-01-31 10:46:43 kundun

JavaScript Document.Write Ersetzt alle Körperinhalte bei Verwendung von AJAX

Antwort

Verwandte Themen