一、JavaScript简介

一、JavaScript语言特点

HTML：超文本，标记语言

JavaScript：轻量级、弱类型、脚本语言

  • 脚本语言和标记语言的主要区别
    • 标记语言：可以通过浏览器直接执行
    • 脚本语言：必须要通过浏览器内核的编译，才能正常运行
  • 轻量级，意味着语言难度较低，简单
  • 弱类型，意味着语法规范松散，易学

二、JavaScript的作用

  • HTML：页面的结构，决定页面有什么内容
  • CSS：页面的样式，决定页面长什么样子
  • JavaScript：页面的交互，决定页面行为做什么
    • 人机交互：人为的操作，计算机给我们的反馈信息
    • 数据交互：注册、登录、搜索等等，带有数据的操作

三、JavaScript基本组成

  • ECMAScript：定义JavaScript基本语法规范
  • BOM：浏览器对象模型，操作浏览器的方法
  • DOM：文档对象模型，操作HTML文件的方法

案例：

 1 <!DOCTYPE html>
 2 <html lang="en">
 3   <head>
 4     <meta charset="UTF-8">
 5     <meta name="viewport" content="width=device-width, initial-scale=1.0">
 6     <title>Document</title>
 7   </head>
 8   <body>
 9     <div>北京</div>
10     <!--  
11       1、可以通过js来改变页面内容,样式
12       这是在操作html文件,属于DOM操作范畴
13 
14       2、可以通过js来操作浏览器,做弹出对话框提示框的操作
15       这是在操作浏览器,属于BOM操作范畴
16 
17       3、至于js代码怎么编写,规范是什么,都是ECMAScript来制定
18     -->
19     <script>
20       // js代码应该怎么写,规范是什么,ECMAScript来制定
21       const oDiv = document.querySelector('div');
22       
23       oDiv.onclick = function(){
24         // 操作HTML文件内容,样式,是DOM操作
25         this.innerHTML = '北京欢迎你';
26         this.style.color = 'pink';
27         
28         // 操作浏览器弹出提示框,是BOM操作
29         window.alert('我是js程序操作浏览器的弹窗效果');
30       }
31     </script>
32   </body>
33 </html>

 

posted @ 2021-07-12 23:00  大米饭盖饭  阅读(55)  评论(0)    收藏  举报