强哥JavaScript学习笔记

js文件放header头最后，js代码放body体最后

js语言定位：
js是基于对象的语言
php、java是面向对象的语言

定义变量：
var str="hello world"

js变量作用域：
1.函数外面定义的变量不管带不带var全部都是全局变量
2.函数里面定义的变量，带var的是局部变量，不带var的是全局变量

js变量类型：

js基础对象：
1.window //窗口对象
2.document //文档对象
3.document.documentElement //html对象
4.document.body //body对象
5.document.head //head对象

js特效：
1.通过js把标签转成元素对象
2.js操作标签样式
3.js操作标签事件

js变量类型：
1.字符串
2.整形
3.浮点
4.布尔
5.数组
6.对象
7.json对象
8.NaN //不是一个数字
9.null
10.undefined

测试变量类型
typeof();

Global对象方法：
parseInt(string, radix)
parseFloat(string)
typeof(Object)
eval(string)
isNaN(testValue)
String(Object)
Number(Object)
Array()
Object()
Bool()
转布尔类型后哪些为假：
0
false
""
null
undefined
NaN

转布尔类型方法：
1.Boolean(num)
2.!!num

js运算符
1.+ 字符串连接符
2. new 创建新对象用的
3.this 本对象
4.in 检查某一个属性是否是这个对象里面的
5.instanceof 检查某个对象是否是由某个构造函数产生的
6.delete 不能删除用var定义的变量，其他都可以用delete删除

js语法：
if;...else
for
while
switch...case
with
for...in

js弹窗
1.alert() //警告
2.confirm() //确认
3.prompt() //提醒

js内置对象
1.数学
2.日期
3.定时器
4.超时器
5.字符串
6.数组

数学对象：
Math.PI
Math.ceil()
Math.random()
Math.max()
Math.min()

日期对象：
var dd=new Date()；
alert(dd.getFullYear()); //年
alert(dd.getMonth()+1); //月
alert(dd.getDate()); //日
alert(dd.getHours()); //时
alert(dd.getMinutes()); //分
alert(dd.getSeconds()); //秒

定时器：
setInterval();
clearInterval();

超时器：
setTimeout();
clearTimeout();

字符串函数：
属性：
length
方法：
indexOf() //返回 String 对象内第一次出现子字符串的字符位置
lastIndexOf() //最后一次出现的位置
substr(3) //从位置3开始截取
slice(0,3) //截取0-3
split() //将一个字符串分割为子字符串，然后将结果作为字符串数组返回。支持正则
search() //返回与正则表达式查找内容匹配的第一个子字符串的位置
match()
replace()

js数组对象
属性：
arr.length()
方法：
pop() //弹出数组最后一个元素
push() //从最后添加一个元素
shift() //从开头删除一个元素
unshift() //从开头添加一个元素
slice() //从数组中截取一部分元素
concat() //连接多个数组
reverse() // 翻转数组元素
sort() //数组元素排序
splice() //删除并替换数组元素

js Dom对象
1.windows
2.document
3.document.head
4.document.body
5.document.title
6.document.documentElement

获取元素对象
1.document.getElementById()
2.document.getElementsByTagName()
3.document.getElementsByClassName();
获取页面上所有元素对象
document.getElementsByTagName('*');

document.all; //仅IE支持

总结元素对象常用方法：
obj.innerHTML
obj.outerHTML
obj.length
obj.outerHTML
obj.innerText //即将淘汰
obj.textContent
obj.tagName

测试一些高度
obj.clientHeight; //本身的高
obj.offsetHeight; //包含边框的高

document.body.clientHeight; //文档的高 屏幕的文档区域的高
document.documentElement.clientWidth;
document.documentElement.clientHeight; //有效的高 屏幕可视的高
document.documentElement.scrollHeight; //屏幕的总高度
document.documentElement.scrollTop; //滚动的高 滚动的高度

document.documentElement.scrollTop //已经滚动了的高度，chrome不支持，其他支持
document.body.scrollTop; //已经滚动了的高度，仅chrome支持

js对象：
1.obj=new Object()
2.obj=document.getElementById()
3.obj={"name","user1"}

阻止默认行为：
event.preventDefault();
或者
return false;

1.<a href="inde.php" onclick="return false;">超链接</a>
2.aobj.onclick=function(event){
//event.preventDefault();
return false;
}
默认行为：a标签提交或者表单submit提交

