如何在html中调用js代码

我们编写html的时候经常需要调用JS的相关代码，那么如何在HTML中调用JS的代码呢？下面我给大家分享一下。

工具/材料

Sublime text

01

首先打开Sublime text软件编写一个html页面，如下图所示

02

然后我们在html页面中添加script标签，在script里简单的写一些JS的代码，如下图所示

03

接下来可以定义一个button按钮，通过其click事件来调用JS的代码，如下图所示

04

当然，如果调用的JS代码是外部的文件，则需要在开头的head标签内进行引入才可以使用，如下图所示

HTML点击按钮调用JS文件或者直接调用JS代码的方法。

如下参考：

1.将这段代码保存到一个文件中，如下图所示。

2.请注意，您可以使用任何文本工具创建js文件，但是在保存它时，您需要将其后缀为.js。

3.将版本js文件保存为index.js。如果我们需要使用index。js。我们只需要调用它，不需要写一个新的js文件。

4.在HTML的头部部分引入js文件，具体代码如下图所示。

5.引用是一个双标签，所以如果没有内容，就必须完全写入。

6.如果你的js是从外部导入的，你不能在中间写js代码。

7.如果需要，您需要重新声明脚本标记，并在标记中编写js代码，如下图所示。

8.javascriptjquery也是一样的规则，你必须在script标签中写代码。随着js文件的引入，你可以简单地在你想要的地方调用它。

1、打开Dreamweaver软件，然后在创建新项目下选择HTML；

2、点击“文件”选项，然后点击“另存为”，将文件命名为test，并将其保存在电脑桌面上；

3、编写一个基本的html文件，该html文件包含一个用户名及一个密码输入文本框和一个确定以及一个取消按钮；

4、在title标签下插入<script language="JavaScript">js代码</script>，然后在html中调用js函数；

5、完成js代码编写及html调用js代码后保存tset.html文件，然后在浏览器中打开test.html文件，检查js代码执行的效果；

6、在Dreamweaver软件中新建一个check.js文件（方法同html文件新建），在check文件中输入校验函数；

7、然后在test.html的title标签下引用check.js文件

8、在程序中引用check.js文件中的js函数，然后在浏览器中刷新test.hmtl文件，然后在username的输入框中输入非法字符来检验js代码。

---