JavaScript基础教程

/******************************************************************************************/

javascript:

语言特点：基于对象 事件驱动 脚本语言

运行在客户端

作用：增加交互效果

javascript三大部分：

ECMSCRIPT

DOM 页面结构对象

BOM 浏览器对象

基本写法：

<script>

script语言代码；

</script>

script 引用形式：

外部的：xx.js

<script src="aa.js"></script>

内部的：

<script>

</script>

标签中的<input οnclick="javascript:alert(xxx)">

script语法:

变量声明: var 名字=赋值

类型：number boolean string object undefied null

typeof(变量)

运算符: ++ -- > < % +-/*

条件语句：

if else ; switch case

循环语句：

for while

注释：

// /**/

输入输出：prompt(提示语，默认值)

document.write(打印页面的内容);

/***********************************************************************************/

javascript对象

属性 方法 事件

window 属性 ：

screen:宽，高 screen.height screen.width screen.availWidth screen.availHeight

history : forward() go(1) back() go(-1)

location: host hostname href

reload() replace("new.html")

window 方法：

alert("xxxxx") 提示框

prompt("xxxx") 弹出输入框

confirm("对方水电费") 确认框

open( "打开页面路径和名字"); open( "打开页面路径和名字"，“名称”,“属性”);

close() 关闭

setInterval("函数",时间毫秒数)； 间隔时间一直执行

clearInterval(定时对象)；

setTimeout("函数",时间毫秒数); 间隔时间后执行一次

clearTimeout(定时对象)

window 事件

onload ：页面加载事件

onclick :按钮 图片 p span td div

onmouseover: 鼠标悬浮事件 img li span td div p

screen:属性

history:方法

location:属性

方法

Date 时间对象

var time= new Date() ；

time.getXxx() getFullYear() getMonth() getDate() getDay() getHours() getMinutes() getSeconds();

setXxx()

递归：方法自己调用自己

/******************************************************************************************/

javascript:

语言特点：基于对象 事件驱动 脚本语言

运行在客户端

作用：增加交互效果

javascript三大部分：

ECMSCRIPT

DOM 页面结构对象

BOM 浏览器对象

基本写法：

<script>

script语言代码；

</script>

script 引用形式：

外部的：xx.js

<script src="aa.js"></script>

内部的：

<script>

</script>

标签中的<input οnclick="javascript:alert(xxx)">

script语法:

变量声明: var 名字=赋值

类型：number boolean string object undefied null

typeof(变量)

运算符: ++ -- > < % +-/*

条件语句：

if else ; switch case

循环语句：

for while for in

注释：

// /**/

输入输出：prompt(提示语，默认值)

document.write(打印页面的内容);

console.log()

数组： var arr = new Array();

var arr=[1,2,3,4,5];

var arr = new Array(3,4,5,6,7);

arr[5]="sss";

arr[0]="aaa";

arr["ssss"]="aaaa";

for( var j in arr)

{

arr[j];

}

/***********************************************************************************/

javascript对象

属性 方法 事件

window 属性 ：

screen:宽，高 screen.height screen.width screen.availWidth screen.availHeight

history : forward() go(1) back() go(-1)

location: host hostname href

reload() replace("new.html")

window 方法：

alert("xxxxx") 提示框

prompt("xxxx") 弹出输入框

confirm("对方水电费") 确认框

open( "打开页面路径和名字"); open( "打开页面路径和名字"，“名称”,“属性”);

close() 关闭

setInterval("函数",时间毫秒数)； 间隔时间一直执行

clearInterval(定时对象)；

setTimeout("函数",时间毫秒数); 间隔时间后执行一次

clearTimeout(定时对象)

window 事件

onload ：页面加载事件

onclick :按钮 图片 p span td div

onmouseover: 鼠标悬浮事件 img li span td div p

onmouseout: 鼠标离开事件

onchange : 内容变化事件 单行文本框 下拉框 多行文本框 密码框

Date 时间对象

var time= new Date() ；

time.getXxx() getFullYear() getMonth() getDate() getDay() getHours() getMinutes() getSeconds();

setXxx()

递归：方法自己调用自己

Dom document

核心：getElementById(“id”)

getElementsByName("name")

getElementsByTagName("标签名")

悬浮： 图片元素.src="图片"

全不选 全选： checkbox.checked=true|false;

innerHTML:元素开始标签，结束标签中间内容部分

htmldom操作

table.rows

table.insertRow(0) table.deleteRow(2);

行.cells

行.insertCell(0)

单元格.id="";

单元格.className=""

单元格.innerHTML=ss

css样式操作：

元素.style.css属性名=值

元素.className="类样式"

内置对象：

Math.ceil() floor() random()

Array length push() pop()

Date getXxx setXxx

js创建对象

var obj = new Object();

obj.name=""

obj.fun=function(){}

方式2：

var obj={ 属性名:值，属性名2：值2，fun:function(){ } }

简化：

构造函数 : this

var obj=new 构造函数();

原型

构造函数:function Flower(){ }

Flower.prototype.属性=值；

Flower.prototype.fun=function(){ }

var obj=new 构造函数();

继承 原型链

function Person( sss ) { }

function Woman( sss ) {

Person.call(this,参数) | Person.apply(this,[])

}

Woman.prototype=new Person();

Woman wman= new Woman();