来看看js代码的用法。
我们在使用JavaScript代码有两种写法：一种是在HTML页面中直接嵌入js代码，另一种是通过链接外部的JavaScript文件。
我们先来看第一种用法：在HTML页面中直接嵌入js代码
如果在HTML页面中直接嵌入JavaScript代码，我们需要使用 <script>标签，<script>和 </script>会告诉 JavaScript 在何处开始和结束。
<script>和 </script>之间的代码行包含了 JavaScript：
<script>
alert("My First JavaScript")
</script>
在HTML页面的任何位置（head部分 body部分 body的后面 较好）都可以插入script标签。
你有可能会在 <script>标签中看到使用 type="text/javascript"，但是现在已经不必这样做了。JavaScript现在已经是所有现代浏览器以及 HTML5 中的默认脚本语言。
我们来看一个具体的示例
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<script>
document.write("<h1>This is a heading</h1>")
document.write("<p>This is a paragraph</p>")
</script>
</body>
</html>
上述代码就是在在HTML页面中直接嵌入js代码。
接着我们来看看js代码的第二种用法：通过链接外部的JavaScript文件。
有时JavaScript代码过多的话，我们可以将代码单独放在JavaScript文件中然后链接起来。
我们链接外部JavaScript文件可以有以下步骤
1、首先我们建立一个JavaScript文件，扩展名是.js
2、然后将要编写的js代码写到Js文件中，并保存文件。
3、使用script标签将JavaScript文件链接到HTML文件中
<script type="text/javascript" src="JavaScript文件名和路径"></script>
需要注意一点的是，在一个已经引入外部js文件的script标签中，不能在它的开始标签和结束标签中写Js命令了。
我们来看一个具体的示例
我们先建一个js文件sample.js
然后写入js代码
document.write("<p>This is a paragraph</p>")
最后使用script标签将JavaScript文件链接到HTML文件中
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<script type="text/javascript" src="sample.js"></script>
</body>
</html>
以上就是js代码使用的两种方法
1. 在HTML里面加入JavaScript；方法非常简单，就是通过一对<script></script>标签，然后在标签里面书写代码即可；2. 标签位置；按照以前传统的方法，我们的script标签都是放在head标签里面的。但是由于浏览器进行渲染的时候是由上往下进行渲染，这样会导致浏览器在呈现页面的时候出现延迟。延迟的时候就是空白，影响用户体验。所以现在的方法，都是讲script标签写body里面，元素的后面。；3. 外部JS文件；1）可维护性高；2）可缓存：例如有两个HTML文件（A，B）都是用的同一个JS文件。当用户请求A页面的时候，A页面的HTML文件和JS文件一起被下载到本地。接下来用户再请求B页面的时候，只需要下载B页面的HTML页面即可，因为JS文件已经有了。4. JavaScript语法；1）JavaScript区分大小写test和Test表示不同变量2）标识符；JavaScript里面的标识符由数字，字母，下划线（_）和$组成，不能以数字开头3）注释：JavaScript注释有两种：多行注释和单行注释<!DOCTYPE html><html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
#cover{
position: fixed
top: 0
left: 0
height: 100%
width: 100%
background-color: rgba(0,0,0,0.3)
display:none
z-index:1000
}
</style>
</head>
<body>
<button>这是一个按钮</button>
<div id="cover">这是一个遮罩</div>
<script>
var btn=document.getElementsByTagName('button')[0]
btn.addEventListener('click',function(){
var cover=document.getElementById('cover')
cover.style.display='block'
setTimeout(function(){
cover.style.display='none'
},5000)
})
</script>
</body>
</html>
