如何在JS文件中添加jQuery

我有一些特定的代码sorting表。 由于代码在大多数页面中都很常见，所以我想创build一个具有代码的JS文件，所有使用它的页面都可以从这里引用它。

问题是：如何将jQuery和表分类器插件添加到该.js文件？

我尝试了这样的事情：

document.writeln('<script src="/javascripts/jquery.js" type="text/javascript"></script>'); document.writeln('<script type="text/javascript" src="/javascripts/jquery.tablesorter.js"></script>'); 

但是这似乎不起作用。

做这个的最好方式是什么？

Answer 1

 var script = document.createElement('script'); script.src = 'jquery-1.11.0.min.js'; script.type = 'text/javascript'; document.getElementsByTagName('head')[0].appendChild(script); 

Answer 2

从我所理解的问题..你有一个jQuery代码，但你想在一个不同的.js文件。 我很抱歉，如果不是这样的话。 但如果是这样的话，那么这就是我所做的。

我在我的html文件中有以下内容：

  <script src="jquery-1.6.1.js"></script> <script src="my_jquery.js"></script> 

我创build了一个单独的my_jquery.js文件，内容是：

 $(document).ready(function() { $('a').click(function(event) { event.preventDefault(); $(this).hide("slow"); }); }); 

这工作得很好。 希望我得到了正确的问题！

Answer 3

 /* Adding the script tag to the head as suggested before */ var head = document.getElementsByTagName('head')[0]; var script = document.createElement('script'); script.type = 'text/javascript'; script.src = "http://code.jquery.com/jquery-2.2.1.min.js"; // Then bind the event to the callback function. // There are several events for cross browser compatibility. script.onreadystatechange = handler; script.onload = handler; // Fire the loading head.appendChild(script); function handler(){ console.log('jquery added :)'); } 

Answer 4

问题在于</script>使用了</script> ，脚本标签结束了。 尝试这个：

 document.writeln('<script src="/javascripts/jquery.js" type="text/javascript"></sc'+'ript>'); document.writeln('<script type="text/javascript" src="/javascripts/jquery.tablesorter.js"></sc'+'ript>'); 

Answer 5

这个解决scheme是我在其他一些论坛上采用的一些解决scheme的组合。

这样你就可以在一个js文件中引用css文件和其他js文件，从而只在一个地方进行更改。 请让我知道你是否有任何疑虑。

我做了如下：

1. 我创build了名为jQueryIncluder.js的js

