JavaScript学习总结

时间:2024.4.20

1、 JavaScript变量可以使用var事先进行声明,也可以用赋值语句隐藏声明。对于一个变量,它存在指的是它拥有值。检查一个变量是否有值的方法是使用Window对象,因为JavaScript声明或使用的变量都属于Window对象的属性。

2、 JavaScript函数使用function命令声明,如果函数有返回值,在调用时就可以使用指定语句获取返回值。当调用函数传入参数时,函数即使没有指明参数名称,也一样可以使用参数数组的对象arguments获取参数的个数和参数值。

3、 局部变量:在函数内声明,只能在函数内的程序使用;全局变量:在函数外声明,整个JavaScript程序的函数和程序代码都可以使用。

4、 自定义JavaScript的对象:直接建立Object对象副本后,可新增所需的属性和方法;建立对象的构造函数,定义属性和方法,使用new命令建立对象副本时,构造函数传入的参数是对象的属性值,如果在建立副本时未指定属性值,一样可以在建立副本后再设置对象的属性值。

5、 JavaScript的内置对象:Array、Date、Function、Math、String···

6、 DHTML对象模型:是将浏览器和HTML文件的标签都对象化,以便JavaScript程序代码可以轻易地操控浏览器和访问HTML标签的对象。

版本3.x BOM、版本4.x DHTML=BOM+DHTML DOM、版本5.x BOM+W3C DOM

7、 DOM对象模型是一种拥有扩展性的文件架构

DOM Level 0 - DHTML DOM、DOM Level 1 – W3C DOM

DHTML DOM 和 W3C DOM 的差异在于DHTML DOM只是将整份HTML文件都对象化,每一个HTML标签都对应有标签对象;W3C DOM属于一种通用的文件浏览和访问机制,可以将整份HTML或XML文件视为一种阶层架构的树状结构。

8、 DHTML对象模型的完整架构是由BOM的根对象Window开始。

9、 Window对象:浏览器的窗口对象

浏览器的状态栏:属性defaultStatus、status

定时器:方法setTimeout(express,time) clearTimeout()

只会运行一次,在经过设置的一段时间后,运行指定的函数或表达式

方法setInterval(express,time) clearInteval()

一旦启动就可以周期性地运行函数或表达式

窗口的打开与关闭:open(url,winName)方法可以打开一个全新的窗口,并且使用JavaScript程序代码获取新窗口的Window对象;在父窗口使用winID访问新窗口的属性和方法,Window对象的opener属性可以参考到父窗口的Window对象。

Close()方法可以关闭一个窗口。

10、Window对象内置对话框:

alert(message) 显示一个警告信息的窗口,参数就是显示的信息内容。

confirm(message) 一个确认的对话框,参数为信息内容,传回true表示单击”确认”按钮,false为”取消”按钮。

Prompt(msg,value) 显示输入文字内容的对话框,参数msg为信息内容,value为默认值,传回用户输入的字符串。

showModelessDialog(url,arguments,features) 显示一个新的窗口,参数url为显示的网页。arguments为传送到显示网页的参数,可以是任何数据,例如对象;在显示的网页中可以使用window对象的dialogArguments属性获取传递过来的参数。feature参数可以设置对话框的外观。

11、更改窗口的尺寸和位置:

Window对象的属性:screenLeft传回左边界的坐标 screenTop传回上边界的坐标

Window对象的方法:moveTo(x,y) 将浏览器移到坐标x和y的位置

moveBy(offsetx,offsety) 将浏览器目前的位置移动参数的位移量

resizeTo(width,height) 将浏览器窗口调整为参数width和height的尺寸

resizeBy(offsetx,offsety) 将浏览器窗口尺寸放大或缩小

12、窗口内容的卷动

Window对象的方法:scroll(x,y)、scrollTo(x,y) 滚动窗口内容到指定的位置

scrollBy(offsetx,offsety) 从目前窗口内容的位置,滚动参数的位移量

13、Navigator对象:获取浏览器和系统资源的信息

14、History对象:保存历史记录

15、Location对象:保存目前URL网址的详细数据

属性:href 返回完整的URL字符串,重设该属性可以转向链接到其他的网址

方法:reload() 重新加载现在打开的HTML文件,如同浏览器工具栏中的“刷新”按钮

replace(url) 转向到参数url的网址,如同设置href属性

16、Document对象:

打开与写入文件:方法open(“text/html”,”replace”)可以清除目前的文件内容,第一个参数是MIME类型,text/html就是html文件,第二个参数replace可以取代历史记录,浏览器就无法按工具栏的“上一页”按钮返回上一页。

