1.1
脚本的基本结构
Html页面内嵌JS代码
外部JS文件
简短缩写方式
1.2
类型 运算符
算术运算符+ - * / % ++ --
赋值运算符=
比较运算符> < >= <= == !=
逻辑运算符&& || !
1.3
javascript语法：
Javascript的关键字是小写。
javascript中不区分单双引号
javascript中的标实符合java相同字母数字下划线和美元符组成
javascript严格区分大小写
javascript中的注释符//和/**/两种
javascript中的undefined代表常量值没有或者没有值
内置对象如Date是大写。
DOM对象名称通常是小写，后边的单词大写。
0是假1是真，null是假！null是真
1.4
定义变量
通过var来定义，弱类型即是不用指定具体的数据类型。
js中的特殊常量是：undefined
当变量没有初始化就被使用，该变量的值就是undefined
var num="你好";
var num=123;//自动复数据类型
num=123;//自动生成变量
1.5
判断语句
if () {
}
Else if(){
}
Else(){
}
if(a=4)//可以赋值运算，而且可以同样进行判断，不报错
1.6
分支语句
switch(x)
{
case "abc"
alert()
break;
case "aa"
alert();
break;
Continue;
}
1.7
循环结构
var x=0;
while(x<3)
{
循环体
x++;
}
do{
循环体
}while(条件)
for()
{
}
1.8
注释
单行注释以 // 开始，以行末结束，
多行注释以 /* 开始，以 */ 结束，符号 /*…… */ 指示中间的语句是该程序中的注释
1.9
输入输出
>警告：alert()
alert(“提示信息”);
>提示：prompt()
prompt(“提示信息”, “输入框的默认信息”);
Prompt("情书你的姓名","于忠波");
注意：取消返回null确定返回一个字符串，
第二章：函数和window对象
2.1
函数的含义：
类似于Java中的方法，是完成特定任务的代码语句块，使用更简单：不用定义属于某个类，直接使用。
2.1.2
函数的特点：
>是完成特定功能并可以随时运行的语句。
>可以多个HTML网页用共用调用，提高了重用率
>可以使程序划分为一些相对独立的部分，任务单一，结构清晰，易读，易重用，易维护。
>可以实现一个函数和事件驱动相关联。
>可以传参一可以返回值。
2.1.3
系统函数：
parseInt ("字符串")：将字符串转换为整型数字
parseFloat("字符串")：将字符串转换为浮点型数字
isNaN()：用于检查其参数是否是非数字
2.1.4
自定义函数：
function 函数名(参数1,参数2，… )
{
JavaScript代码;
}
调用：事件名＝“函数名( 参数)" ;
2.2.1
window对象的常用属性
screen有关客户端的屏幕和显示性能的信息
history 有关客户访问过的URL的信息
location有关当前 URL 的信息
window对象的常用的方法
prompt显示可提示用户输入的对话框
alert显示带有一个提示信息和一个确定按钮的警示框
confirm显示一个带有提示信息、确定和取消按钮的对话框
close关闭浏览器窗口
open打开一个新的浏览器窗口，加载给定 URL 所指定的文档
setTimeout在指定的毫秒数后调用函数或计算表达式
setInterval按照指定的周期(以毫秒计)来调用函数或表达式
窗口特性：
height、width窗口文档显示区的高度、宽度。以像素计。
left、top窗口的x坐标、y坐标。以像素计
toolbar=yes | no |1 | 0是否显示浏览器的工具栏。黙认是yes。
scrollbars=yes | no |1 | 0是否显示滚动条。黙认是yes。
location=yes | no |1 | 0是否显示地址地段。黙认是yes。
status=yes | no |1 | 0是否添加状态栏。黙认是yes。
menubar=yes | no |1 | 0是否显示菜单栏。黙认是yes。
resizable=yes | no |1 | 0窗口是否可调节尺寸。黙认是yes。
titlebar=yes | no |1 | 0是否显示标题栏。黙认是yes。
fullscreen=yes | no |1 | 0是否使用全屏模式显示浏览器。黙认是no。处于全屏模式的窗口必须同时处于剧院模式。
常用事件：
onload一个页面或一幅图像完成加载
onmouseover鼠标移到某元素之上
onlick当用户单击某个对象时调用的事件句柄
onkeydowm某个键盘按键被 按下
onchange域的内容被改变
2.3.1
var 日期对象=new Date(MM DD,YYYY,hh:mm:ss)
var 日期对象=new Date(年，月，日，时，分，秒)
2.3.2
方法组：
setXxx这些方法用于设置时间和日期值
getXxx 这些方法用于获取时间和日期值
Date 对象的参数：
Seconds 和 Minutes0 至 59
Hours0 至 23
Day0 至 6(星期几)
Date1 至 31(月份中的天数)
Months0 至 11(一月至十二月)
2.4.1
定时函数：
setTimeout(“调用的函数”, “指定的时间后")
setInterval("调用的函数", "指定的时间间隔")
第三章：DOM编程
history对象
back() 加载上一个连接
forward() 加载下一个连接
go() 给一个数字加载连接
location的属性
href 设置或返回URL
host() 设置或返回端口号
hostname() 设置或返回主机名
Location对象的方法
reload()重新加载当前文档
replace()用新的文档代替当前文档
Document对象的属性
Referrer 返回载入当前文档的文档的URl
Url 返回当前文档的Url
Document对象的方法
getElementById()；根据id查找
getElmentByName();根据name查找
getElmentByTagName();根据标签名查找
Write();向文档写入信息
Visibility对象的方法
Visible 表示元素师可见的
Hidden 表示元素是不可见的
Display对象的方法
None 表示不显示
Block 表示为快级元素
例：object.style.display="值";
注意：Display和Visibility的不同：visibility会占据页面上的空间
Display不会占据页面上的空间
第四章：
1.什么是DOM？
文档对象模型(Document Object Model)
1.1通过DOM可以动态改变文档内容
动态改变文档内容的原理
>解析文档(如HTML)并生成DOM树
>通过DOM标准接口+编程语言改变文档内容
1..2Dom规定：
整个文档是一个文档节点；
每个HTMl标签都是一个元素节点
包含在Html元素中的文本是文本节点
每一个html元素都是一个属性节点
注释属于注释节点
1.2Dom组成
Core Dom
XMl Dom
Html Dom
1.2.1Core dom的标准节点操作
getElementById()；根据id查找
getElmentByName();根据name查找
getElmentByTagName();根据标签名查找
getAttribute(“属性名”);用来获取属性的值
setAttribute(“属性名”,”属性值”)用来设置属性的值
列：var node=document.getElementById(“名称”).getAttribute(“src”);
1.2.2节点层次：
parentNode 父节点
firstChiled 子节点
lastChild 最后一个节点
注意IE中要有Tbody
1.2.3创建和增加节点
CreateElement(tagname)按照给定的标签名称创建一个新的元素节点
appendChild(nodename)向已存节点列表的末尾添加子节点
insertBefore(newNode,oldNode)
cloneNode(deep)
1.2.4删除和替换节点的方法
removeChild()删除节点
replaceChild( newnode,oldnode) 替换节点
1.3.1
table
rows[]返回包含表格中所有行的一个数组
insertRow()在表格中插入一个新行
deleteRow()从表格中删除一行
tableRow表格行对象
cells[]返回包含行中所有单元格的一个数组
rowIndex返回该行在表中的位置
insertCell()在一行中的指定位置插入一个空的
标签deleteCell()删除行中指定的单元格
tableCell单元格行对象
cellIndex返回单元格在某行单元格集合中的位置
innerHTML设置或返回单元格的开始标签和结束标签之间的HTML
align设置或返回单元格内部数据的水平排列方式
className设置或返回元素的class属性
文本属性
font-size字体大小
font-family字体类型
边框属性
border 设置四个边框所有的属性
border-width设置边框的宽度
border-style设置边框的样式
border-color设置边框的颜色
边界属性
margin设置所有外边框属性
margin-left
margin-right
margin-top
margin-bottom分别设置元素的左、右、上、下外边距
填充属性
padding设置元素的所有内边距
padding-left
padding-right
padding-top
padding-bottom分别设置元素的左、右、上、下内边距
style对象的常用属性
类别属性描述
padding设置元素的填充
paddingTop paddingBottom
paddingLeft
paddingRight设置元素的上、下、左、右填充
border设置四个边框所有的属性
borderTop
borderBtttom
borderLeft
borderRight设置上、下、左、右边框的属性
注意：style中的属性和javascript中的属性不一样，javascript中的没有“-”号；
scrollTop、scrollLeft属性
scrollTop设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离
scrollLeft设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离
clientWidth浏览器中可见内容的高度，不包括滚动条等边线，会随窗口的显示大小改变
clientHeight浏览器中可以看到内容的区域的高度
Javascript中的事件：
onclick当用户单击某个对象时调用事件
onmouseover鼠标移到某元素之上
onmouseout鼠标从某元素移开
onmousedown鼠标按钮被按下
使用style属性改变样式
使用javascript改变样式
objli [i].οnmοuseοver=function(){
this.style.backgroundImage="url(p_w_picpaths/bg2.gif)";
}
获取类样式的方法
//IE浏览器
if(objLeft.currentStyle){
leftT=parseInt(objLeft.currentStyle.top);
}
//fireFox浏览器
else{
leftT=parseInt(document.defaultView.getComputedStyle(objLeft,null).top);
}
第六章：表达验证
字符串的方法：
toLowerCase()把字符串转化为小写
toUpperCase()把字符串转化为大写
charAt(index)返回在指定位置的字符
indexOf(字符串，index)查找某个指定的字符串值在字符串中首次出现的位置
substring(index1,index2)返回位于指定索引index1和index2之间的字符串，并且包括索引index1对应的字符，不包括索引index2对应的字符
例：
var mail=document.getElementById("email").value;
if(mail.indexOf("@")==-1){
alert("Email格式不正确\n必须包含@");
return false; }
文本框对象的属性、方法和事件
类别名称描述
事件
onblur失去焦点，当光标离开某个文本框时触发
onfocus获得焦点，当光标进入某个文本框时触发
onkeypress某个键盘按键被按下并松开
方法
blur()从文本域中移开焦点
focus()在文本域中设置焦点，即获得鼠标光标
select()选取文本域中的内容
属性
id设置或返回文本域的id
value设置或返回文本域的value属性的值
第七章：
正则表达式是一个描述字符模式的对象
定义正则表达式
表达式的模式
普通方式
var reg=/表达式/附加参数
例：var reg=/white/g;
构造函数
var reg=new RegExp("表达式","附加参数")
var reg=new RegExp("white");
RegExp对象的属性
属性描述
globalRegExp对象是否具有标志g
ignoreCaseRegExp对象是否具有标志i
multilineRegExp对象是否具有标志m
RegExp对象的方法
方法描述
exec检索字符中是正则表达式的区配，返回找到的值，并确定其位置
test检索字符串中指定的值，返回true或false
String对象的方法
方法描述
match找到一个或多个正则表达式的匹配
search检索与正则表达式相匹配的值
replace替换与正则表达式匹配的字符串
split把字符串分割为字符串数组
正则表达式常用符号
符号描述
/…/代表一个模式的开始和结束
^匹配字符串的开始
$匹配字符串的结束
\s任何空白字符
\S任何非空白字符
\d匹配一个数字字符，等价于[0-9]
\D除了数字之外的任何字符，等价于[^0-9]
\w匹配一个数字、下划线或字母字符，等价于[A-Za-z0-9_]
\W任何非单字字符，等价于[^a-zA-z0-9_]
.除了换行符之外的任意字符
正则表达式重复字符
符号描述
{n}匹配前一项n次
{n,}匹配前一项n次，或者多次
{n,m}匹配前一项至少n次，但是不能超过m次
*匹配前一项0次或多次，等价于{0,}
+匹配前一项1次或多次，等价于{1,}
？匹配前一项0次或1次，也就是说前一项是可选的，等价于{0,1}
Option对象常用属性
text：设置或返回某个选项的纯文本值
value：设置或返回被送往服务器的值
Select对象常用事件、方法和属性
类别名称描述
事件onchange当改变选项时调用的事件
方法add()向下拉列表中添加一个选项
属性
options[]返回包含下拉列表中的所有选项的一个数组
selectedIndex设置或返回下拉列表中被选项目的索引号
length返回下拉列表中的选项的数目
定义数组
//Array数组即使一个数组又是一个dictionary还是一个stack
//javascript中的Array对象是一个动态数组
类别名称描述
属性length设置或返回数组中元素的数目
方法join( )把数组的所有元素放入一个字符串，通过一个的分隔符进行分隔
sort( )对数组的元素进行排序
var Names = new Array();
var names={值1，值2，值3.....}
Names[0] = "tom";
Names[1] = "jerry";
Names[2] = "lily";
//调用循环遍历
for (var i = 0; i < Names.length; i++) {
alert(Names[i]);
}
//使用foresch遍历数组
for (var k in dictionary) {
alert(k);//输出0,1 验证了数组就是Dictionary的一个特例
}
//Array可以当Dictionary使用
var dictionary=new Array();
dictionary["钥"]="yao值";
dictionary["匙"]="shi值";
alert(dictionary["钥"]);
alert(dictionary.钥);//可以用点点出来
//使用foresch遍历Dictionary
for (var k in dictionary) {
alert(k);
}
alert(sum);//直接输出Array有一个默认的tostring方法
//排序
function getmax(arr){
var max=arr[0];
for (var i = 1; i
if (arr[i] > max) {
max = arr[i];
}
}
return max;
}
var sum = new Array();
sum[0] = 0;
sum[1] = 3;
sum[2] = 8;
sum[3] = 1;
alert(getmax(sum));
*/
/*
//字符串翻转
//第i个元素和第length - i个元素交换
//手写代码
var sum = new Array();
sum[0] = 0;
sum[1] = 3;
sum[2] = 8;
sum[3] = 1;
alert(sum);
for (var i = 0; i < sum.length / 2; i++) {
s = sum[i];
sum[i] = sum[sum.length - i - 1];
sum[sum.length - i - 1] = s;
}
alert(sum);
*/
定义对象
function Person(name, age) {
this.Name = name;
this.Age = age;
this.Sayhi = function () {
alert("大家好我是："+this.Name)
}
}
var p1 =new Person("于忠波", 24);//不要忘了new
p1.Sayhi(); //注意：Js中没有类，只是用函数模拟类
*/
234
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