js事件
onabort 图像加载被中断
onblur 元素失去焦点
onchange 用户改变域的内容
onclick 鼠标点击某个对象
ondblclick 鼠标双击某个对象
onerror 当加载文档或图像时发生某个错误
onfocus 元素获得焦点
onkeydown 某个键盘的键被按下
onkeypress 某个键盘的键被按下或按住
onkeyup 某个键盘的键被松开
onload 某个页面或图像被完成加载
onmousedown 某个鼠标按键被按下
onmousemove 鼠标被移动
onmouseout 鼠标从某元素移开
onmouseover 鼠标被移到某元素之上
onmouseup 某个鼠标按键被松开
onreset 重置按钮被点击
onresize 窗口或框架被调整尺寸
onselect 文本被选定
onsubmit 提交按钮被点击
onunload 用户退出页面
oncontextmenu 右键上下文菜单

js事件方法：
select();
focus();

getAttribute(); //获取属性的值
setAttribute(); //设置属性的值

js BOM浏览器对象
1.window对象
2.navigator对象
3.screen对象
4.history对象
5.location对象
6.document对象

window对象
属性：
frames //窗口数组
length //frame个数
name //窗口名字 target="win2"
opener //打开我的那个窗口
parent //父窗口
top //顶级窗口
closed //测试某个窗口是否被关闭

方法：
open("right.html","win2","特性")
窗口特性:
fullScreen=1|0 //是否全屏
width="" //窗口宽
height="" //窗口高
left="" //离屏幕左上角的left
top="" //离屏幕左上角的top
location=1|0 //是否有地址栏
menubar=1|0 //是否有菜单

alert()
confirm()
prompt()
setInterval()
clearInterval()
setTimeout()
clearTimeout()
close() //ie没问题，ff有问题,ff子窗口
moveTo() //ie没问题，ff有问题,ff子窗口
moveBy() //ie没问题，ff有问题,ff子窗口
resizeTo() //ie没问题，ff有问题,ff子窗口
resizeBy() //ie没问题，ff有问题,ff子窗口
scrollTo() //都支持，做一些滚动条有关的特效
scrollBy() //都支持，做一些滚动条有关的特效
navigator对象：
属性：
userAgent //更精确的版本

screen屏幕对象：
属性：
height
width

availHeight //有效高
availWidth; //有效宽

history历史对象：
属性：
length //返回历史个数
方法：
back() //后退一个历史go(-1)
forward() //前进一个历史go(1)
go(2) //前进两个历史
go(-2) //后退两个历史

location对象：
属性：
hash //获取url里的锚点
#abc
host //主机名
href //地址跳转，保留历史，也可以不写href直接写location="index.html"
pathname //index.html页面的名称
port //端口：80
portocol //协议 http:
search //参数 ?id=10&name=user1
方法：
reload() //加载当前页面，刷新当前页面
replace() //加载当前页面，还可以跳转，但是不留历史

文档内常用集合：
1.forms
2.elements
3.options
4.rows
5.cells
6.images
7.links
8.anchors //锚点
9.frames

Ajax无刷新技术:
1.找到Ajax对象xmlHttpRequest （xhr）
FF:
xmlhttp=new XMLHttpRequest();
IE:
xmlhttp=new ActiveXobject("Microsoft.XMLHTTP");

2.Ajax属性
xhr.responseText;
3.Ajax get方法
xhr.open("get","index.php",true);
xhr.send();
4.Ajax post方法：
xhr.open("post","index.php",true)
xhr.send(string) //必须是字符串
4.Ajax事件
xhr.readystatechange=function(){}

1. js DOM document object model
2.DOM对象集合
3.window.frames
4.document.froms
5.document.elements
6.document.elements[0].options
7.document.images
8.document.links
9.document.anchors
10.tabobj.rows
11.tabobj.rows[0].cells
12.eleobj.innerHTML
13.eleobj.outerHTML
14.eleobj.textContent
15.eleobj.getAttribute()
16.eleobj.setAttribute()
17.document.head
18.document.title
19.document.body
20.document.getElementById()
21.document.getElementsByTagName()
22.document.getElementsByClassName()
23.document.createElement()
23.js ajax XMLHttpRequest对象