JavaScript

JavaScript

一、概述

javascript (js)：一种脚本语言，运行浏览器。作用：用于页面与用户之间的交互。

js基础：输入输出、数据类型、控制结构、函数、事件

DOM：元素识别和定位，元素的操作。

二、数据类型和运算符

所有js代码必须放在script标签中。script可以放在head或者body中。

1、输入输出：

输出：

alert();     以弹窗方式回显内容
console.log();    在控制台输出
document.write();     在页面上显示

输入：prompt(提示文字) 任何输入都是字符串

a = prompt();
alert(a);

2、数据类型：

基本数据类型：

Number、String、Undefined、Boolean、Null

（1）Number：

可以识别整形和浮点型

（2）String:

通过引号定义的类型。

（3）Undefined:

输出一个未定义的变量类型：

（4）null:

通过定义的方式直接赋值null.

（5）数组：

将一组数据保存在一个变量中。

arr  = [值,值2,...]
arr = new Array(值1,值2)
arr = new Array();
arr[索引]=值；

3、类型转化

（1）Number->String（隐式类型转换）

string+number 
数字.toString()

（2）String->Number（显示类型转换）

parseInt(字符串);
parseFloat(字符串)；

4、运算符：

（1）算术运算符：

+ - * / %  ** 位移运算

（2）比较运算符：

> >= < <= ==（只要数值相同就可以）  ===（全相等，类型和数据都要一样） != !==

（3）自增自减

++   --

（4）成员运算符：

in,instanceof

三、控制结构

1、 分支结构

（1）if – else

if(条件){
	语句;
}else if(条件){
	语句;
}else{
	语句;
} 

（2）switch – case

switch(变量){
	case  数字（整形）:
	    语句
	    break;
	...
	default:
		语句;
}

2 、循环结构

（1）for

for(i=0;i<10;i++){
	语句
}

（2）while

while(条件){
	语句;
}

（3）do-while

do{
	语句;
}while(条件);

三、函数：

函数：将重复的代码封装，减少代码冗余。

function 函数名(参数){
     函数体;
     return 数据;
}

四、事件：

通过在元素中，添加属性方式，触发js函数调用的操作。

onload     页面加载时当前元素时触发
onclick    当元素被点击时调用函数
onfocus    当获取焦点时。
onblur     当失去焦点时调用函数
onmouseover    当鼠标移动到元素上时触发函数调用
onmousemove    当鼠标在元素上移动时触发函数调用
onmouseleave   当鼠标移开后
onkeydown    当键盘被按下
onkeyup      当键盘被释放
onkeypress   当键盘按下

五、DOM

DOM(document object model) 页面对象模型：可以实现对页面元素操作。修改内容、修改属性、修改样式、删除元素

1、识别元素：

（1）通过id属性：

document.getElementById()   --> 元素对象

（2）通过类名：

document.getElementsByClassName()   -->元素对象数组  [object]

（3）通过name属性：

document.getElementsByName()    -->元素对象数组

（4）通过标签名：

document.getElementsByTagName()   -->元素对象数组

2、获取内容：

（1）属性：

ele = document.getElementById()
ele.value         获取input标签中的value值
ele.innerText     获取标签对中间的文本内容
ele.innerHTML     获取标签对中html标签及文本内容

ele.setAttribute("属性名",值);  添加属性/设置属性值
ele.removeAttribute("属性名")；  移除属性

六、定时器：

js的 函数：

（1）setTimeout(); 当设定时间结束时，触发操作

setTimeout(function(){
	操作;
},时间)
时间以毫秒为单位

（2）setInterval() ; 在设定时间，重复操作

setInterval(function(){
	操作;
},时间)
时间以毫秒为单位