方法 write()或writeln()输出HTML文件的内容

方法 close()显示输出的内容

获取文件的指定元素:getElementById()

17、JavaScript的Cookies处理:Cookies可以在客户端的计算机保存所需的数据,可以使用Document对象的cookie属性处理Cookie的访问,返回的字符串使用“;”分隔每一个Cookie

新增Cookie函数:saveCookie(name,value,expires)

获取Cookie值函数:getCookie(name)

检查Cookie是否存在的函数:checkCookieExit()

删除Cookie函数:deleteCookie(name)

18、DHTML DOM的Collection对象:

document.all对象集合可以获取HTML文件中所有的标签对象,这是一个数组对象,依照标签在HTML文件出现的顺序,可以使用索引值访问指定的标签对象,如document.all[i]。也可以直接使用id属性获取,如document.all(“myId”)或myId。

如果HTML文件拥有同名的id属性,获取的仍然是一个集合,还需要使用item()方法获取指定的标签对象。

同理,myBody.all对象集合可以获取id为myBody的body区域块中的所有标签对象。

在all对象集合的所有标签对象中,可以进一步使用tags()方法筛选出指定标签的对象集合,如document.all.tags(“p”),可使用length属性获取共有多少个<p>标签。

19、HTML文件的阶层架构:

HTML文件中的标签属于一种阶层架构,可以使用parentElement属性获取上一层的标签对象,用children对象集合获取下一层标签的对象集合,这个对象集合可以进一步使用item()方法获取指定的标签对象。

20、访问HTML标签的内容:

innerText() 访问标签对象的内容

innerHTML() 访问标签对象内的子标签和内容,不包含标签对象本身

outerText() 访问标签对象的内容,可以用来取代整个标签对象

outerHTML() 访问标签对象的子标签和内容,包括标签对象本身

21、访问HTML标签的属性:

在获取HTML标签的对象后,也可以访问标签对象的属性

22、CSS层级式样式表:

HTML标签都拥有默认的显示样式,CSS能够重新定义HTML标签的显示效果,也可以自定义新的样式名称。

如果是class属性,则定义的样式名称以”.”句点开始,可以定义多个值,并且可以应用到多个标签上

如果是id属性,则定义的样式名称以”#”开始,可以定义多个值,但只能应用到一个标签上

23、动态样式CSS:

CSS样式属性可以对应Style对象的属性,在获取HTML标签对象后,可以访问Style对象的属性,如:objEle.style.color

24、DHTML的事件:

事件就是在浏览器显示和阅读HTML文件时,鼠标、键盘或文件加载等操作所触发的一些动作

鼠标事件:onclick 单击鼠标左键 ondbclick 双击鼠标左键 onmousemove 移动鼠标

onmouseout 鼠标指针离开HTML标签

onmouseover鼠标指针进入HTML标签

onmousedown 按下鼠标键onmouseup 放开鼠标键

键盘事件:onkeydown 当按下键盘按键 onkeyup 放开键盘按键

其他常用事件:onload 当浏览器加载HTML文件后

onunload 当用户离开浏览器,或是加载其他网页时

onfocus 用户指定对象拥有处理权

onblur 用户离开拥有处理权的对象

onchange 用户更改对象的内容

onsubmit 用户发送窗体字段

onreset 用户重设窗体字段

onselect 用户选择了网页内容

25、JavaScript的事件处理:

方式一:在HTML标签的属性中设置JavaScript的事件处理函数

如:<input type=”button” value=”按钮” onclick=”showAlert();” />

方式二:在对象的属性中设置JavaScript的事件处理

如:document.myForm.myButton.onclick = showAlert;

如果事件是由Window或Document等上层对象所触发,此时只需设置对象的事件属性,就可以指定事件的处理函数

取消事件的处理:可以取消用户新增的事件处理函数,也可以取消浏览器默认的事件处理函数。

当事件触发后,浏览器默认的事件处理函数就会进行事件的处理,拥有默认处理函数的

常见事件有:元素<a> 事件onclick 单击可以显示其他URL网址的HTML文件

元素<form> 事件onsubmit 发送窗体字段的内容

元素document 事件oncontextmenu 单击鼠标右键可以显示一个快捷菜单

方式一:将事件属性设为null

如:document.myForm.myButton.onclick = null;

方式二:使用自定义的事件处理函数,函数传回false时就可取消事件

如:return false;

方式三:将event对象的returnValue属性设置为false

如:event. returnValue = false;

26、Event对象:

