js 的基础知识

一、弱类型意识

js变量是没有类型的

var  a = 1;  //a 就是一个变量 不要提什么类型

变量可以赋任何类型的值
类型仅仅是值的性质 与变量无关

Js的基本类型

变量未赋值时，其值为undefined

只有一个number类型表示数字 不区分整数还是小数

二、动态语言

动态语言针对的不是变量
而是值 尤其是对象

Var obj={name:”changwei”,age:3};    //对象字面量

= 后面的值是什么类型？

别提什么弱类型，因为弱类型是针对变量的

此处问的是值是什么类型！

Js是动态语言， 可以随意创建对象

而不需要有与之对应的类

Js中没有class(ES6中新加了class
但它实际上与Java中的class不一样)

动态语言不仅可以随意创建对象 而且可以随意向对象中

还可以从对象中删除属性及方法、添加属性、方法等成员

这个特性对Java来说是不可想象的

三、函数式编程

函数（方法）可以作为参数传递给另一个函数   [函数也是值]

函数实际上也是一个普通变量

普通变量也可以附一个函数作为值

函数实际上是一个对象，这个对象中包含了它的源代码

函数名 以及调用这个源代码的方法

function add(a,b){

return a+b;

}

add 是变量吗?     是

函数是个对象吗？  是
函数是一个特殊的对象

原型

原型存在的原因是因为js中没有class
无法共享方法及静态成员

原型是一个容器（对象） 可以存放被大量对象共享的方法及属性

Js定义了一条寻找属性/方法规则：

先在对象本身上找 找到就是用
找不到就去原型中找

原型找不到 就去原型的原型中找

..............

直到穷尽所有原型为止（原型链）；

DOM  

Document Object Model 文档对象模型

使劲就是给网页上的标签建立的，模型

每一个都用一个对像来表示

每一类标签都是一个类

给网页上标签建模的目的是为了让js能够

以编程的方式控制
生成网页

DOM 是控制网页的api

第一类api ：获取标签对象

document.getElementById(“id”)

document.getElementsByTagName(“tagName”)

document.getElementsByName(“name”)

document.getElementsByClassName(“className”)

H5时代新增的2个方法

document.querySelector(css筛选器)    返回一个标签

document.querySelectorAll(CSS筛选器) 返回要找到所有标签

第二类API： 操作标签的属性

tag.属性名=值

var value = tag .属性名

tag.setAttribute(属性名，值)

var value = tag.getAttribute(属性名)

第三类： 控制标签的样式

tag.style.color=”red”;

tag.style.fontSize=’12px’

Tag.style.font-size ((不可用))

tag.style[‘font-size’]=’12px’

样式类

Tag.className=”样式类1，样式类2”；

Tag.classList.add(“样式类1”)      往上加

Tag.classList.remove(“”)           去掉

Tag.classList.togggle(“”)    没有就加上
有的话就去掉

Tag.classList.contains(“”)            判断是否有指定的样式类

第四类：创建 添加
删除标签对象的API

Var tag = document.createElement(“标签名”)

tag.属性名=值；

Tag.setAttribute（属性名 值）

parentTag.appendChild(tag)  追加到父类的标签中

tag.insertBefore()；

tag.insertAdjecentElemrnt(“四种位置”，newTag);

tag.insertAdjecentHTML(‘四种位置’，文本字符串);

tag.remove();

第五类：标签之间的关系：

tag.parentNode     上级标签

tag.childdren        下级标签

tag.childNodes       下级节点

tag.previousSibling     前面的兄弟标签

tag.nextSibling         后面的兄弟标签

第六类：事件监听

鼠标事件   click(单击)    dbclick(双击)     context(右击)

Mouseover(在上面)  mouseout(不在上面)

mouseenter(进入)   mouseleave(离开)

Mousemove(移动)    mousewheel(滚动)

衍生出的拖拽事件Drag  dragstart    dragenter     dragleave    drop

衍生出的触控事件Touchstart    touchend       touchleave

键盘事件

Keyup(按键弹起)     keydown(按下，不放手会连续触发)       keypress

窗口事件： resize    close

打印事件

动画事件

事件对象：当事件发生时，浏览器会生成一个事件对象
将事件相关的数据都放入这个对象中 如哪个标签触发了事件    事件发生时
鼠标的位置  键盘按键的状态（Ctrl/shift等是否按下  按下那个键？）

监听事件：

tag.on 事件名= function(){

事件发生时会执行函数

}

// 只能挂接一个监听函数

tag.addEventiListener(‘事件名’，function(){

})

//可以为一个事件挂接多个监听函数

tag.remoceEventiListener(‘事件名’)