How do I link a JavaScript file to a HTML file?

2019-01-02 20:25发布

站内问答 / JavaScript
1988 5 5

How do you properly link a JavaScript file to a HTML document?

Secondly, how do you use jQuery within a JavaScript file?

5条回答
宁负流年不负卿
2楼-- · 2019-01-02 20:48

Here you have some VALID html5 example document 

<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>Example</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
</head>
<body>
    <div>Im the content</div>

    <script>
        alert( $('div').text() ); // show message with div content
    </script>
</body>
</html>

You use jquery by $ charater. Put libraries (like jquery) in <head> tag - but your script put allways at the bottom of document (<body> tag) - due this you will be sure that all libraries and html document will be loaded when your script execution starts. You can also use src attribute in bottom script tag to include you script file instead of putting direct js code like above.

查看更多
0人赞 添加讨论(0) 举报
旧时光的记忆
3楼-- · 2019-01-02 20:52

This is how you link a JS file in HTML

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>

<script> - tag is used to define a client-side script, such as a JavaScript.

type - specify the type of the script

src - script file name and path

查看更多
0人赞 添加讨论(0) 举报
步步皆殇っ
4楼-- · 2019-01-02 21:00

To include an external Javascript file you use the <script> tag. The src attribute points to the location of your Javascript file within your web project.

<script src="some.js" type="text/javascript"></script>

JQuery is simply a Javascript file, so if you download a copy of the file you can include it within your page using a script tag. You can also include Jquery from a content distribution network such as the one hosted by Google.

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
查看更多
0人赞 添加讨论(0) 举报
梦醉为红颜
5楼-- · 2019-01-02 21:13

First you need to download JQuery library from http://jquery.com/ then load the jquery library the following way within your html head tags

then you can test whether the jquery is working by coding your jquery code after the jquery loading script

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript" src="jquery-1.8.3.js"></script>
<script type="text/javascript">
   $(function(){
      alert("My First Jquery Test");
   });
</script>
</head>
<body></body>
</html>

If you want to use your jquery scripts file seperately you must define the external .js file this way after the jquery library loading.

<script type="text/javascript" src="jquery-1.8.3.js"></script>
<script src="js/YourExternalJQueryScripts.js"></script>
查看更多
0人赞 添加讨论(0) 举报
高级女魔头
6楼-- · 2019-01-02 21:15

You can add script tags in your HTML document, ideally inside the which points to your javascript files. Order of the script tags are important. Load the jQuery before your script files if you want to use jQuery from your script.

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript" src="relative/path/to/your/javascript.js"></script>

Then in your javascript file you can refer to jQuery either using $ sign or jQuery. Example:

jQuery.each(arr, function(i) { console.log(i); });
查看更多
0人赞 添加讨论(0) 举报
登录 后发表回答
相关问题
查看全部
相关文章
查看全部
收藏的人(5)