当事件触发时就会产生一个Event对象,它的属性用来记录事件触发时的一些数据

Event对象是一个全局属性,不能把Event对象作为参数传递给事件处理函数

属性:srcElement 返回事件触发时的标签对象

returnValue 设置和取消事件的返回值

27、DHTML DOM的窗体对象的架构

使用字段名称访问窗体字段:如 document.myForm.myUserName.value

使用forms和elements对象访问字段:如 document.forms[0].elements[0].value

28、Form对象

属性:name、action、method、target

方法:submit() 发送窗体字段到服务器 reset() 重设窗体的各字段为默认值

29、Input对象

属性:name、type、value、disabled、form、readonly、maxlength

针对单选按钮和复选框的属性:checked

方法:blur()设置Input对象失去处理权 focus()设置Input对象拥有处理权

select()选择Input对象 click()触发其他字段的onclick事件

30、Select对象

属性:name、disabled、length、options、selectedIndex、size、multiple

方法:blur()设置Select对象失去处理权 focus()设置Select对象拥有处理权

add(objOption, index)新增一个<option>标签选项,第一个参数为Option对象,第二个参数为选项的索引位置

使用构造函数建立Option对象:var objOption = new Option(text, value)

remove(index)删除参数索引值的选项

31、Option对象

属性:value、text、selected

32、Textarea对象

属性:cols、rows

方法:blur()设置Textarea对象失去处理权 focus()设置Textarea对象拥有处理权

select()选择Textarea对象

33、JavaScript的窗体字段验证

验证属性: 文字、密码和备注 value

单选按钮和复选框 checked

下拉式菜单 selected

更多相关推荐:
javascript学习总结

javascript学习总结1JavaScript中的对象分为3种1JavaScript的内置对象常用的有DateArrayStringMath对象这些都是经常会用到的一定要掌握好2文档对象模型Document...

javascript学习总结

脚本语言:1、介于html与java,php之间的语言,能力比java,php弱,比html强,单独使用起不了大作用,需要配合其他语言发挥其作用;2、3、4、5、javascript有自己的变量,函数以及控制语…

javascript学习总结

一JavaScriptJavaScript被设计用来向HTML页面添加交互行为JavaScript是一种脚本语言脚本语言是一种轻量级的编程语言JavaScript由数行可执行计算机代码组成JavaScript通...

Javascript学习总结

JavaScript学习总结1234567JavaScript概述3数据类型3数字3字符串3布尔类型4函数4对象4a创建JavaScript对象的两种语法4b自定义对象类型58数组59变量510基本类型和引用类...

JavaScript考点总结

Netscape公司为了扩展其浏览器的功能开发了一种名为LiveScript的脚本语言Sun公司联合宣布把其更名为Javascript欧洲计算机制作商协会ECMA形成ECMA262标准定义了ECMAScript...

JavaScript学习总结

JavaScript学习总结由于以前JavaScript用的比较的少所以对JavaScript的认识非常的肤浅这周看了蛮多关于javascript的书和文档对JavaScript终于有了一些初步的认识总结一下希...

javascript学习总结

Javascrip基础与实践教程电子工业出版社一javascrip语言概述1ECMAScript是许多软件厂商对JavaScript的统一标准2服务器端和客户端JavaScript共享相同的核心语言但也有些不同...

javascript 总结

JavaScript总结PreviousPageNextPage现在您已经学习了JavaScript,接下来该学习什么呢?JavaScript概要本教程中我们向您讲授了如何向html页面添加JavaScript…

Javascript类型转换的规则学习总结

Javascript类型转换的规则Javascript的变量是松散类型的,它可以存储Javascript支持的任何数据类型,其变量的类型可以在运行时被动态改变。请看示例:1varn=10;2n=string;3…

深入理解JavaScript系列(总结)

深入理解JavaScript系列(结局篇)20xx-07-2608:54by汤姆大叔,5971阅读,48评论,收藏,编辑介绍最近几个月忙得实在是不可开交,终于把《深入理解JavaScript系列》的最后两篇“补…

javascripe学习笔记自己总结

Document对象内容集合document文挡对象-JavaScript脚本语言描述———————————————————————注:页面上元素name属性和JavaScript引用的名称必须一致包括大小写否…

JavaScript对象学习总结

面向对象术语对象ECMA-262把对象(object)定义为“属性的无序集合,每个属性存放一个原始值、对象或函数”。严格来说,这意味着对象是无特定顺序的值的数组。尽管ECMAScript如此定义对象,但它更通用…

javascript学习总结(21篇)