JS文件中加载jquery.js

原文链接:http://blog.csdn.net/whatday/article/details/39553451

最近有一个需求:

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

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

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

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

1.js

[javascript] view plain copy

  1. // by firefoxmmx
  2. var script=document.createElement("script");
  3. script.type="text/javascript";
  4. script.src="jquery.js";
  5. document.getElementsByTagName(‘head‘)[0].appendChild(script);
  6. setTimeout(function(){
  7. $(document).ready(function(){
  8. $("#bt").click(function(){
  9. alert(‘Hello World‘);
  10. });
  11. });
  12. },100);

其中1.html代码如下:

[html] view plain copy

  1. <html>
  2. <head>
  3. <script type="text/javascript" src="1.js"></script>
  4. </head>
  5. <body>
  6. <input type="button" id="bt" value="Click" />
  7. </body>
  8. </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通信了~
时间: 2024-11-09 09:07:16

JS文件中加载jquery.js的相关文章

在HTML文件中加载js

js加载只分为两种: 1.全局js,放在<head>标签里面,整个页面很多都用到的,它是优先加载的. 2.局部js,放在</html>结束标签以内的任何位置,它是第二加载的. 在HTML文件中加载js,布布扣,bubuko.com

js文件最后加载(在window.load事件发生后再加载js文件),用于解决因jQuery等js库导致网页加载慢的问题

需引入文件:lazyload-min.js <script src="JS/lazyload-min.js" type="text/javascript"></script> 插入代码: function loadscript() { LazyLoad.loadOnce([ 'JS/touch.js', 'http://libs.baidu.com/jquery/1.2.3/jquery.min.js' ], loadComplete); }

实现异步加载js文件及加载完成后回调

模块化工具类实现方式 基于AMD.CMD模式的JS模块化管理工具越来越流行,这些工具通常只需在页面中加载对应的工具JS,其他JS文件都是异步加载的,比如RequireJS就可以象下面这样做. 首先在页面加载 <script data-main="scripts/main.js" src="scripts/require.js"></script> 然后工具会自动识别data-main属性值,并加载对应的JS文件,在main.js可以加载更多模

js如何判断引入的js文件是否加载完毕

js如何判断引入的js文件是否加载完毕:如果javascript代码较少的话完全可以将js代码通过<script></script>标签写在当前页面,但是如果js代码非常庞大的话,那么页面将会变得非常的臃肿,并且由于js代码是同步加载,所以当js代码加载的时候,会阻塞下面内容的解析,所以最好能够动态加载js功能,尤其是能够实现根据需要动态引入外部js文件.由于动态加载js文件是异步的,所以有时候需要判断js文件是否加载完毕,下面就通过代码介绍一下如何实现判断功能.代码如下: fun

js判断异步引入的js文件是否加载完毕

在正常的加载过程中,js的加载都是同步的,也就是在加载过程中,浏览器会阻塞接下来的内容的加载.这时候我们就要用到动态加载,动态加载是异步的,如果我们在后边要用到这个动态加载的js文件里的东西,就要保证这个文件加载完成后,再执行下面的内容. 如何判断js是否加载完成?(实现loadScript(url,callback)异步加载脚本,完成后执行回调函数,要求支持IE) <!DOCTYPE html> <html> <head> <meta charset="

vue中加载three.js的gltf模型

vue中加载three.js的gltf模型 一.开始引入three.js相关插件.首先利用淘宝镜像,操作命令为: cnpm install three //npm install three也行 二.three.js中所有的控件插件,都可以在node_modules下面的three里面找到 三.安装好以后,在页面中引入three.js并使用:在所调用页面引入的代码为 import * as THREE from "three"; import { GLTFLoader } from &

JS文件中引用另一个JS文件

1.生产项目上遇到一个Bug,需要修改JS文件,添加Jquery代码,但是原来的页面没有添加对Jquery文件的引用,无法修改原来的页面(自动生成的HTML) 这就需要在JS文件中添加对Jquery文件的引用.. 而且是先引用Jquery,再把添加的代码放到a.js中,后引用a.js document.write("<script language=javascript src='/Scripts/jquery-1.4.1.min.js'></script>")

七. 从文件中加载数据

从文件中加载数据有两种方法,一种是利用内置的csv模块,一种是利用第三方模块numpy import matplotlib.pyplot as plt import csv import numpy as np # csv 方法 x = [] y = [] with open('example.txt','r') as csvfile: plots = csv.reader(csvfile, delimiter=',') for row in plots: x.append(int(row[0]

Android中layout.xml文件中加载自定义的View类

<com.bn.summer.GGView3 android:layout_width="100dip" android:layout_height="114dip" android:layout_marginLeft="11dip" /> View类的实现: package com.bn.summer; import android.content.Context; import android.content.res.Resour