JS文件中加載jquery.js的實(shí)例代碼

更新時(shí)間：2018年05月05日 16:14:27 作者：whatday

這篇文章主要介紹了JS文件中加載jquery.js的方法，JS文件添加其他JS的實(shí)例代碼，感興趣的小伙伴們可以參考一下，具體如下

本文表述了JS文件中加載jquery.js的方法，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。

最近有一個(gè)需求：

1.在一個(gè)html中只能引入一個(gè)JS文件不能有JS代碼和其他JS文件的引入；

2.這個(gè)JS文件中還要引入其他的JS文件；

3.所有JS功能都寫在這個(gè)JS文件中這些代碼用到了jquery相關(guān)的東東所以這里第一個(gè)需要解決的就是怎么引入jquery.js。

在網(wǎng)上搜索了很多方法都不太實(shí)用，由于我自己離開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>

如要測(cè)試還需要加上jquery.js 這個(gè)可自行下載

運(yùn)行后點(diǎn)擊按鈕效果如圖：

下面再附上網(wǎng)上的一些方法：

1、直接document.write

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

2、動(dòng)態(tài)改變已有script的src屬性

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

3、動(dòng)態(tài)創(chuàng)建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>

其實(shí)原理就是利用dom動(dòng)態(tài)的引入一個(gè)js到文件中來~就能和原有的js通信了~。

以上就是這篇文章的全部內(nèi)容了，希望本文的內(nèi)容對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，如果有疑問大家可以留言交流，謝謝大家對(duì)腳本之家的支持。

您可能感興趣的文章:

js
jquery.js

相關(guān)文章

Bootstrap布局組件應(yīng)用實(shí)例講解
這篇文章主要針對(duì)Bootstrap布局組件應(yīng)用進(jìn)行實(shí)例講解，感興趣的小伙伴們可以參考一下
2016-02-02
bootstrap下拉列表與輸入框組結(jié)合的樣式調(diào)整
輸入框組默認(rèn)是div.input-group。接下來通過本文給大家介紹bootstrap下拉列表與輸入框組結(jié)合的樣式調(diào)整，感興趣的朋友一起看看吧
2016-10-10
Bootstrap基本插件學(xué)習(xí)筆記之Tooltip提示工具(18)
這篇文章主要為大家詳細(xì)介紹了Bootstrap基本插件學(xué)習(xí)筆記之oltip提示工具的相關(guān)資料,具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2016-12-12
canvas實(shí)現(xiàn)圖像布局填充功能
這篇文章主要為大家詳細(xì)介紹了canvas實(shí)現(xiàn)圖像布局填充功能，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2017-02-02
微信小程序獲取地理位置及經(jīng)緯度授權(quán)代碼實(shí)例
這篇文章主要介紹了微信小程序獲取地理位置及經(jīng)緯度授權(quán)代碼實(shí)例,文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下
2019-09-09
詳解JavaScript添加給定的標(biāo)簽選項(xiàng)
這篇文章給大家分享了JavaScript實(shí)現(xiàn)添加給定的標(biāo)簽選項(xiàng)的相關(guān)知識(shí)點(diǎn)內(nèi)容以及代碼實(shí)例，有興趣的朋友們參考下。
2018-09-09
JavaScript強(qiáng)制類型轉(zhuǎn)換和隱式類型轉(zhuǎn)換操作示例
這篇文章主要介紹了JavaScript強(qiáng)制類型轉(zhuǎn)換和隱式類型轉(zhuǎn)換操作,結(jié)合實(shí)例形式分析了javascript字符串、數(shù)字等顯示類型轉(zhuǎn)換,以及運(yùn)算、判斷等情況下的隱式類型轉(zhuǎn)換相關(guān)操作技巧,需要的朋友可以參考下
2019-05-05
JS實(shí)現(xiàn)transform實(shí)現(xiàn)扇子效果
這篇文章主要為大家詳細(xì)介紹了JS實(shí)現(xiàn)transform實(shí)現(xiàn)扇子效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2020-01-01
wavesurfer.js繪制音頻波形圖的實(shí)現(xiàn)
這篇文章主要介紹了wavesurfer.js繪制音頻波形圖的實(shí)現(xiàn)，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
2021-04-04
原生js實(shí)現(xiàn)仿window10系統(tǒng)日歷效果的實(shí)例
下面小編就為大家?guī)硪黄鷍s實(shí)現(xiàn)仿window10系統(tǒng)日歷效果的實(shí)例。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
2017-10-10