2013-07-23 10 views
10

Dies ist the test case.alert() aufgerufen neues Fenster scheint von der ursprünglichen Seite aufgerufen werden, wenn jQuery Methoden verwenden

Mit JavaScript:

$('.js').on('click', function() { 
    var newwindow = window.open(); 
    newwindow.document.write('<span>test</span>'); 
    newwindow.document.write('<scr' + 'ipt>alert(1)</scr' + 'ipt>'); 
}); 

Dies gibt das erwartete Ergebnis: Der Dialog Alarm wird im neuen Fenster angezeigt wird.

Mit jQuery:

$('.jquery').on('click', function() { 
    var newwindow = window.open(); 
    $(newwindow.document.body).append('<span>test</span>', '<scr' + 'ipt>alert(1)</scr' + 'ipt>'); 
}); 

Der Dialog Warnung wird in der Haupt-Seite gezeigt.

Warum der Unterschied? Fehle ich hier etwas?

Dieses Verhalten wurde in Chrom/FF/Safari/IE getestet

EDIT

Wie mishik wies darauf hin, ist dies darauf zurückzuführen, wie jQuery Script-Tags behandelt, die globalEval Methode um Skripte im globalen Kontext auszuführen. So eine mögliche Abhilfe für jQuery (aber nicht zurück auf die reine JavaScript-Methode fallen) könnte die newwindow Variable im globalen Kontext zu setzen sein zu und verwenden Sie es so, zB:

$('.jquery').on('click', function() { 
    newwindow = window.open(); 
    $(newwindow.document.body).append('<span>test</span>','<scr' + 'ipt>newwindow.window.alert(1)</scr' + 'ipt>'); 
}); 

DEMO

+0

+1 Ist dies der Grund ist, warum die Leute sagen jQuery schneller als Javascript ist? – Praveen

Antwort

8

Scheint so, als ob jQuery <script> Tags handhabt.

domManip Funktion in jQuery Quellcode:

// Evaluate executable scripts on first document insertion 
for (i = 0; i < hasScripts; i++) { 
    node = scripts[ i ]; 
    if (rscriptType.test(node.type || "") && 
     !jQuery._data(node, "globalEval") && jQuery.contains(doc, node)) { 

     if (node.src) { 
      // Hope ajax is available... 
      jQuery._evalUrl(node.src); 
     } else { 
      jQuery.globalEval((node.text || node.textContent || node.innerHTML || "").replace(rcleanScript, "")); 
     } 
    } 
} 

domManip werden alle <script> Elemente Streifen, bewerten in globalen Kontext und deaktivieren.

domManip wird durch append() Methode aufgerufen:

append: function() { 
    return this.domManip(arguments, function(elem) { 
+0

Hmmmm. Wie löst man das mit jQuery? – Neal

+1

@Neal Fallback zu reinen JavaScript-Methoden. – mishik

+0

+1 Schöne und schnelle Forschung. – Praveen

Verwandte Themen