如何使用jQuery将JavaScript代码添加到现有的iFrame中?

Gan*_*alf 14 html javascript css iframe jquery

我想使用jQuery将JavaScript代码段添加到页面中的现有iFrame中.我有以下代码......

码:

content = "<script>" + js_code + "</script>";

$('#iframe_id').contents().find('body').append(content);
Run Code Online (Sandbox Code Playgroud)

但不知何故,这是行不通的.我检查了一些现有/相关的答案,似乎jQuery不太认可脚本标签为...脚本标签.iFrame位于相同的域/相同的端口/相同的主机中,因此没有关于跨站点脚本等的问题.我该如何解决这个问题?

Jua*_*des 20

问题是,如果您的脚本中包含关闭脚本标记(</script>)并且它过早地关闭脚本标记,则HTML解析器会感到困惑.

解决方案是逃避/进入"<\/script>".这是因为JavaScript,(和其他一些语言)中的字符串,任何无效的转义序列都被忽略,因此"\l"被视为"l",并被"\/"视为"/".但是,HTML解析器不使用反斜杠来逃避它们,因此不会混淆(/sf/users/28397701/).

var scriptTag = "<script>alert(1)<\/script>";
$("#iframe").contents().find("body").append(scriptTag);
Run Code Online (Sandbox Code Playgroud)

原始解决方案

分解关闭标记,这样就不会弄乱HTML解析器.此页面上的其他解决方案可以正常工作,因为它们</script>的代码中始终没有字符串

var scriptTag = "<script>alert(1)<";
scriptTag +=  "/script>";
console.log(scriptTag);
$("#iframe").contents().find("body").append(scriptTag);
Run Code Online (Sandbox Code Playgroud)

http://jsfiddle.net/ALpjZ/2/

  • 只是逃避斜杠:`var scriptTag ="<script> alert(1)<\/script>";` - http://jsfiddle.net/tLHn5/ (5认同)

小智 6

function putScriptInIframes(script, scriptId) {

   var $iframes = $('iframe');
   $iframes.each(function () {
        var thisDoc = this.contentWindow.document;
        if ( ! thisDoc.getElementById(scriptID)) {
            var scriptObj = thisDoc.createElement("script");
            scriptObj.type = "text/javascript";
            scriptObj.id = scriptId;
            scriptObj.innerHTML = script;
            thisDoc.body.appendChild(scriptObj);
        }
    });
}
Run Code Online (Sandbox Code Playgroud)

这是我可以使其工作的最简单方法。


Nei*_*l S 5

var script = "alert('hello world');";
$('#iframe').contents().find('body').append($('<script>').html(script))
Run Code Online (Sandbox Code Playgroud)

小提琴中工作