Javascript 如何使用外部“.js”文件

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/11498068/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-24 06:03:18  来源:igfitidea点击:

How to use external ".js" files

javascripthtml

提问by blsn

I have the following two javascript functions:

我有以下两个 javascript 函数:

1

1

showCountry()

2

2

showUser()

I would like to put them in external ".js" files

我想将它们放在外部“.js”文件中

1

1

<a href="javascript:showCountry('countryCode')">countryCode</a>

2

2

<form>
 <select name="users" onChange="showUser(this.value)">
 <option value="1">Tom</option>
 <option value="2">Bob</option>
 <option value="3">Joe</option>
 </select>
</form>

What is the correct syntax to call these functions?

调用这些函数的正确语法是什么?

回答by Jalpesh Patel

Code like this

像这样的代码

 <html>
    <head>
          <script type="text/javascript" src="path/to/script.js"></script>
          <!--other script and also external css included over here-->
    </head>
    <body>
        <form>
            <select name="users" onChange="showUser(this.value)">
               <option value="1">Tom</option>
               <option value="2">Bob</option>
               <option value="3">Joe</option>
            </select>
        </form>
    </body>
    </html>

I hope it will help you.... thanks

我希望它会帮助你....谢谢

回答by Sachindra N. Pandey

Note :- Do not use script tagin external JavaScript file.

注意:- 不要在外部 JavaScript 文件中使用脚本标签

<html>
<head>

</head>
<body>
    <p id="cn"> Click on the button to change the light button</p>
    <button type="button" onclick="changefont()">Click</button>

     <script src="external.js"></script>
</body>

External Java Script file:-

外部 Java 脚本文件:-

        function changefont()
            {

                var x = document.getElementById("cn");
                x.style.fontSize = "25px";           
                x.style.color = "red"; 
            }

回答by walrii

In your head element add

在您的 head 元素中添加

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

回答by Xmindz

This is the way to include an external javascript file to you HTML markup.

这是在 HTML 标记中包含外部 javascript 文件的方法。

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

Where external-javascript.jsis the external file to be included. Make sure the path and the file name are correct while you including it.

external-javascript.js要包含的外部文件在哪里。包括它时,请确保路径和文件名是正确的。

<a href="javascript:showCountry('countryCode')">countryCode</a>

The above mentioned method is correct for anchor tags and will work perfectly. But for other elements you should specify the event explicitly.

上面提到的方法对于锚标签是正确的,并且可以完美地工作。但是对于其他元素,您应该明确指定事件。

Example:

例子:

<select name="users" onChange="showUser(this.value)">

Thanks, XmindZ

谢谢,XmindZ

回答by sham133

You can simply add your JavaScript in body segment like this:

您可以简单地将 JavaScript 添加到 body 段中,如下所示:

<body>

<script src="myScript.js"> </script>
</body>

myScriptwill be the file name for your JavaScript. Just write the code and enjoy!

myScript将是您的 JavaScript 的文件名。只需编写代码并享受!

回答by Kojugart

I hope this helps someone here: I encountered an issue where I needed to use JavaScript to manipulate some dynamically generated elements. After including the code to my external .js file which I had referenced to between the <script></script>tags at the head section and it was working perfectly, nothing worked again from the script.Tried using developer tool on FF and it returned null value for the variable holding the new element. I decided to move my script tag to the bottom of the html file just before the </body>tag and bingo every part of the script started to respond fine again.

我希望这对这里的人有所帮助:我遇到了一个问题,我需要使用 JavaScript 来操作一些动态生成的元素。将代码包含到我<script></script>在 head 部分的标签之间引用的外部 .js 文件中后,它运行良好,脚本中没有任何工作。尝试在 FF 上使用开发人员工具,它返回了变量保持的空值新元素。我决定将我的脚本标签移到 html 文件的底部,就在</body>标签和宾果游戏之前,脚本的每个部分再次开始响应良好。