JavaScript——day1 js前瞻-CSDN博客

本文链接：https://blog.csdn.net/m0_73952430/article/details/129591544

学习目标

JavaScript介绍

变量

数据类型

类型转换

实战案例

JavaScript介绍

Javascript是什么？

javaScript是一种运行在客户端（浏览器）的编程语言，实现人机交互效果。

Javascript的作用？

网页特效（监听用户的一些行为让网页做出对应的反馈）

表单验证（针对表单数据的合法性进行判断）

数据交互（获取后台的数据，渲染到前端）

服务端编程（node.js）

JavaScript的组成？

ECMAScript：

规定了js基础语法核心知识

~比如：变量、分支语句、循环语句、对象等等。

Web APIs：

~DOM 操作文档，比如对页面元素进行移动、大小、添加删除等操作。

~BOM 操作浏览器，比如页面弹窗，检测窗口高度，存储数据到浏览器等等。

JS的书写位置

和CSS一样，同样有三种书写方式

内部JavaScript

直接写在HTML文件里，用script标签包住

规范：script标签写在</body>上面

拓展：alert('你好，js！')页面弹出警告对话框

<!DOCTYPE html>
<html lang="zh-CN">

<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>JS-Day1</title>
</head>

<body>
    <!-- 内部js -->
    <script>
        //页面弹出警示窗
        alert('你好，js！')
    </script>
</body>

</html>

注意事项

我们将<script>放在HTML文件的底部附近的原因是浏览器会按照代码在文件中的顺序加载HTML。

如果先加载的JavaScript期望修改其下方的HTML，那么它可能由于HTML尚未被加载而失效。

因此，将JavaScript 代码放在HTML页面的底部附近通常是最好的策略。

2.外部JavaScript

代码写在以.js结尾的文件里。

语法：通过script标签，引入到html页面中。

<body>
    <!--通过src引入外部js文件-->
    <script src="my.js"></script>
</body>

注意事项

1.script标签中间无需写代码，否则会被忽略!

2.外部JavaScript会使代码更加有序，更易于复用，且没有了脚本的混合，HTML也会更加易读，因此这是个好的习惯。

内敛JavaScript

代码写在标签内部

语法：

注意：此处了解即可，但是后面vue框架会用这种模式

<body>
    <button onclick="alert"('哈哈哈')>点我</button>
</body>

JavaScript——day1 js前瞻

目录

学习目标

JavaScript介绍

Javascript是什么？

Javascript的作用？

JavaScript的组成？

ECMAScript：

Web APIs：

JS的书写位置

内部JavaScript

注意事项

2.外部JavaScript

注意事项

内敛JavaScript