非零基础自学前端最后一遍二 JavaScript基础 2 JavaScript的基本语法 2.2 noscript元素的使用和编写JavaScript的注意事项

谁践踏了优雅 2024-03-25 09:51 8阅读 0赞

#### 非零基础自学前端最后一遍 ####

#### 文章目录 ####

*   *   *  非零基础自学前端最后一遍
         *  二 JavaScript基础
         *  2 JavaScript的基本语法
         *   *  2.2 noscript元素的使用和编写JavaScript的注意事项
             *   *  2.2.1 \\<noscript>元素
                 *  2.2.2 JavaScript编写的注意事项

![在这里插入图片描述][52e2ffab3f514bce87a365a58b321115.png_pic_center]

#### 二 JavaScript基础 ####

#### 2 JavaScript的基本语法 ####

##### 2.2 noscript元素的使用和编写JavaScript的注意事项 #####

###### 2.2.1 <noscript>元素 ######

*  如果运行的浏览器不支持JavaScript, 那么我们如何给用户更好的提示呢?
    
     *  针对早期浏览器不支持 JavaScript 的问题，需要一个页面优雅降级的处理方案;
     *  最终， <noscript>元素出现，被用于给不支持 JavaScript 的浏览器提供替代内容;
 *  下面的情况下, 浏览器将显示包含在中的内容:
    
     *  浏览器不支持脚本;
     *  浏览器对脚本的支持被关闭。

<!DOCTYPE html>
    <html lang="en">
    
    <head>
      <meta charset="UTF-8">
      <meta http-equiv="X-UA-Compatible" content="IE=edge">
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <title>Document</title>
    </head>
    
    <body>
    
      <noscript>
        <h1>您的浏览器不支持JavaScript, 请打开或者更换浏览器~</h1>
      </noscript>
    
      <script>
        alert("您的浏览器正在运行JavaScript代码")
      </script>
    
    </body>
    
    </html>

渲染效果

![在这里插入图片描述][29b461938da549b49fc6bd9ca3ef158d.png_pic_center]

当然我们也可以把当前浏览器的JavaScript关掉

![在这里插入图片描述][4babdf57b7f34b8385f925dd6b2eb083.png_pic_center]

![在这里插入图片描述][bbae98eef6a148e8b9742b8860a65170.png_pic_center]

![在这里插入图片描述][5fd5d4abd5f444dd839e7783580bed86.png_pic_center]

勾这个，再来一次

![在这里插入图片描述][128b8c9c58e449648b594fa8579d02c6.png_pic_center]

妙啊

###### 2.2.2 JavaScript编写的注意事项 ######

*  注意一: script元素不能写成单标签
    
     *  在外联式引用js文件时，script标签中不可以写JavaScript代码，并且script标签不能写成单标签；
     *  即不能写成<script src=“index.js”/>；
 *  注意二: 省略type属性
    
     *  在以前的代码中，<script>标签中会使用 type=“text/javascript”；
     *  现在可不写这个代码了，因为JavaScript 是所有现代浏览器以及 HTML5 中的默认脚本语言；
 *  注意三: 加载顺序
    
     *  作为HTML文档内容的一部分，JavaScript默认遵循HTML文档的加载顺序，即自上而下的加载顺序；
     *  推荐将JavaScript代码和编写位置放在body子元素的最后一行；
 *  注意四: JavaScript代码严格区分大小写
    
     *  HTML元素和CSS属性不区分大小写，但是在JavaScript中严格区分大小写；
 *  后续补充：script元素还有defer、async属性，我们后续再详细讲解。

[52e2ffab3f514bce87a365a58b321115.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/25/1c1aec9304484e69a483e0a058b6aa70.png
[29b461938da549b49fc6bd9ca3ef158d.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/25/cc06f62f7cef475cb014967e8eb332af.png
[4babdf57b7f34b8385f925dd6b2eb083.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/25/3fcc465042304f4282e6f766e4a01058.png
[bbae98eef6a148e8b9742b8860a65170.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/25/bbfd4ad3ca834d4793df9c6715a623dc.png
[5fd5d4abd5f444dd839e7783580bed86.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/25/066e03bdbc3f469c9942eb33104abcec.png
[128b8c9c58e449648b594fa8579d02c6.png_pic_center]: https://image.dandelioncloud.cn/pgy_files/images/2024/03/25/54747d6293de42ff9c1a4117cb5c47de.png