页面加载后加载脚本？
[英]Load scripts after page has loaded?
问题描述
是否可以加载某些脚本，如
<script type="text/javascript" src="somescript.js"></script>
当页面的其余部分已加载？
想象一下，我有一些像这样的大型脚本文件，在加载页面时不需要。 例如，我使用的Google Maps API仅在单击按钮时使用（因此不会在页面加载时使用）。
在处理我头脑中的所有脚本标签之前，是否可以先加载页面的其余部分？
10 个解决方案
解决方案1
43 已采纳 2011-03-30 19:11:38
在JQuery中，您可以在文档就绪时执行此操作
$.getScript("somescript.js", function(){
alert("Script loaded and executed.");
});
解决方案2
14 2011-03-30 19:22:46
有可能的。 我在AJAX密集型网站上做了类似的事情，但我正在加载Google Charts API。 以下是我在页面上单击按钮时用于加载Google Charts API的代码。
function loadGoogleChartsAPI() {
var script = document.createElement("script");
// This script has a callback function that will run when the script has
// finished loading.
script.src = "http://www.google.com/jsapi?callback=loadGraphs";
script.type = "text/javascript";
document.getElementsByTagName("head")[0].appendChild(script);
}
function loadGraphs() {
// Add callback function here.
}
这使用了一个在脚本加载后运行的回调函数。
解决方案3
12 2015-08-11 22:40:46
解决方案4
8 2014-01-29 10:49:27
没有人提到这些？
$(window).load(function(){
// do something
});
要么
$(window).bind("load", function() {
// do something
});
解决方案5
6 2016-07-05 04:20:22
$(document).ready(function() {
var ss = document.createElement("script");
ss.src = "somescript.js";
ss.type = "text/javascript";
document.getElementsByTagName("head")[0].appendChild(ss);
});
解决方案6
1 2019-01-04 01:42:13
请看我的代码。 脚本加载完成后将发生onload事件。 或者会发生错误事件。
function loadJavaScript() {
var script = document.createElement("script");
script.src = "javaScript.js";
script.type = "text/javascript";
script.onload = function () {
console.log('script was loaded successfully');
}
script.onerror = function (e) {
console.error('script.onerror');
}
document.getElementsByTagName("head")[0].appendChild(script);
}
谢谢你的回答 。
解决方案7
1 2011-03-30 19:15:03
解决方案8
0 2018-01-28 12:08:36
要在加载脚本之前允许页面显示，请使用async属性：
<script src="//url/to/script.js" async></script>
要在浏览器中隐藏加载微调器，请在页面加载完成后附加脚本标记：
<script>
document.addEventListener('DOMContentLoaded', function() {
var script = document.createElement('script');
script.src = '//url/to/script.js';
document.getElementsByTagName('body')[0].appendChild(script);
});
</script>
解决方案9
0 2011-03-30 19:11:40
使用jquery的getScript方法！ 或者只是把这个脚本放在页面的末尾？
解决方案10
0 2011-03-30 19:16:00
是的，这是完全可能的。 添加onLoad="foo();" 将事件发送到<body>标记并让它调用您的脚本。 您需要将外部JS包装在一个函数中，并执行以下操作：
//EXTERNAL JS (jsstuff.js)
function Mojo() {
document.getElementById('snacks').style.visibility = "visible";
alert("we are victorious!");
}
//YOUR HTML
<html>
<head>
<script type='text/javascript'></script>
</head>
<body onLoad='Mojo();'>
<div id='snacks'>
<img src='bigdarnimage.png'>
</div>
</body>
</html>
在页面加载几秒钟后加载谷歌分析 javascript
[英]Load google analytics javascript few seconds after the page has loaded
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.