【html、CSS、javascript-5】JavaScript

JavaScript是一门编程语言，浏览器内置了JavaScript语言的解释器，所以在浏览器上按照JavaScript语言的规则编写相应代码之，浏览器可以解释并做出相应的处理。

一、如何编写

1、JavaScript代码存在形式

<!-- 方式一 -->
<script type"text/javascript" src="JS文件"></script>
  
<!-- 方式二 -->
<script type"text/javascript">
    Js代码内容
</script>

两种存在形式

2、JavaScript代码存放位置

HTML的head中
HTML的body代码块底部(推荐)

由于Html代码是从上到下执行，如果Head中的js代码耗时严重，就会导致用户长时间无法看到页面，如果放置在body代码块底部，那么即使js代码耗时严重，也不会影响用户看到页面效果，只是js实现特效慢而已。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="https://www.gstatic.com/og/_/js/k=og.og2.en_US.iF4jnkQuaf0.O/rt=j/t=zcms/m=def/exm=in,fot/d=1/ed=1/rs=AA2YrTv5-POC4Ks9GtGRdY2ywUWisqz7-Q"></script>
    <script>
        alert('123');
    </script>
</head>
<body>
    <div>123</div>
</body>
</html>

先加载js再加载其他

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <div>123</div>
    <script src="https://www.gstatic.com/og/_/js/k=og.og2.en_US.iF4jnkQuaf0.O/rt=j/t=zcms/m=def/exm=in,fot/d=1/ed=1/rs=AA2YrTv5-POC4Ks9GtGRdY2ywUWisqz7-Q"></script>
    <script>
        alert('123');
    </script>
</body>
</html>

先加载其他再加载js

由上面的代码可以看出，应该先让访问者看到页面，然后再加载js代码，这样提高用户体验

二、变量

1）JavaScript中变量的声明是一个非常容易出错的点，局部变量必须一个 var 开头，如果未使用var，则默认表示声明的是全局变量。

 1 <script type="text/javascript">
 2  
 3     // 全局变量
 4     name = 'seven';
 5  
 6     function func(){
 7         // 局部变量
 8         var age = 18;
 9  
10         // 全局变量
11         gender = "男"
12     }
13 </script>

2）JavaScript中代码注释：

单行 //
多行 /* */

注意：此注释仅在Script块中生效。

3）代码后面加";"

不加;不会报错，但是强烈建议加上，因为html要压缩，如果压缩后不带;，造成代码混乱

【html、CSS、javascript-5】JavaScript

猜你喜欢