2. 在此文件中声明并执行以下代码

    function getVirtualDirectory() { var vDir = document.location.pathname.split('/'); return '/' + vDir[1] + '/'; } function include_jQueryFilesToPage() { var siteAddress = location.protocol + '//' + document.location.hostname + getVirtualDirectory(); var jqCSSFilePath = siteAddress + 'includes/jQueryCSS/ehrgreen-theme/jquery-ui-1.8.2.custom.css'; var jqCoreFilePath = siteAddress + 'includes/jquery-1.4.1.min.js'; var jqUIFilePath = siteAddress + 'includes/jquery-ui-1.8.2.custom.min.js'; var head = document.getElementsByTagName('head')[0]; // jQuery CSS jnclude var jqCSS = 'cssIDJQ'; // you could encode the css path itself to generate id. if (!document.getElementById(jqCSS)) { var link = document.createElement('link'); link.id = jqCSS; link.rel = 'stylesheet'; link.type = 'text/css'; link.href = jqCSSFilePath; link.media = 'all'; head.appendChild(link); } // Core jQuery include var jqc = "coreFileRefIDJQ"; if (!document.getElementById(jqc)) document.write('<scr' + 'ipt type="text/javascript" id="' + jqc + '" src="' + jqCoreFilePath + '"></scr' + 'ipt>'); // jQueryUI include var jqUI = "uiFileRefIDJQ"; if (!document.getElementById(jqUI)) document.write('<scr' + 'ipt type="text/javascript" id="' + jqUI + '" src="' + jqUIFilePath + '"></scr' + 'ipt>'); } include_jQueryFilesToPage(); 

3. 我在.Net项目的另一个js或xsl文件中引用了上面的jQueryIncluder.js文件，如下所示：

    <script type="text/javascript" src="~/includes/jQueryIncluder.js"></script> 

我希望我的努力表示感谢。

谢谢

Answer 6

如果你想添加对任何js文件的引用，也就是说，从你的项目中，你也可以直接使用引用标签添加引用 ，在Visual Studio IDE中，这是通过从解决scheme资源pipe理器中拖放外部文件到当前文件这适用于标记文件，.js＆.css文件）

 /// <reference path="jquery-2.0.3.js" /> 

Answer 7

不可能在另一个js文件中导入js文件

在js里面使用jquery的方法是

导入js在html或任何您正在使用的视图页面，你将包括js文件

view.html

  <script src="<%=request.getContextPath()%>/js/jquery-1.11.3.js"></script> <script src="<%=request.getContextPath()%>/js/default.js"></script> 

default.js

 $('document').ready(function() { $('li#user').click(function() { $(this).addClass('selectedEmp'); }); }); 

这一定会为你工作

Answer 8

这是一个jQuery的插件，你可以在其中包含你需要的文件到其他js文件，这里是它的链接http://tobiasz123.wordpress.com/2007/08/01/include-script-inclusion-jquery-插件/ 。

另外这个document.write行将脚本标记写入html而不是在你的js文件中。

所以我希望这可以帮助你，有一点你的问题

Answer 9

你可以使用下面的代码来实现在js中加载jquery。 我还添加了一个正在工作的jquery小提琴，它使用了一个自我调用函数。

 // Anonymous "self-invoking" function (function() { var startingTime = new Date().getTime(); // Load the script var script = document.createElement("SCRIPT"); script.src = 'https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js'; script.type = 'text/javascript'; document.getElementsByTagName("head")[0].appendChild(script); // Poll for jQuery to come into existance var checkReady = function(callback) { if (window.jQuery) { callback(jQuery); } else { window.setTimeout(function() { checkReady(callback); }, 20); } }; // Start polling... checkReady(function($) { $(function() { var endingTime = new Date().getTime(); var tookTime = endingTime - startingTime; window.alert("jQuery is loaded, after " + tookTime + " milliseconds!"); }); }); })(); 

Answer 10

如果你经常想更新你的jquery文件链接到一个新的版本文件，在你的网站上的许多页面上，一气呵成

创build一个JavaScript文件（.js）并放入下面的代码，并将此JavaScript文件映射到所有页面（而不是直接在页面上映射jquery文件），所以当jquery文件链接更新在这个JavaScript文件时，它会反映整个网站。

下面的代码经过testing，效果很好！

 document.write('<'); document.write('script '); document.write('src="'); //next line is the path to jquery file document.write('/javascripts/jquery-1.4.1.js'); document.write('" type="text/javascript"></'); document.write('script'); document.write('>'); 

Answer 11

您可以创build一个母版页，而不包含js和jquery文件。 将内容占位符放在主节页面的母版页基础中，然后创build一个从该母版页基础inheritance的嵌套母版页。 现在把你的包含在嵌套母版页的asp：内容中，最后从这个嵌套母版页创build一个内容页面

例：

 //in master page base <%@ master language="C#" autoeventwireup="true" inherits="MasterPage" codebehind="MasterPage.master.cs" %> <html> <head id="Head1" runat="server"> <asp:ContentPlaceHolder runat="server" ID="cphChildHead"> <!-- Nested Master Page include Codes will sit Here --> </asp:ContentPlaceHolder> </head> <body> <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server"> </asp:ContentPlaceHolder> <!-- some code here --> </body> </html> //in nested master page : <%@ master language="C#" masterpagefile="~/MasterPage.master" autoeventwireup="true" codebehind="MasterPageLib.master.cs" inherits="sampleNameSpace" %> <asp:Content ID="headcontent" ContentPlaceHolderID="cphChildHead" runat="server"> <!-- includes will set here a nested master page --> <link href="../CSS/pwt-datepicker.css" rel="stylesheet" type="text/css" /> <script src="../js/jquery-1.9.0.min.js" type="text/javascript"></script> <!-- other includes ;) --> </asp:Content> <asp:Content ID="bodyContent" ContentPlaceHolderID="ContentPlaceHolder1" runat="server"> <asp:ContentPlaceHolder ID="cphChildBody" runat="server" EnableViewState="true"> <!-- Content page code will sit Here --> </asp:ContentPlaceHolder> </asp:Content> 

Answer 12

你为什么用Javascript写脚本标签？ 只需将脚本标签添加到您的头部分。 所以你的文档看起来像这样：

 <html> <head> <!-- Whatever you want here --> <script src="/javascripts/jquery.js" type="text/javascript"></script> <script src="/javascripts/jquery.tablesorter.js" type="text/javascript"></script> </head> <body> The contents of the page. </body> </html> 

Answer 13

如果document.write（'<\ script …'）不起作用，请尝试document.createElement（'script'）…

除此之外，你应该担心你正在制作的网站的types – 你真的认为从.js文件中包含.js文件是一个好主意吗？

Answer 14

只需将两个文件中的代码复制到顶部的文件中。

或者使用像http://code.google.com/p/minify/这样的dynamic组合您的文件。;

玩笑

Answer 15

我发现最好的方法是使用这个…

 **<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>** 

这是来自Codecademy“制作互动网站”项目。