认识js

认识js

特性：

1. 编程语言：可以编写有处理逻辑的程序的语言
2. 脚本语言：可以编写具有简单功能处理的、运行与特定环境的小程序操作
3. 弱类型语言：对于数据类型的存储操作可以自动适应
4. 跨浏览器：目前主流的任意浏览器都可以操作
5. 运行环境：浏览器引擎[JS解释器]、NodeJS平台
6. 解释运行：解释一行，执行一行

操作：

<script></script>

js代码，在前段开发中要写在script标签中	<script></script>
控制浏览器弹出一个警告对话框	alert(“信息”);
在浏览器窗口的网页文档中写文本 h1 设置字体格式	document.write(“hello”) document.write(“<h1>hello</h1>”)
在浏览器的控制台窗口中输出一段信息	consloe.log(“hello”)
单行注释	//   //
多行注释	/*   */
js代码中建议每行末尾添加分号	consloe.log(“hello”);
<button οnclick=”show1()”></button>	按钮  按钮被点击是执行
function show1(){ }	声明一个函数
console.log(res);	在控制台展示结果
document.getelementbyid(“ box ”)	获取网页id为box的标签对象
_show.innerText =”文本”	将文本展示给_show
var _s_value = _score.value;	获取文本框中的内容
_abc.onkeyup = function(){ }	获取按键抬起事件
document.write()	展示数据

console 控制台窗口 查看js执行的代码  也可以直接在浏览器中的console中写js代码

 

运行环境

1. JS使用场景(web网络开发)：
   1. 客户端编程：编写在HTML中/js脚本文件中，运行在浏览器中[脚本]
      1. 主要实现：网页特效、数据验证、数据交互
   2. 服务端编程：编写在服务器上js脚本文件中，运行在Node平台上
      1. 主要实现：服务端软件的功能流程处理[编程]
2. 安装配置开发环境

1. 安装：客户端编程，不需要安装{服务端开发：需要安装nodejs环境}
2. 配置：客户端编程，不需要配置{服务端开发：需要配置开发环境}
3. 开发环境：客户端编程~浏览器环境【浏览器引擎对象中包含了JS解释器】

1. 基本语法

在HTML网页中，编写的脚本程序

1. JS代码位置：三个位置

标签内嵌-时间属性：onclick鼠标单击

<div οnclick=”alert(‘用户点了一下div’)”>hello</div> <div οnclick=”javascript:alert(‘用户点了一下div’)”>hello</div>

 

网页内嵌-js代码写在一对<script></script>标签中

 

外部脚本-js代码写在一个js文件中，通过script标签引入到HTML网页

<script src=”demo02.js”></script>  在HTML头部引入js文件代码 <button οnclick=”show_info()”></button>

可以在浏览器检查的sources中查看源代码

1. 各种对话框

1. 警告信息对话框            alert() 

只有一个确认按钮 点击确认即可关闭

1. 信息确认对话框（常用）    confirm()

有 确认和取消按钮      点击会返回一个结果True | false

1. 交互对话框                prompt()

可以输入内容 

 

数据类型

作为一门编程语言

         目的：解决问题

                   核心：处理数据

                            操作：增删改查

         目标：得到解决方案：结果

python:基本数据类型|组合数据类型|引用数据类型

                            字符串|数字|布尔|复数 – list|set|tuple|dict – class类型

                            检测数据类型：type(数据)

                            数据类型转换:int()\str()\float()...

         JS:基本数据类型

                   布尔类型Boolean|数字Number

字符串String|null(空值)|undefined(未定义)

                            检测数据类型：typeof(数据)

                   数据类型转换：

Number()将一个数据转换成数字 – NaN: not a number

parseInt()将一个数据转换成整数

parseFloat()将一个数据转换成浮点数

String() 将一个数据转换成字符串,和直接调用.toString()一个效果

 

         JS中的运算符

                   赋值运算符 =  +=  -= ..

                   算数运算符 + - * / %   ..

                   比较运算符 > >= < <= ==(值相等) ===(值、类型 全等)

                   逻辑运算符 &&(并且and) ||或者(or)  !(取反not)

                   其他更多运算符…

        

         JS中的变量

                   JS是弱类型的语言，变量的操作使用和python一样

                   声明变量即可赋值使用

                            name = “jerry”; 不推荐这样直接操作

                   JS推荐，任意变量，先通过var关键字声明，然后赋值使用

                            var _ name = “tom”;

 

 

问题：网页中的JS是用来作什么的？

         实现网页特效、数据验证、数据交互等操作

         核心：JS操作HTML标签[标签/属性/样式/内容]

1. JS中获取标签对象
   1. 根据标签的id属性获取一个标签对象
   2. document.getElementById(“id的值”)

网页文档 获取  标签

 

选择结构

JS中，提供了两种选择结构

                   判断结构：if-else结构【可以进行范围判断，使用比较运算符】

if  {

 

} else if   

else if

 

                   选择结构：switch-case结构【直接进行全等判断】(cose穿透)

                     switch（）{

       case 170:

              _res.innertext = “L”;

       break;

       case 175:

              _res.innertext = “L”;

       break;

       default:

              _res.innertext = “L”;

 

 

}

 

 

循环结构

数组

用来保存一组数据的数据结构  一般情况下，使用方括号表示

属于Array类型|数组类型

var _names = Array();  通过array类型声明一个空数组

Var _users = [];  通过快捷形式 声明一个空数组

 

Console.log(typeof(_names));

在控制台展示结果 检查数据类型

 

Console.log(_namees.length); 数组中元素的个数|数组长度

 

_names.push(“tom”)  末尾追加数据

 

_names.pop();  末尾删除数据

 

_names.shift();  删除数组开头的数据

 

_names.unshift(“shuke”) 数组的开头增加数据

 

_names[0] = null;  标记删除

 

for..in 循环

for(_index in _names){

If (_names[_index] !=null) {

Console.log(_name[_index]);

}

 

}