JS文件中加载jquery.js的实例代码

更新时间：2018年05月05日 16:14:27 作者：whatday

这篇文章主要介绍了JS文件中加载jquery.js的方法，JS文件添加其他JS的实例代码，感兴趣的小伙伴们可以参考一下，具体如下

本文表述了JS文件中加载jquery.js的方法，具有很好的参考价值，希望对大家有所帮助。

最近有一个需求：

1.在一个html中只能引入一个JS文件不能有JS代码和其他JS文件的引入；

2.这个JS文件中还要引入其他的JS文件；

3.所有JS功能都写在这个JS文件中这些代码用到了jquery相关的东东所以这里第一个需要解决的就是怎么引入jquery.js。

在网上搜索了很多方法都不太实用，由于我自己离开WEB多年最后向朋友询问得到以下代码：

1.js

// by firefoxmmx 
var script=document.createElement("script"); 
script.type="text/javascript"; 
script.src="jquery.js"; 
document.getElementsByTagName('head')[0].appendChild(script); 
setTimeout(function(){ 
$(document).ready(function(){ 
 $("#bt").click(function(){ 
  alert('Hello World'); 
 }); 
}); 
},100);

其中1.html代码如下：

<html> 
<head> 
 <script type="text/javascript" src="1.js"></script> 
</head> 
<body> 
<input type="button" id="bt" value="Click" /> 
</body> 
</html>

如要测试还需要加上jquery.js 这个可自行下载

运行后点击按钮效果如图：

下面再附上网上的一些方法：

1、直接document.write

<script language="javascript">
 document.write("<script src='test.js'><\/script>");
</script>

2、动态改变已有script的src属性

<script src='' id="s1"></script>
<script language="javascript">
 s1.src="test.js"
</script>

3、动态创建script元素

<script>
 var oHead = document.getElementsByTagName('HEAD').item(0);
 var oScript= document.createElement("script");
 oScript.type = "text/javascript";
 oScript.src="test.js";
 oHead.appendChild( oScript);
</script>

其实原理就是利用dom动态的引入一个js到文件中来~就能和原有的js通信了~。

以上就是这篇文章的全部内容了，希望本文的内容对大家的学习或者工作具有一定的参考学习价值，如果有疑问大家可以留言交流，谢谢大家对脚本之家的支持。

您可能感兴趣的文章:

js
jquery.js

php去掉json反斜杠的实例讲解
在本篇文章里小编给大家整理了一篇关于php去掉json反斜杠的实例讲解，有兴趣的朋友们可以参考学习下。
2021-10-10
js html css实现复选框全选与反选
这篇文章主要为大家详细介绍了js实现复选框全选与反选，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2016-10-10
深入浅析ES6 Class 中的 super 关键字
本文给大家收藏整理了ES6 Class 中的 super 关键字，非常不错，具有参考借鉴价值，需要的朋友参考下吧
2017-10-10
使用JavaScript实现二值化图像
这篇文章主要为大家详细介绍了使用JavaScript将图像转换为黑白二值图的两种方法,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下
2024-01-01
JS 非图片动态loading效果实现代码
功能说明：譬如在按某个button时，显示消息"Loading”，然后每隔一秒后后面加上"."，至一定数量的"."时如："Loading..."，再重置此消息为"Loading"，继续动态显示，直至按钮事件处理完成。
2010-04-04
移动端触摸滑动插件swiper使用方法详解
这篇文章主要为大家详细介绍了移动端触摸滑动插件swiper的使用方法，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2017-08-08
JS弹出居中的DIV的代码
一直都在想怎么样使弹出的DIV能在任何时候都是居中显示的，刚开始的时候是用CSS样式直接定义好层的位置，但是当页面很长的时候，或是浏览器窗口大小不是固定的时候就不能正确的显示，所以只好用JS来控制DIV的显示位置。
2008-06-06
JavaScript对象创建模式实例汇总
这篇文章主要介绍了JavaScript对象创建模式,结合实例形式总结分析了JavaScript常见的对象创建模式,包括工厂模式、构造函数模式、原型模式、动态原型模式、寄生构造函数模式、稳妥构造函数模式等,需要的朋友可以参考下
2016-10-10
swiper+echarts实现多个仪表盘左右滚动效果
这篇文章主要为大家详细介绍了swiper+echarts实现多个仪表盘左右滚动效果，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2021-06-06
（推荐一个超好的JS函数库）S.Sams Lifexperience ScriptClassLib
（推荐一个超好的JS函数库）S.Sams Lifexperience ScriptClassLib...
2007-04-04