Javascript及JQuery视频教学
第0讲 内容概述
Javascript有以下三部分组成：
ECMAScript (Flash:actionscript, Silverlight)
DOM
BOM
document.getElementById('mydiv').style.left
第1讲 JavaScript背景知识
结构(Structure) HTML XHTML
表现(Presentation) CSS
行为(Behavior) ECMAScript, DOM, BOM
第2讲 JavaScript基础
Camel标记法
Pascal标记法
匈牙利标记法
数组： a
布尔值： b
浮点数： f
函数： fn
整数： i
对象： o
正则表达式： re
字符串： s
变型： v
未定义： Undefined
空： Null
对象： Object
1. 字符串函数（String）：
length属性
charAt(i)
indexOf()
lastIndexOf() 找不到返回-1
slice, substring, substr
slice支持负数，并且支持数组操作
substring可以倒置序号，负数为0
substr起始位置，长度
document.write可以直接写html网页
2. 数值型（Number)
9e5 科学计数法
toExponential（）
3. 布尔型 （Boolean）
true，false
typeof(true)
数值类型转换为字符串，可以用toString（2，8，16）进行进制转换。
boolean
number
string
object
4. 数组
var arr = new Array(1,"1",true);
var arr = [1,2,3];
join（）方法，改变连接数组项的“，”分隔符
split（）方法，字符串风格成数组
reverse（）方法，数组反序，可以用来进行字符串反转
sort（）方法，数组元素排序
push（），pop实现栈的功能
var iNumber = Number(prompt("请输入一个数字", ""));
if (isNaN(iNumber)) {
}
日期对象
var myDate = new Date();
date1 - date2 毫秒数
new Date("month dd,yyyy hh:mm:ss")
new Date("month dd,yyyy")
new Date(yyyy,mth,dd,hh,mm,ss);
new Date(yyyy,mth,dd);
new Date(ms);
Math Object
ceil() floor(), round()
Math.floor(Match.random()*total + firstnumber)
Window对象
var win = window.open(url,"_blank","height=300,width=400,resizable=yes");
oWin.close();
oWin.opener
if (window.confirm("xxx")) {}
document Object
anchors
applets
embeds
forms
images
links
Location Object
location.href = url
location.replace(url) 不可以使用后退
location.reload(true,false) 默认是false
Navigator 对象
userAgent属性可以检测浏览器版本及操作系统版本
Screen 对象
window.moveTo(0,0);
window.resize(screen.availWidth,screen.availHeight);
第3讲 CSS基础
行内样式 style
内嵌式 <style></style>
链接式
导入式 @import url(1.css);
标记选择器 <p>
类别选择器
.class
ID选择器
#id
p b {} b标记嵌套p才有效
子选择器 ul.myList > li > a
属性选择器 a[title=CSS] {};
CSS设置文字效果
（1）文字样式
font-family 字体
font-size 字号
color
font-weight 粗细
font-style 斜体
text-decoration 下划线，删除线，顶划线
（2）段落文字
（3）首字放大
参见 project CSS基础 首字放大.jsp
CSS设置图片效果
（1）图片的边框
参见 project CSS基础 图片的边框样式.jsp
（2）图文混排
参见 project CSS基础 图文混排.jsp
CSS页面背景设置
(1) 设定背景颜色实现页面分块
参见 project CSS基础 背景颜色实现页面分块.jsp
(2) 设定背景图片
参见 project CSS基础 背景图片.jsp
(3) 设定超链接效果
参见 project CSS基础 设定超链接效果.jsp
第4讲 CSS进阶
1. <div>与<span>
<div>是段落标记
<span>是行标记
2. 盒子模型
content，border，padding和margin四个部分组成
浏览器兼容性：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
IE：height+width指content + padding + border
Firefox：content
3. 元素的定位
float定位
float:left;
position定位 absolute 四个属性：left,rigth,top,bottom
position: absolute;
父块采用position时，则子块相对与父块
若子块采用position:relative，则父块设置的padding起作用
若不希望div大小充满屏幕，自己设置float或width
Z-index: 页面垂直管理
CSS排版观念
<div id="container">
<div id="banner">
<div id="content">
<div id="links">
<div id="footer">
</div>