1.pdo y预处理
2.js 是基于 对象和类的 一门网站编程语言
3.js 放置 在 Head 和 body 中
4. js 基础对象：
window //窗口对象
document //文档对象
document.documentElement //html 对象
document.body // body 对象
document.head //head 对象
先好 标签 ，在把它变成 一个 JS 元素对象
设置对象的宽和高的时候 不带单位 ， 是一个 整数
JS 可以改变 一个标签的 样式和添加 事件，就是所谓的特效
js的变量：
1. 字符串
2.整形 ->双引号当中的东西
3.浮点
4.布尔Boolean : true 和 false :
转布尔类型的方法：(1):Boolean(num); (2):!!num; //就是前面加两个感叹号
转布尔类型哪些为假：0 ， false ,"", NaN ,undefined, null
转布尔类型哪些为假:
5.数组 的定义：
1. var arr = new Array(1,2,3,4,5);
2. var arr = new Array();
arr[0]="gfd"f;
arr[1]="fd";
arr[2]="hjh";
3.var arr=[1,345,45,4,564];
4.var arr=[];
arr[0]="dfd";
arr[1]="hty";
5.
6.Js的对象
1.alert(window.document.documentElement);
2.var obj = new Object(); //空对象
3. josn 对象： var obj = {
"neme":"shiwei",
"age":"12",
"tryr":"iui"
}; //相当于键值对
alert(obj.name); //打印 name 属性的值为： shiwei
7.json 对象
8.NaN 是 Not a Number 的缩写，不是一个数字
将一个字符串 强制类型转换为数字 ，用Number();
9.null
10.undefined
Global 对象存在，但打印不出来，但是他的几个方法非常有用，可以随便用，例如：
1.var num = "12px";
alert(parseInt(num));
结果为 10；
2.isNaN();
3.typeof(num); //检测对象的数据类型，这个方法 可以随便用。
而 tupeof(数组)；的时候 。结果为Object ,原因是 数组也是 new 出来的。
4.parseFloat();
5.eval();//将一个表达式 字符串当成表达式来执行，例如：
var str = 'num=10+5';
eval(str);
alert(num); //结果为15
6.String();//强制类型转换,调用时 不需要对象，直接使用
7.Number();//强制类型转换
8.Array();//强制类型转换
9.Bool();//强制类型转换
10.encodeURLComponent();
11.decodeURLComponent();
*******eval()方法用于把 json字符串转换为 json对象，供 Js 使用：
1>var str ='{"name":"wang"}';
eval(str); 会报语法错误，而下行就是对的，加了个圆括号
2>var str ='({"name":"json"})';eval();完一个json 就是一个对象
alert(eval(str).name); 结果为 wang
3>var str ='{"name":"json"}';
var obj = eval("("+str+")"); //很重要重要
alert(obj.name); 结果也为 wang ,也可以达到目的
总结： 圆括号 里面的东西本来就可以执行
JS 对象 一般有两大门派；
1.浏览器底层对象 例如window ,document 和页面当中标签对象
2.Js 语言 当中 内嵌的 一些对象 例如 new 来的，或者是NaN
1.new 创建对象 用的
2.this 代表本对象
3.in 包含运算符，检查这个属性 是否属于这个对象
var obj = new Object();
obj.age = "user1";
alert("age" in obj); 结果为 true ,属性要用双引号括起来
对于数组来说下角标 是 数组的 属性
var obj = new Object();
obj.name = "shiwei";
obj.age = "12";
obj.sex = "male";
for(var i in obj){
alert(i);
}
4.instanceof 检查某个对象 是否由 某个 构造函数产生的
5.delete 不能删除 用Var 定义的变量， 其他的 都可以 用delete 删除
var obj=["a","b","c"]
delete
onclick 鼠标单击事件
onblur 鼠标失去焦点事件
js 不支持索引数组
js 只有对象的属性才是字符串，不允许是数字
js 中数组的下标不允许是字符串，只能是数字。
Js 语法：
1.if....else
2.for
3.while
4.switch...case..
5.for..in...
6.with
with(document){
write("<h1>"+"aaaa"+"</h1>");
write("<h1>"+"bbbb"+"</h1>");
write("<h1>"+"cccc"+"</h1>");
write("<h1>"+"dddd"+"</h1>");
}
消息框：
1.alert(); 警告 ： 括号中可以直接写入数字，不用加双引号
2.confirm(); 确认
3.prompt(); 提示
Js 变量作用域：
只有在 函数内定义的带 Var 的是局部变量， 在其他地方定义的全都是 全局变量。
Js 函数：
有名的函数： function show(){}
无名的函数： obj.say = function(){}
obj.say(); 调用
Js 内置对象：
1.数学
2.日期：
3.定时器：
4超时器：
5.字符串
6.数组：
1> 数学对象：
属性： Math.PI : 圆周率
方法:
Math.ceil(); 上取整
Math.floor(); 下取整
Math.round(); 四舍五入
Math.random(); 0~~~~1之间的一个随机数
Math.max();alert(Math.max(1,2,54,96,6)) //取最大
Math.min(); 、、取最小
2. 日期对象：
var date = new Date(); //得到系统时间，但是格式不是我们想要的
date.getFullYear(); //得到年数， 例如2018
date.getMonth(); //得到 月数 ， 但是要加一，Because 输出结果是从0~~~11
date.getDate(); // 得到 日 数
date.getHours();//得到 当前的 小时 数
date.getMinutes(); // 得到当前的分钟数
date.getSeconds(); //得到当前的 秒 数
date.toLocaleString(); //把时间本地化，例如 2018年10月25日下午12:45:45
Interval : 时间间隔
定时器：
setInterval(); //开启一个定时器
clearInterval(); //停止一个定时器，括号中为一个定时器对象。
超时器：
setTimeout(); //开启一个超时器，只执行一次
clearTimeout();
字符串函数：
属性：length
方法：
indexOf() //检索第一次出现的字符串
lastIndexOf() //检索最后次出现的字符串
substr(1,5) //截取字符串，第一个参数为开始的下标，第二个为长度
slice(start,end) //也是截取字符串，不过两个参数为开始和终止下标。不包含结束下标
split(reg) //把字符串切割为字符串数组，支持正则分割
search(reg) //匹配到 返回的是首次出现的位置。 匹配不到的 是 -1
match(reg) //匹配到返回的是匹配的字符串数组， 匹配不到的是 null
replace(reg,"str") //返回的是替换后的新字符串，若没有替换， 则返回原字符串。
数组函数：
属性：length;
pop() //弹出数组最后一个元素的值，返回并且改变原数组
push() // 从数组最后压入一个值，并且返回数组长度
shift() //从开头删除一个元素，返回并且改变原数组
unshift() //从数组开头压入一个值，并且返回数组长度
reverse() // 把数组元素进行反转，
concat() //连接多个数组
slice(start, end) // 对数组进行切片
//在 Js 中经常拿着函数名乱跑，都没有圆括号，
//注意，此处之添加一个回调函数，只写函数名，没有后面的原括号，
意味着我只要你的函数代码，但我并不让你的函数执行，
sort(show)
//show(a,b){
return a-b; //正序
return b-a; //倒序
}
splice(start,num,padding) //返回删除并填补的字符串，
//2,1,"abc" 从下标为 2 开始，删除 1个， 并且在删除位置插入abc
//2,3,"abc" 从下标为 2 开始，删除3个，并且在删除位置插入abc
常用 Js Dom 对象：(document)文档对象
1.window对象
2.document对象
3.document.head对象
4.document.body对象
5.document.title对象
6.document.documentElement对象
获取元素对象：
1.document.getElementById(); 通过标签的id 属性
2.document.getElementsByTagName(); 通过标签名,结果为一个数组
3.document.getElementsByClassName(); 通过标签的 class 属性
4.document.getElementsByName(); 通过标签的 name 属性
获取页面上的所有的元素对：
document.getElementsByTagName("*");
总结元素对象常用的属性：
<h1><span id="sp1">0001</span></h1>
obj.innerHTML; ：<span id="sp1">0001</span>
obj.length; ：长度
obj.outerHTML; //获取整个标签 ：<img src=""><span id="sp1">0001</span></img>
obj.innerText; //文本内容 :0001
obj.textContent; //只是文本内容:0001 标准
obj.tagName; //获取标签名
如何判断ie 浏览器 和 非 ie 浏览器：
document.all; 这种语法只有 IE 支持，是老用法
获取高度：
1.文档的高 屏幕的文档区域的高
document.body.clientHeight //body的高
document.body.clientWidth 宽
2.有效的高 屏幕可视的高
document.documentElement.clientHeight //屏幕看得到的高
document.documentElement.clientWidth 宽
3.屏幕的总高度
document.documentElement.scrollHeight //出现滚动条时的总高度
4.滚动的高度
document.documentElement.scrollTop //有滚动条时已经滚动的高
document.body.scrollTop //谷歌中获取已经滚动了的高
window.scrollBy(向右滚动的像素数，向下滚动的像素数)，
测试一个 Div 的一些高度：
obj.clientHeight; //本身的高
obj.offsetHeight; //包含边框的高
定义对象： obj = new Object();
元素对象： obj = document.getElementById("imgid");
json 对象： obj = {"name":"user1"}
浏览器默认行为：
<a href="index.php" target="_blank"></a>
<input type="submit" name="sub" value="提交">
<input type="reset" name="set" value="重置">
//事件标签返回 return false 就会阻断标签本来的默认行为
例如：<a href="javascript:;" onclick="alert(1); return false;">
可用于登录验证
事件绑定：
1.<button id="bid" onclick="js"></button>
2.<button id="bid"></button>
<script>
bid = document.getElementById("bid");
bid,onclick=function(){
alert(111);
}
</script>
Js 事件类型：
1.onclick // 单击
2.ondblclick //双击
3.onmouseover // 鼠标被移到某元素上之上
4.onmouseout //鼠标从某元素上离开
5.onmousedown //某个鼠标按键被按下
6.onmouseup //某个鼠标按键被松开
7.onmousemove //鼠标被移动
8.onkeydown //键盘上某个键被按下
9.onkeyup //键盘上某个键被松开
10.onkeypress //键盘上某个键被按下或者按住
11.onblur //元素失去焦点
12.onfocus // 元素获得焦点
13.onreset // 重置按钮被按下
14.onsubmit // 提交按钮被按下
15.onselect //文本被选择
16.onresize //窗口或框架被调整尺寸
17.onload //某个页面或图像被加载完毕
18.onabort //图像加载被中断
19.onerror //当加载文档或者是图片时失败了
20.oncontextmenu // 右键上下文菜单
21.
Js 事件方法
focus()
select()
浏览器对象模型的英文缩写：
brower Object Model:
1.window 打开页面open(),alert().定时器
2.navigator 浏览器对象 ，获取客户端浏览器版本
3.screen 屏幕对象，获取客户端分辨率
4.history 对象，获取上一个历史
5.location 地址栏，页面跳转或者加载当前页面
6.document 对象（DOM），文档对象
window对象：
属性：
self： 返回对当前窗口的引用。等价于 Window 属性
frames //窗口数组
length //frame 个数
name // 窗口名字 ： target="win2"
opener //打开我的那个窗口(父窗口)
parent //父窗口
top //顶级窗口
closed //测试某个窗口是否被关闭
window.opener; //此属性返回 一个 父 窗口的 window 对象
方法：
open("right.html","win2","特性")； //返回所打开的 子 窗口的 window 对象
窗口特性：
//注意： 其中的有些属性很多浏览器已经都不支持了。用是自己就侧一测吧。
fullscreen = 1|0 //是否全屏
width ="" //窗口宽
height ="" // 窗口高
menubar // 是否显示菜单
toolbar //是否显示工具菜单
location //是否显示地址栏 ，只有在工具栏显示的情况下，设置地址栏不显示才起效果，其他情况没有用。
fullscreen//是否全屏
top 和 left // 位置坐标
window的方法：
alert();
confirm();
prompt();
setInterval();
clearInterval();
setTimeout();
clearTimeout();
close();
moveTo(); //窗口移动到一个坐标处
moveBy(); // X 和 Y 移动多少，
resizeTo(); //改变大小到 多少（x,y）
resizeBy(); //每次增加大小多少
scrollTo(); //当有滚动条的时候， 滚动到多少
scrollBy(); //滚动增加多少
navigator对象：
属性：
appName: //大概判断
userAgent //更精确的版本
history:
方法：
go(); //退回前一页面参数为 -1，向前进 为正数
back(); //后退历史,与 go 相反
forward(); //前进一个历史
go(2); // 向前进两个历史
location对象:
属性：
hash: //获取url 的锚点 #abc
href : 当前的 url 的地址，属性赋值则跳转也可以，保留历史，
不写href ,直接写 location =" index.html"; 也可以
pathname: //页面的名称
port : 端口 ：80 但默认不显示
search: 参数 ?id=10&name=user1
方法：
reload(); //加载当前页面，刷新当前页面
replace(); //加载当前页面， 还就可以跳转(地址替换)，但是不留历史
Screen对象:
属性：
availHeight 返回屏幕的高度（不包括Windows任务栏）
availWidth 返回屏幕的宽度（不包括Windows任务栏）
height 返回屏幕的总高度
width 返回屏幕的总宽度
Js DOM 属性和方法：
元素对象常用属性：<h1 id="h1id" class="h1class" name="na"> <span> test</span> </h1>
obj.getAttribute();
alert(obj.id); //结果为：h1id
alert(obj.calss); //不可用
alert(obj.name); //不可用
alert(obj.title); //结果为 title 属性值
alert(obj.style); //结果为 style 属性值
alert(obj.className); 结果为 class 属性值
XML DOM 内容：
获取元素对象方法：
document.getElementById(); //通过 id 属性
document.getElementByTagName(); // 通过 标签名
document.getElementByClassName(); // 通过 class 属性
document.getElementByName(); // 通过 name 属性，不是所有标签都有 name 属性
万能的 获取 元素对象的属性的方法：
obj.getAttribute("class");
万能的 设置 元素对象的属性的方法：
obj.setAttribute("name","shiwei");
<h1 id="h1id" class="h1class" name="na"> <span> test</span> </h1>
获取元素标签内的 HTML 内容：
obj.innerHTML; 结果为： <span> test</span>
获取元素标签内的 Text 内容：
obj.textContent; 结果为：test
获取元素标签外的 html 内容：
obj.outerHTML; 结果为：整个标签all
获取元素对象的标签名：
obj.tagName; 结果为： h1
在 Js 中根本就没有所谓的 数组 ；只是以 一部分 数组元素为下标的数组对象
常用的不外乎：图片、a 链接 、表单、 表格、锚点、框架里的帧
文档内常用的集合：
表单：
1. forms集合： //所有的 form 标签元素集合
2. elements集合； //表单子元素input . select textarea
3. options 集合；//下拉菜单
表格：
4. rows 集合； //表里的行
5. cells 集合； //行里面的格
6. images集合； img 标签集合
7. links 集合； a 标签集合
8. anchors集合； 具有 name 属性的 a 标签的
9. frames 集合； frame 标签集合
Ajax 无刷新技术:
-------------------------------------------------------
1.找到 Ajax 对象：obj= xmlHttpRequest(xhr)
huohu:
xhr = new XMLHttpRequest();
IE:
xhr = new ActiveXObject("Microsoft.XMLHTTP");
2.Ajax 属性：
xhr = responseText;
3.Ajax 方法：
xhr.open("get","index.php?id=100&name=user_1",true); //异步传输
xhr.send();
4.Ajax 事件：
xhr.onreadystatechange = function(){ };
浙公网安备 33010602011771号