JavaScript

一．JavaScript
a)var s = “Helloworld”
s.slice(1,3) //从第一个取到第三个之前，而不包括第三个，下标从0开始。输出el
s.substring(1,3) //同slice。
s.slice(4) //当只有一个参数时，表示从第四个开始，后面全部默认取下来(包括第四个)。输出oworld

b)数组：var array = new Array(“a”,”b”,”c”); array[2]是c,下标从0开始。
c)字符串可以用==来比较，也可以用<，>来比较。
d)对话框
i.alert(“hello”) //弹出一个alert.
ii.var num = Number( prompt(“请用户输入一个数字：”,” ”) );
if(isNan(num)) {
document.write(“请输入一个数字，而不是其他字符。”);
}

二．CSS
a)使用方式
i.行内样式：<p style=”color:#FF0000; font-size=28px”>helloworld</p>
ii.内嵌式：<style type=”text/css”>
P{
color: #FF0000; //字体颜色
background-color:#000011; //页面背景色
font-style:bold; //字体粗细
font-size:18px;. //字号大小
font-family:Aria; //字体
text-align:center; //对齐方式
}
</style>
iii.链接式：在头部加一语句<link href=”a.css” type=”text/css”rel=”stylesheet”>，创建a.css文件。
b)选择器
i.标记选择器：p {......}
ii.类别选择器：.class
iii.Id选择器：#id
iv.子选择器：ul > li > a {.......} ，有>表示只作用于子元素，而不作用于孙元素。
c)盒子模型
i.margin：边框与外面的距离，
ii.border :边框，
iii.padding：边框与里面的距离
d)元素的定位
i.float: left .....
ii.position:
1.absolute(绝对定位)，同时还要设置top 和left。子元素和父元素都要加absolute.
2.Relative(相对定位)，同时还要设置top 和left。只有子元素加就可以了。
iii.z-index空间定位
e)z-index值设
1.置大小，当有三个区域有覆盖的地方，z-index值大的排在上面，小的排在下面,大的会覆盖掉小的。

三．文档对象模型DOM
i.元素节点、属性节点、文本节点。
ii.访问节点：
1.var d = document.getElementsByTagName(“li”);
d.length d[0].tagName//标记名称 d[0].childNotes [0].nodeValue//子节点的第一个值
2.getElementById
iii.父子关系：var d = document.getElementsByTagName(“li”);
If(d.hasChildNodes()) {
Var dd = d.childNodes;
}
b)事件
i.οnclick=”add(‘hello’)” //鼠标点击调用add函数
ii.window.onload = function add( ) {.......}
iii.p.onclick = function add() {....}
iv.mouseover //鼠标指到指定地方

四．表单
a)<form name=”form1” action =” ” method=”psot” >
document.forms[“form1”]
b)<label for=”u”>请输出用户名：<br>
<input type=”text” name=”username” id=”u”/>
</label>
注：label的for属性值要和对于的input的id值，这样做为了用户的使用友好。
c)下拉菜单
i.<select name=”color” id=”color”>
<option value=”red”>红色</option>
<option value=”blue”>蓝色</option>
</select>
d)单选项
i.<input type=”radio” name=”sex” id=”female” value=”female”><label for=”female”>女</label>
ii.<input type=”radio” name=”sex” id=” male” value=”male” > <label for=” male” >男</label>

e)多选项
i.<input type=”checkbox” name=”color” id=” red” value=”red”> <label for=” red” >红色</label>
ii.<input type=”checkbox” name=”color” id=” blue” value=”blue”> <label for=” blue” >蓝色</label>
iii.<input type=”checkbox” name=”color” id=” yellow” value=”yellow”><label for=” yellow” >黄色</label>
f)多行文本框
i.<input type=”textarea” name=”message” id=”message” cols=”30” rows=”5”></input>
g)聚焦
i.<input type="text" name="username" value="xumiao" οnmοuseοver="this.focus()" οnfοcus="this.select()"/>
鼠标放到标签上时，就会选中里面的值。

五．JavaScript的调试和优化
a)JavaScript中区分大小写
b)try{....}catch(exception){....}

六．JQuery
a)jQuery是一个优秀的JavaScript框架
要引入：<script language=”javascript” src=”jquery.min.js”></script>