1. 修改某一节点的class属性：
<div class=”div1”></div>
var div1=document.getElementById(“div1”);
div1.className=”banner”;
问：为什么不直接用div1.class?
2. 可以在样式表中先定义样式，然后再将其赋予到标签节点中。
<style>
.div1{
width:100px;
height:100px;
background:red;}
</style>
<div class=” ?”></div>
3. 什么样是样式表的内嵌样式？
如上一题
4. 内嵌样式与行内样式的不同之处？
比如字号，内嵌样式font-size(匈牙利写法）
行内样式fontSize（驼峰写法）
javascript修改：
内嵌样式：div1.font-size=”28px”;
行内样式：div1.style.fontSize=”28px”;
5. 对象.style.样式
默认操作的行内样式style，如果操作内嵌和外联的样式理论上可以，但是不推荐。
6. css3改变行内样式有需要的时候要做兼容
div1.style.transform=”rotate(90deg)”;
div1.style.webkitTransform=”rotate(90deg)”;
div1.style.mozTransform=”rotate(90deg)”;
7. 获取网页对象的4种方式
document.getElement.ById(“id”);
document.getElementsByName(“name”);返回一组元素对象
8. document.getElementByName(“name”)返回的是一个类数组（Nodelist属性），什么是类数组呢？
类数组即类似数组，它只有length属性，而不支持平常数组的其他API。
9. 具有name属性的几个常用标签？
<img> < a> < input> < form> < frame>
10. 通过标签名称获取对象，类数组对象。
var ps=document.getElementsByTagName(“p”);
ps[i].align=”center”;
11. 通过class获取元素对象在ie（ie8报错，对象不支持这个方法，所以不怎么采用他）上和其他浏览器有兼容性问题。
var ps=document.getElementsByClassName(“p1”);
12.混合方式获取对象：
var siv1=document.getElementById(‘div1’);
div1.getElementsByTagName(“p”);
13.html5之后要求自定义属性要以data-开头。操作自定义属性要求用dom方式操作
<p icss=”p1”></p>
p[i].getAttribute(“icss”)返回属性值 setAttribute(“data-id”,”pp” )设置属性值
14.当网页超过一屏，超链接使用#号会发生什么效果？为了使它没有这种效果可以用超级链接调用js程序。
javascript：void(0);
href=”javascript:changeSize(36);”可以代替点击事件
15.js前端编程是事件驱动。
16.事件=事件源+事件类型+事件处理(事件回调函数)
17.注册事件（给节点注册）的方式：
0级事件：
行内写法：在html标签里直接注册时间，例如<input onXXXX=”XXX”>，缺点是只能调用全局函数，和HTML耦合度太高。不符合高内聚低耦合原则，我们主张js html css互相分离。
代码写法：
获得对象，对象.事件名称=事件回调函数 耦合度低
2级事件：默认false是冒泡型事件，true是捕获流事件
w3c标准写法：（IE不支持）
注册事件：事件源对象.addEventListener(事件类型，回调函数，事件流)；
移除事件： 事件源对象.addEventListener(事件类型，回调函数，事件流)；
IE写法：
注册事件： 事件源对象.attachEvent(事件类型，回调函数）;
注册事件： 事件源对象.detachEvent(事件类型，回调函数）;
兼容写法：
if(btn1.addEventListener){
btn1.addEventListener(“click”,m1);
}
else
{ btn1.attach(“onclick”,m1);
}
18.function m1(){
alert(“hello world”);
}
btn1.onclick=m1;与btn1.onclick=m1();的区别
19.事件回调函数：事件回调函数是只有在事件被触发才会运行的事件。
20.cannot set property “onclick” of null在什么情景会遇到呢？
在script在排头时。 若要使js在前改进这一情景可以用window.onload=function(){
}
21.双击事件 单击事件
ondbclick onclick
22.鼠标悬停事件
<input type=”button” value=”鼠标悬停” onmouseover=”this.style.color=’red’;”/>
23. this在事件回调函数中表示当前事件源。
24. 鼠标移上事件 鼠标离开事件
onmouseover 鼠标穿过子元素会(先离开父元素再进入会有闪烁感觉)重复触发事件
onmouseout
onmouseenter 鼠标穿过子元素不会重复触发事件
onmouseleave
25. 鼠标按下触发事件 鼠标松开触发事件
onmousedown onmouseup
26. 鼠标移动事件观察标题栏
<input type=”button ” value=”鼠标移动观察标题栏”onmousemove=”document.title=event.x”>
27. 获得焦点，和失去焦点
<input type=”text” value=”请输入” onfocus=”this.value=’ ’;” onblur=”this.alert(‘this.value’)”>
28. 键盘按下与松开事件
<input type=”text” onkeydown=”console.log(this.value);”/>
键盘按下并抬起，value值才算上去，故有一个延迟。因此常用的是onkeyup
30. 内容被改变事件onchange常用在下拉列表和文本框里面。
<select onchange=”alert(this.value)”>
<option value=”dalian”> 大连</option>
<option value=”beijing”> 北京</option>
<option value=”shanghai”> 上海</option>
</select>
31. btn1.onmouseover=function(){
this.style.color=”red”;
}
32.翻滚图，鼠标移上图片变换。如同灯图片开关。
33. 事件对象本身Event，代表事件的状态和信息，不同的事件触发获得状态和信息也不一样。
IE下获得： window.event
w3c标准: 回调函数的第一个参数就是这个对象（包含了这个事件的所有信息））
获取事件对象：
btn1.onclick=function(e){
console.log(e); //google firefox
console.log(window.event); //ie google
}
做兼容：
btn1.onclick=function(e){
e=e||window.event;
alert(e.type);
}
e.target获得事件源 w3c
e.srcElement IE
var currentObj=e.target||e.srcElement
34. 事件对象获得鼠标当前坐标。
document.omousemove=function(e){
e=e||window.event;
document.title=e.clientX+’,’+e.clientY;
}
35. 检查事件状态：
document.onmousedown=function(e){
e=e||window.event;
alert(e.button);
}
检查鼠标按下的是左0中1右2 火狐谷歌
IE 左1 中4 右2.
0 1 2 4都判断一下。
36. 判断是哪个浏览器
navigator.userAgent
判断字符串是否包含Firefox chromn msie
if(navigator.userAgent.indexOf(‘IE’)!=-1)表示字符串中包含有IE
37. 获得键盘按下哪个键：
单键按
document.onkeydown=function(e){
e=e||window.event;
console.log(e.keyCode);
}
38. ctrlKey altKey shiftKey 是否按下返回true或false，常用来创建快捷键
同时摁住a和ctrl则：
if(e.keyCode==65&&e.crtlKey==true)是二者同时摁下的条件。
39. keyCode对照表。
40. 事件流：
冒泡型 ：事件是从子元素传播到父元素
捕获型：事件是从父元素传播到子元素（IE不支持，而且只能用2级事件）
41. 阻止事件冒泡：
w3c: 事件对象.stopPropagation();
Ie: 事件对象.cancelBubble=true;
e.stopPropagation?e.stopPropagation():e.cancelBuble=true;阻止事件冒泡程序。
42. 阻止事件默认行为：
w3c:事件对象.preventDefault()
Ie: 事件对象.returnValue=false；
在事件回调函数中直接写 return false;
<a href=”http://”id=”a1”>链接</a>
var a1=document.getElementById(“a1”);
a1.onclick=function(e){
e=e||window.event;
e.preventDefault?e.preventDefault():e.returnValue=false; //如果没有这句话则会alert后跳转到另一个链接去。
alert(“连接被单击”);
}
43. 阻止页面右击行为：
document.oncontextmenu=function(e){
alert(“禁止右键”)
return false;
}
行内事件可以直接用return false来阻止事件默认行为
<a href=”http://www.baidu.com” onclick=”alert(“链接被点击”); return false;”>链接
44. 兼容性原理
var obj={
name:’tom’;
m1:function(){
alert(‘m1’);}}
alert(obj.name?obj.name:obj.pname);
object.m1?object.m1():object.m2();
45. position的属性
absolute相对于最近一级，定位不是static进行定位
fixed 相对于视口定位
relative 相对于其在普通文档流中定位
46. 折叠菜单的demo
for(var i=0;i<ps.length;i++){
ps[i].setAttribute(‘pid’,i);
ps[i].onclick=function(e){
var pid=this.getAttribute(‘pid’);
var currUL=uls[pid];
if(curryUL.style.display==”block”)
curryUL.style.display=”none”
else
curryUL.style.display=”block”;
}
}
47. typeof String返回function
typeof Array 返回function
typeof Date 返回function
typeof Math返回object
48. Math对象常用API
Math.abs() 如Math.abs(-12) Math.abs(“-12”)
Math.floor(-5.3) 获取-6 Math.floor(6.9)得到6
Math.ceil()与Math.floor()正好相反
Math.round()取得是四舍五入的值。
Math.pow(x,y)取得是x的y次方
Math.sqrt(25)开方得到5
Math.PI Math.E 是常量
49. javascript的数据类型
基本数据类型：number string boolean undefined null
引用类型：object function
50. 产生任意两个整数之间的随机整数的公式：
Math.floor( Math.random()*(max-min+1))+min
51. demo：产生20行4位数字随机验证码（大写字母随机码呢？）
65—90分别对应26个大写字母，String.fromCharCode(数字)可以将数字转换为字母。
52. demo：押大小
比较选择值与随机值，并可以通过人工修改其几率。
53. Date是一个类，而不是一个对象，可以将其用来创建对象，并使用对象的API
54. new Date()默认获取当前系统时间
55. Date创建对象的常用API
getYear()有兼容性问题，我们更喜欢用getFullYear();
getMonth() 返回0—11的值
getDay() 返回0—6的值
getDate() 返回日期值
getHours() getMinutes() getSeconds()
getTime()返回当前日期的毫秒表示法。
56. dom的定时器有两个：
setTimeout(functionName,time);隔多少秒执行一次
setInterval(functionName,time);每隔多少秒执行一次
57. innerHTML与innerText有何不同？
58. parseInt(“100px”)返回100
parseInt(“px100”)返回NaN
59. isNaN(“100”) isNaN(100)返回false
IsNaN(“100px”)返回true
60. eval()函数：
var r=”3+5”;
eval(r)返回8，是因为它可以进行字符串运算。
61. 创建一个文本框10行40列。
<textarea id=”t1” rows=”10” cols=”40”> </textarea>
62. 当为一系列相同或相近的节点注册事件时，用循环，再用setAttribute()增加新的属性做下标，进而对单个节点进行事件注册。
63. 标签页要实现某一样式单独改变，通常去掉全部样式，再令某一添加样式
64. css3 圆角属性
border-radius:50%px; border-top-right-radius:10px;
border-radius:10px 20px;
border-radius:10px 20px 10px;
border-radius:10px 20px 30px 40px;
65. css3 border-image属性
-moz-border-image:url( XXX.png) 30 30 round;round表示多个图片填充，stretch表示单个图片被拉伸，边框图片需要做兼容。
-webkit-
-o-
67. css3通过box-shadow来设置块状元素的边框阴影
box-shadow:10px 10px 5px #888888;
box-shadow:h v blur spread color inset(outset);
68. css3通过background-size来规定背景图片的尺寸
background-size:length|percentage|cover|contain;
69. <input type=”text” id=”t1”value=””>
var t1=document.getElementById(“t1”);
t1.focus();可以事先获取焦点
70. click(); focus(); select();事件对应表示进行事件触发。
71. dom和dhtml的区别
72. 添加子节点,dom和dhtml混写也可以，下面是分开的：
dhtml:var p=document.createElement(‘p’);
p.align=”center”;
p.innerHTML=”asdasd”;
dom:p.setAttribute(‘align’,”center”);
var txt=document.createTextNode(“sdasd”);
p.appendChild(txt);
div1.append(p);
73. div1.insertBefore(h1,p1);
在div中把h1插在p1之前。
74. removeChild()删除子节点，必须是直接父元素删除。
75. bom对象指的是整个浏览器，window对象常用api：
alert(); prompt();
confirm();返回布尔值
close();
open();
printl();打印当前网页
76. DOM对象包括：window >navigator history location screen document
77. document对象：
write();
title属性设置标题栏文字
...
78. Navigator对象代表当前浏览器的信息。
navigator.userAgent最重要,通常用来确定浏览器版本和类型
79. dpi:dip是每平方英寸的像素值，越大越清晰
screen.deviceXDPI指的是屏幕横向dpi
80. scrren.width返回当前机器的分辨率
81. history对象用来代表历史信息
history.back()返回上一个网址
history.forward() 进入下一个网址
history.go(-2)返回上两个网页，history.go()里参数为正数则是前进，负数则是后退。
82. location对象代表浏览器地址信息。
跳转到新网页：location.href=”新网页”，也可以做字符串返回，动态代表浏览器的跳转操作。
重新加载，动态代替浏览器的刷新操作
83. 获取textarea的值并不是用innerHTML或是innerText而是value值
84. 标签页常常自定义属性，作为下标。
85. 获得事件源对象
var currObj=e.target||e.srcElement;
this是注册事件的对象 而事件源是真正发生事件的对象。
86. 获取鼠标坐标
function(e){
document.write(e.clientX+”,”+e.clientY)}
87. 获取鼠标按键，左中右：
e.button
88. div1包含div2，div1.onclick=function(){
this.style.width=”100px”;
}
点击外围div2，会触发div1注册的事件，此时this表示div1（注册事件的对象），而事件源指的是div2。e.target||e.srcElement.
89. dom写法创建文本节点。
document.createTextNode(t1.value);