简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
Home > List of blog posts > JavaScript初识
Blogger Information
Blog 24
fans 0
comment 0
visits 18695
Special Recommendation
More>
Related recommendations
Popular Tutorials
More>
Related Tutorials
Popular Recommendations
Latest courses
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
JavaScript初识
昔年
Original
653 people have browsed it

JavaScript初识

1.JavaScript组成

  • ECMAScript：核心语法
    DOM:Document: Object Model 文档模型对象
  • DOM：Brower Object Model

2.语法

2.1js代码如何书写

-在html代码中写JavaScript语法要使用script标签包裹起来
-script标签中可以用src属性引入外部的js文件，将调用一个外部js脚本，并忽略内部的代码

  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.     <script src="test.js">
  8.       //如果scrip标签中出现src属性，将调用一个外部js脚本，并忽略内部的代码
  10.       //async：可以实现外部的js文件的当前的html文件解析同步进行
  11.       document.querySelector("h2").style.color = "red";
  12.     </script>
  13.   </head>
  14.   <body>
  15.     <h2>朱老师喜欢大家</h2>
  16.   </body>
  17. </html>
  19. <!-- script标签中添加defer属性，将会延迟加载外部的js文件，直到当前的html解析完成 -->

2.2js变量声明

js变量用关键字var来声明，变量区分大小写，函数也区分大小写
这点与PHP不同，PHP变量区分大小写，函数不区分

  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.     <script>
  10.       //   Unicode:
  11.       var 姓名 = '吴"老二"';
  12.       console.log(姓名);
  13.       //php 没有变量声明的
  14.       //   前面没有关键字  $name = "朱老师";
  15.       var username = "admin";
  16.       var userName = "Peter";
  17.       //变量区分大小写，与PHP一直
  18.       console.log(username);
  19.       console.log(userName);
  20.       function a() {
  21.         console.log("Hello a");
  22.       }
  23.       function A() {
  24.         console.log("Hello A");
  25.       }
  26.       //在js中，函数区分大小写
  27.       a();
  28.       A();
  29.     </script>
  30.   </body>
  31. </html>

2.3js作用域

js函数内部可以直接使用外部变量，在函数外部也可以使用内部变量

  2.    <!DOCTYPE html>
  3. <html lang="en">
  4.   <head>
  5.     <meta charset="UTF-8" />
  6.     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  7.     <title>Document</title>
  8.   </head>
  9.   <body>
  10.     <script>
  11.       //变量
  12.       //约定大于配置
  13.       var email = "admin@php.cn";
  14.       var SEX = "male";
  16.       //更新
  17.       email = "jack@php.cn";
  19.       console.log(email);
  21.       //ES5重新声明
  22.       var email = "Hello@php.cn";
  24.       //作用域是一个对象，用来查找变量的工具
  25.       //PHP中作用域有二：函数作用域，全局/外部使用域/函数外部
  26.       //js与PHP的作用域是一样的，也有函数和全局
  27.       //php与js都不存在块作用域
  28.       job = "Lecture";
  29.       function test() {
  30.         var username = "朱老师";
  31.         console.log(username + "是" + job);
  32.       }
  33.       test();
  35.       //   {
  36.       //     //块作用域
  37.       //     // var age = 40;
  38.       //   }
  40.       //   {
  41.       //     //ES6支持块作用域
  42.       //     let age = 40;
  43.       //   }
  44.       //   console.log(age);
  46.       if (true) {
  47.         var hello = "php.cn";
  48.         console.log("Hello..." + hello);
  49.       }
  51.       console.log("Hello..." + hello);
  52.     </script>
  53.   </body>
  54. </html>

2.4js变量提升

js变量声明可以看成两歩，第一歩是变量声明，第二步是变量初始化。
为定义的变量使用的话是undefined。

  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.     <script>
  10.       //变量提升：变量未定义之前就可以使用了
  11.       //访问在前
  12.       console.log(email);
  14.       //声明
  15.       var email = "admin@php.cn";
  16.       //声明
  17.       var email;
  18.       //初始化
  19.       email = "admin@php.cn";
  20.       var username;
  21.       console.log(username);
  22.     </script>
  23.   </body>
  24. </html>

总结：主要是JavaScript的基础语法，主要是变量声明、变量作用域以及变量提示。

Correcting teacher：天蓬老师天蓬老师

Correction status：qualified

Teacher's comments：变量里还有许多知识点, 有空多看看手册
Statement of this Website
The copyright of this blog article belongs to the blogger. Please specify the address when reprinting! If there is any infringement or violation of the law, please contact admin@php.cn Report processing!
All comments Speak rationally on civilized internet, please comply with News Comment Service Agreement
0 comments
Author's latest blog post
About us Disclaimer Sitemap
php.cn：Public welfare online PHP training，Help PHP learners grow quickly！