javaScript的基础学习
1，基础介绍：
![]()
6,循环语句：
![]()
![]()
![]()
![]()
17，javaScript的浏览器对象：
![]()
![]()
![]()
5，screen对象
![]()
![]()
可以放在html的head中或者是body中，
必学放在<script></script>标签中。
JScript 是一种解释型的、基于对象的脚本语言。
JavaScript能做什么？
1.增强页面动态效果(如:下拉菜单、图片轮播、信息滚动等)
2.实现页面与用户之间的实时、动态交互(如:用户注册、登陆验证等)
2，基本的语法：
- javaScript语句向浏览器发出命令，告诉浏览器做什么。
- javaScript对大小写敏感。
- JavaScript忽略空格
3，变量：
var ele1,ele2 (多个变量名之间用“,”隔开)
- 定义数组
- 得到数组的长度使用的是length
- var arr=new Array("hello",1,"world");
- var arr=["hello","world",1];
- var arr=new Array();arr[0]=1;arr[1]="hello";arr[2]="world";
4,运算符：
| |
|
5，条件语句
|
感觉就像是路口分出几条走的路。 |
|
|
1，普通的for循环： for(变量;条件;操作){执行的语句} |
|
2.for in 循环 |
|
do{}while()是先执行，再判断 |
7，跳转语句：
|
跳出本次循环 |
|
跳出本次循环，进入到下一次循环。 |
8，函数：
|
v1,v2,是参数 |
|
9，局部变量和全局变量：
10,javaScript的异常处理
|
|
11，javaScript的事件：
|
12,javascript的DOM对象
| 1，什么是dom: |
2,dom用来干什么： |
DOM操作HTML
DOM操作css
| 1，改变html的输出流：doucument.write(""); 注意：绝对不能够在文档加载完毕之后使用这个，因为会覆盖 |
2，寻找元素：
|
| 3，改变html的内容：innerHTML |
| 4,改变html的属性： obj.属性名 |
格式是： obj.style.属性=new style;
DOM的事件句柄：
好处：可以对同一个DOM元素添加多个事件句柄。
语法：obj.addEventListener("事件名"，处理方式)
obj.removeEvnetListener("事件名","处理方式");
13,事件的详解：
| 1，事件流： |
||
| 2，事件处理：4.是Ie8- |
|
兼容各种浏览器的处理方式： |
| 3，事件的对象： |
|
|
| 卸载事件（onunload） 当用户退出页面（页面关闭或者是刷新的时候） |
|
13,javaScript的对象：
| 1，什么是对象：所有的事物都是对象 2，自定义对象:
|
1，定义对象并创建实例：
|
| 2，使用函数自定义对象，然后创建新的对象实例： function people(name,age){ this._name=name; this._age=age; } son=new people("lily",30); |
|
3,String字符串对象：
|
|
| 4,Date日期对象： 常用的方法：
|
|
14,Array数组对象：
| 常用的方法： concat():合并数组； sort():排序； push():末尾追加元素 reverse():数组元素的翻转 slice(start,end)：返回一个新的数组，从start到end的元素 join(分隔符)： |
15，Math对象
| 常用的方法： 1，round():四舍五入的方法 2，random():返回0~1之间的数 3, max():返回最高值 4，min():返回最低的值 5，abs():返回绝对值 |
16，DOM对象控制Html
方法是：
|
|
| 访问子结点的第一项和最后一项： node.firstChild() ----elementNode.childNodes[0] node.lastChild() ----elementNode.childNodes[length-1] |
|
| 访问父结点： node.parentNode() |
|
| 访问兄弟结点： node.nextSibling() 同一个树后接跟着的 node.previousSibling():同一个树种之前的 |
|
| 获取浏览器窗口可视区域大小的方法：浏览器的视口，不包括工具栏和滚动条 在不同浏览器都实用的 JavaScript 方案： var w= document.documentElement.clientWidth
|| document.body.clientWidth;
var h= document.documentElement.clientHeight
|| document.body.clientHeight;
|
|
| offsetHeight和offsetWidth，获取网页内容高度和宽度(包括滚动条等边线，会随窗口的显示大小改变)。 offsetHeight = clientHeight + 滚动条 + 边框 二、浏览器兼容性 var w= document.documentElement.offsetWidth
|| document.body.offsetWidth;
var h= document.documentElement.offsetHeight
|| document.body.offsetHeight;
|
|
| 获取滚动条的高和宽： var w=document.documentElement.scrollWidth || document.body.scrollWidth;var h=document.documentElement.scrollHeight || document.body.scrollHeight; |
|
常用的方法：
1，计时器：
-
setInterval("clock()",1000) 或 setInterval(clock,1000)
2,window.history:
- 返回前一个浏览的页面：window.history.back(); window.history.go(-1);
- 返回前下一个浏览的页面：window.history.forward(); window.history.go(1);
3,location对象
属性：
![]()
方法：
4，Navigator对象：
| 几种浏览的user_agent.，像360的兼容模式用的是IE、极速模式用的是chrom的内核。 | |
1，window对象：
|
|
| 2,计时器：
|
|
| |
3,History对象：
|
|
4，Location对象：
|
|
5，Screen对象：
|
18，javaScript的面向对象
1，创建对象的两种方法：
|
|
2，继承：
|
|
3,重写：
|
|
4,继承父类：
|
|
5，面向对象的思想--封装和对外提供接口
|
注意点：
|
6,面向对象的思想--封装和对象的赋值：
|
复制、传递和比较数据：
- Number和Boolean的类型得到值是按值进行复制，传递和比较的。原来的值和复制的值是两个独立的副本，即使其中一个改变，也不会影响下一个。
- 对象，数组以及函数是按引用来进行复制，传递和比较的。原来的引用和现在复制的引用指向的是同一块内存，其中一个指向的内容改变，另外一个指向的内容也会改变。
- 字符串是按照引用进行复制和传递的，但是是按照值进行比较的。
特殊字符：
width关键字：
with
语句可以方便地用来引用某个特定对象中已有的属性，但是不能用来给对象添加属性。要给对象创建新的属性，必须明确地引用该对象。
with (Math){
x = cos(3 * PI) + sin (LN10)
y = tan(14 * E)
}
清除当前文档
document 对象的 clear() 方法将清空当前文档。该方法也将清除您的脚本（随文档的其他部分一起），因此要特别注意该方法的使用方式及在什么时候使用该方法。
document.clear();
经典的小案例：
1，递归：
function factorial(aNumber) {aNumber = Math.floor(aNumber); // 如果这个数不是一个整数，则向下舍入。if (aNumber < 0) { // 如果这个数小于 0，拒绝接收。return -1;}if (aNumber == 0) { // 如果为 0，则其阶乘为 1。return 1;}else return (aNumber * factorial(aNumber - 1)); // 否则，递归直至完成。}
________________________________________________不同的思路的理解：
- 常用的互动的方法：
- 警告对话框（alert(字符串或变量)）
- 确认（confirm（str））
- 返回值为boolean值
- 控制权--dom的操作
三种常见的DOM节点的结合