jquery 在div中编写js脚本

f45qwnt8  于 2023-11-17  发布在  jQuery
关注(0)|答案(6)|浏览(93)

我试图从另一个网站使用jQuery然后文档脚本。写它
这是我的代码

var url = "https://code.jquery.com/jquery-1.10.2.js";
var dam = $.getScript(url);
document.write(dam);

字符串
但是这不起作用!!我在页面上得到的都是[object Object]
没有XHR能实现这一点吗?
jsfiddle

juud5qan

juud5qan1#

不要使用document.writeit does not do what you think it does。它不做的是在文档的末尾写入一些数据。它所做的 * 而是 *,将数据输送到当前的写入流。如果没有写入流,它将创建一个新的,重新设置文档的内容。因此调用document.write(dam)意味着您刚刚擦除了文档。document.write是早期JavaScript时代的低级JS函数,不要使用它
相反,你想使用现代的DOM操作函数,所以在jQuery中,这是这样的:

$(document.head).append($("<script>").attr("src", url));

字符串
哪里

$("<script>")


构建一个新的脚本元素,

$(...).attr("src", url)


将“src”属性设置为您需要的属性,并且:

$(document.head).append(...)


$(document.body).append(...)


如果它是一个带有src属性的普通脚本,它基本上可以去任何地方,如果它是一个应该运行的带有文本内容的脚本,你只能通过document.head来实现。
虽然如果它只是一个你需要加载和运行的脚本,你可以使用getScript,但你不需要做任何其他事情,它只是:

var url = "https://code.jquery.com/jquery-1.10.2.js";
jQuery.getScript(url);


完成后,jQuery将加载脚本并执行它。没有返回任何内容。
当然,你展示的代码是使用jQuery加载jQuery,所以这有点奇怪。如果你只是想在页面上加载jQuery,显然你只需要使用HTML:

<!doctype html>
<html>
  <head>
    ...
  </head>
  <body>
    ...
    <script src="http://https://code.jquery.com/jquery-1.10.2.js"></script>
  </body>
</html>


最后:为什么我们要加载jQuery 1.x而不是2.x?(如果你需要支持IE8:微软甚至不再支持IE8,所以你可能不需要)。
最后,如果我们不想加载脚本,但我们真的只想要它的内容,作为纯文本,在Stackoverflow上只有一百万个答案告诉你如何做到这一点。使用jQuery,那就是:

$.get("http://https://code.jquery.com/jquery-1.10.2.js", function(data) {
  $(document.body).append($("div").text(data));
});

gmol1639

gmol16392#

在页面上执行脚本不是我的目标!.我想得到脚本内容,并把它放在一个div(使用JavaScript -没有XHR),这可能吗?
尝试使用<iframe>元素

<div>
  <iframe width="500" height="250" src="https://code.jquery.com/jquery-1.10.2.js">
  </iframe>
</div>

字符串
jsfiddle http://jsfiddle.net/snygv469/3/

aurhwmvo

aurhwmvo3#

简单点...用我的小提琴
http://jsfiddle.net/wwwfzya7/1/
我用JavaScript创建了一个HTML元素

var url = "https://code.jquery.com/jquery-1.10.2.js";

var script = document.createElement("SCRIPT"); //creates: <script></script>
script.src = url; //creates: <script src="long_jquery_url.js"></script>

document.body.appendChild(script); //adds the javascript-object/html-element to the page.!!!

字符串

y0u0uwnf

y0u0uwnf4#

使用这种方法,它可以解决你的问题。

$.get( "https://code.jquery.com/jquery-1.10.2.js", function( data ) {  
  alert(data);
});

字符串

wnavrhmk

wnavrhmk5#

你可以试试

<script src="http://code.jquery.com/jquery-1.8.3.min.js" ></script>

字符串
然后一个AJAX调用,但它从缓存中拉数据。它看起来像一个AJAX,但当<script>被添加文件进入缓存,然后从缓存中读取在AJAX中。在没有存储在缓存中的情况下,使用普通AJAX读取它。

jQuery.cachedScript = function(url, options) {
    // Allow user to set any option except for dataType, cache, and url
    options = $.extend(options || {}, {
        dataType: "text",
        cache: true,
        url: url
    });
    // Use $.ajax() since it is more flexible than $.getScript
    // Return the jqXHR object so we can chain callbacks
    return jQuery.ajax(options);
};
$(document).on('ready', function() {
    // Usage
    $.cachedScript("http://code.jquery.com/jquery-1.8.3.min.js").done(function(script, textStatus) {
        console.log(script);
    });
});

标准溶液

如果你已经准备好使用AJAX,看看这个fiddle

zour9fqk

zour9fqk6#

如何获取远程文件的内容并将其粘贴到文档上并执行js代码

我猜你想得到写在远程文件上的内容,并想把这些内容写在你的HTML中。要做到这一点,你可以使用load()函数。

要执行此操作,请执行以下步骤:
**1.**创建一个文件index.html,在其中写入以下代码:

<pre id="remote_script"></pre>

 <script>

    $(document).ready(function() {
        //var url = "https://code.jquery.com/jquery-1.10.2.js";
        var url = "remote_script.html";/* For testing*/
        $('#remote_script').load(url,function(){
            eval($('#remote_script').text()); /* to execute the code pasted in #remote_script*/
        });

    });
    </script>

字符串

**2.**创建另一个remote_script.html文件进行测试,在其中写入alert('a');,不带任何<script>标记,并运行上述代码。

相关问题