Hi，JS（初识）

什么是JavaScript？

• 作用：网页交互

• 概念：基于对象和事件驱动的解释性脚本语言

  • 基于对象：JavaScript 是一种基于对象的语言，这意味着它能运用自己已经创建的对象，因此，许多功能可以来自脚本环境中对象的方法与脚本的相互作用。

  • 事件驱动：JavaScript 可以直接对用户或者客户输入做出响应，无须经过 web 服务器，它对用户的响应，以事件驱动的方式进行。

  • 解释性：

    • 编译性：高级语言，计算机无法直接识别，先进行编译，再执行（c,c++,php)

    • 解释性：可以直接识别的语言，一行一行执行（==浏览器可以直接识别js==，执行）

  • 跨平台：JavaScript依赖于浏览器本身，与操作环境无关，只要能运行浏览器的计算机，并支持 JavaScript 的浏览器就可正常执行。

• 历史

  1995网景（Netscape），发布了第一款商用浏览器

  解决问题：表单验证

  布兰登艾奇，10天 --- LiveScript --- 》 改名 JavaScript

  微软同年 发布了IE3.0 搭载了一个克隆版的JScript

  ECMA（欧洲计算机制造商协会）-- ECMAScript1.0 --- ECMAScript5.1 ---- ECMAScript6.0 7.0 es6

  网景--火狐

JavaScript的组成

• ECMAScript：js的核心 语法标准，常用对象

• DOM：Document Object Model 文档对象模型

• BOM：Browser Object Model 浏览器对象模型

JavaScript的引入

•  行间引入

  <!-- 1.行间引入
      onclick ： 点击事件，点击的时候会触发
      alert("提示信息") :  在页面弹出提示信息
      注意：引号不能嵌套使用,结构不分离
  -->
  <button onclick = "alert('hello world!!')">开始第一步</button>

  内部引入

  <!-- 2.内部引入
      直接写在script标签中,script标签可以有任意多个，可以写在任意位置
      一般写在head或body末尾，建议写body的末尾
      注意：结构不分离,代码从上往下执行
  -->
  <script>
      alert("一般写在head或body末尾，建议写body的末尾");
  </script>

  外部引入

  <!-- 3.外链
      script标签的src属性引入外部的js文件
      注意：用于引入外部js的script标签只能引入，里面不能再写其他的js代码，不会执行
  -->
  <script src="./outer.js"></script>
  <script>
      alert("重新写一个script，写内部的js，我是单独的弹框");
  </script>

  js调试方式

  调试：程序在开发过程中检测，检查代码的功能，数据的一种方式，上线前调试，上线的时候都会删除掉

• 1.alert

• 语法：alert(message) ：在窗口弹出警告信息

  a = 10;
  b = 20;
  ​
  /*1. alert(message) ：在窗口弹出警告信息
       缺点:一次只能弹一个
  */
  alert(a);
  alert(b);

• 2. console.log

• 语法：console.log(message):在控制台显示信息

  /* 2.console.log(message):在控制台显示信息，一次可以显示多个，多个之间用逗号隔开*/
  console.log(a,b,a*b);

• 3. document.write

• 语法：document.write(message): 在页面显示信息，可以识别标签

  <button>按钮</button>
  <button onclick = 'document.write("<h1>document</h1>")'>写入</button>
  /* 
  3. document.write(message): 在页面显示信息，可以识别标签
     在输入流中往页面写入数据,如果页面已经加载完再写入，会覆盖之前的内容
  */
  document.write(a,"<br>",b);

• 4. 断点调试

• 打断点，F12（页面右击-->检查-->Sources）在行号上点击，变成蓝色就是打上了断点。额，这个不是很好解释，实际操作里，或者在后续的代码项目案例里遇到的话，会详细介绍的，