JavaScript学习笔记
- 格式:doc
- 大小:153.55 KB
- 文档页数:18
javascript高级程序设计笔记
1. JavaScript是一种强大的编程语言,可以用于开发各种类型
的应用程序,包括网页应用、移动应用和桌面应用等。
2. JavaScript的语法类似于其他编程语言,包含变量、数据类型、运算符、控制流语句等基本组成部分。
3. JavaScript中的变量可以被赋予不同的数据类型,包括字符串、数字、数组和对象等。
4. JavaScript中的函数是一种可重复使用的代码块,可以接收
参数并返回值。
5. JavaScript中的控制流语句包括条件语句和循环语句,可以
按照不同的条件执行不同的代码块。
6. JavaScript中的数组是一种用于存储多个值的数据结构,可
以通过下标访问和修改数组中的元素。
7. JavaScript中的对象是一种复合数据类型,可以存储相关的
属性和方法。
8. JavaScript中的事件是用户和浏览器交互过程中发生的动作,可以通过事件处理函数来响应和处理这些事件。
9. JavaScript中的DOM是文档对象模型的缩写,用于操作HTML文档的结构和内容。
10. JavaScript中的面向对象编程是通过创建对象和定义对象的属性和方法来组织和管理代码。
以上是JavaScript高级程序设计的一些基本概念和知识点,掌握了这些内容可以帮助开发者更好地理解和运用JavaScript语言。
1.实践,实践还是实践实践出来的东西是,是从自己骨子里生长出来的东西。
学习犹如散种子,在实践中种子才会发芽、生长、成熟和消亡。
没有发芽的种子还会像蒲公英一样,飘呀飘呀随念飘走,学习就成了一种消磨时间和锻炼思维的方式。
1.1.点滴心得1.1.1.js语言的构成结构基础:词法结构,首先是该语言的字符集,UTF-8,随后是其他的词法规则,包括:大小写敏感,对空格、换行和制表符的处理,对分号的定义(即语句结束规则),注释规则,直接量规则(所谓的直接量,即对内存单元中数据进行读取,而不用通过地址二次引用进行读取,和指针相对),标识符,,关键字。
数据类型和值。
【数据结构,相互之间有联系的元素的集合,数据之间的联系,我们称为逻辑结构。
练联系即结构。
数据类型,一个值的集合,和定义在该值集上的一组操作的统称。
抽象数据模型(Abstract Data Type),是指一个数据模型和定义在该模型上的一组操作。
ADT的形式化是三元组,ADT=(D,S,P)其中,D是数据对象,S是D 上关系的集合,P是对D的基本操作集。
】变量(有了类型,自然就有了变量)。
表达式和运算符(有类型,就有了该类型允许的运算,运算用运算符表示,运算符和变量的集合就是表达式)。
表达式是不能执行的,只有语句才能执行,语句是有动态行为的(function语句除外)。
语句包括:表达式语句,复合语句(语句块),var语句,function语句,if语句,循环语句,return语句,throw语句,trycath语句,空语句,标签语句,with语句,break语句,continue语句。
【function语句的作用是定义函数,而不是执行,因此没有动态行为,发生在函数被解析或者被编译时。
函数的定义和函数的运行并不在同一时刻。
】1.1.2.new对象new 为变量操作符分配一块内存,因此对象类型是引用类型,对象的类型是Object。
Object类型允许的操作是获取属性,通过“.”操作符,允许对变量执行操作,执行的具体操作依据变量类型决定。
udemy的javascript课程笔记以下是udemy的JavaScript课程的一些主要笔记:1.JavaScript是一种脚本语言,主要用于在Web浏览器中实现交互功能。
2.JavaScript的主要特点包括:解释性语言、基于对象、原型、弱类型等。
3.JavaScript的基本语法包括变量、数据类型、运算符、控制结构等。
4.JavaScript中的变量可以使用var、let或const声明,其中var声明的作用域是函数作用域,let和const声明的作用域是块级作用域。
5.JavaScript中的数据类型包括原始数据类型和对象数据类型,其中原始数据类型包括Number、String、Boolean、Null、Undefined等,对象数据类型包括Object、Array等。
6.JavaScript中的运算符包括算术运算符、比较运算符、逻辑运算符、位运算符等。
7.JavaScript中的控制结构包括if语句、switch语句、for循环、while循环等。
8.JavaScript中的函数是一段可重复使用的代码块,可以接受参数并返回值。
函数可以使用function关键字声明,也可以使用简洁声明方式。
9.JavaScript中的闭包是一种特殊类型的函数,它可以访问并操作其他函数的变量作用域。
闭包常常用于实现私有变量和函数,以及实现模块化编程。
10.JavaScript中的异步编程可以使用回调函数、Promise对象、async/await等实现。
其中async/await是基于Promise实现的,可以让异步代码看起来像同步代码一样。
11.JavaScript中的事件处理程序是一种特殊的函数,用于响应用户的交互操作,如点击按钮、提交表单等。
事件处理程序可以通过事件监听器绑定到元素上,并指定当事件发生时要执行的函数。
12.JavaScript中的DOM(文档对象模型)是一种编程接口,用于操作HTML和XML文档。
JavaScript在数百万张页面中,JavaScript被用来改进设计、验证表单、检测浏览器、创建cookies,等等等等。
JavaScript是因特网上最流行的脚本语言,并且可以在所有主要的浏览器中运行,比方说Internet、Explorer、Mozilla、Firefox、Netscape和Opera。
什么是JavaScript?●JavaScript被设计用来向HTML页面添加交互行为。
●JavaScript是一种脚本语言(脚本语言是一种轻量级的编程语言)。
●JavaScript由数行可执行计算机代码组成。
●JavaScript通常被直接嵌入HTML页面。
●JavaScript是一种解释性语言(就是说,代码执行不进行预编译)。
●所有的人无需购买许可证均可使用JavaScript。
Java和JavaScript是相同的吗?不同!在概念和设计方面,Java和JavaScript是两种完全不同的语言。
JavaScript能做什么?JavaScript为HTML设计师提供了一种编程工具。
HTML创作者往往都不是程序员,但是JavaScript却是一种只拥有极其简单的语法的脚本语言!几乎每个人都有能力将短小的代码片断放入他们的HTML页面当中。
JavaScript可以将动态的文本放入HTML页面类似于这样一段JavaScript声明可以将一段可变的文本放入HTML页面:document.write(“<h1>”+name+”</h1>”)JavaScript可以对事件作出响应可以将JavaScript设置为当某时间发生时才会被执行,例如页面载入完成或者当用户点击某个HTML元素时。
JavaScript可以读写HTML元素JavaScript可以读取及改变HTML元素的内容。
JavaScript可被用来验证数据在数据被提交到服务器之前,JavaScript可被用来验证这些数据。
javascript笔记总结JavaScript 是一种广泛应用于网页开发的脚本语言,它可以为网页增加交互性和动态功能。
以下是一些 JavaScript 的笔记总结:1. 数据类型,JavaScript 包括基本数据类型(如数字、字符串、布尔值)和复杂数据类型(如对象、数组、函数)。
2. 变量和常量,使用 var、let 或 const 关键字声明变量和常量,变量可以被重新赋值,而常量则不能。
3. 控制流,JavaScript 支持条件语句(if-else)、循环语句(for、while)、以及跳出循环的关键字(break、continue)。
4. 函数,可以使用 function 关键字定义函数,函数可以接受参数并返回值。
5. 对象和数组,JavaScript 中的对象是键值对的集合,数组是有序的值的集合,它们都可以动态地增加、删除或修改其内容。
6. 事件处理,JavaScript 可以通过事件处理函数响应用户的交互行为,如点击、鼠标移动等。
7. DOM 操作,JavaScript 可以通过 Document Object Model (DOM)来操作网页的结构、样式和内容。
8. 异步编程,JavaScript 支持异步编程,可以通过回调函数、Promise 或 async/await 来处理异步操作。
9. 错误处理,JavaScript 提供了 try...catch...finally 结构来捕获和处理程序运行时的错误。
总的来说,JavaScript 是一种强大且灵活的脚本语言,能够为网页提供丰富的交互体验和动态功能。
希望这些笔记总结可以帮助您更好地理解 JavaScript 的基本概念和特性。
JavaScript学习笔记目录第 1 章JAVASCRIPT的语法 (1)1.1 什么是脚本程序和JAV ASCRIPT (1)1.1.1 什么是脚本程序 (1)1.1.2 Javascrpit的简介 (1)1.2 脚本代码的位置 (2)1.2.1 也可将javascript放入到单独的一个文件js文件,在需要使用的时候引入: (2)1.2.2 在超连接中使用javascript (3)1.2.3 在button中也可使用javascript (3)1.3 JAV ASCRIPT的保留关键字 (3)1.4 JAV ASCRIPT的基本语法 (3)1.4.1 基本数据类型和常量 (4)1.4.2 变量: (4)1.4.3 运算符号 (5)1.5 JS的控制语句 (6)1.5.1 switch选择语句 (6)1.5.2 While循环语句 (7)1.5.3 do while 语句 (7)1.5.4 for循环语句 (8)1.6 J S中的系统函数(它们都属于G LOBAL对象的方法,可以直接使用) (9)1.6.1 parseInt(numString,[radix])方法 (9)1.6.2 parseFloat方法 (9)1.6.3 isNaN方法 (9)1.6.4 eval方法,用处不小呀!! (9)1.7 对象 (9)1.7.1 对象与对象实例 (9)1.7.2 Math对象 (10)1.7.3 Date对象 (11)1.7.4 toString的方法 (11)1.8 数组 (11)1.8.1 数组列表 (11)1.9 A RRAY对象 (12)1.10 在函数中修改参数值的问题 (13)第 2 章DOM编程 (15)2.1 DOM简介 (15)2.2 如何编写事件处理程序 (16)2.3 WINDOW对象 (17)2.4 WINDOW对象-常用方法 (17)2.4.1 alert方法 (17)2.4.2 confirm方法 (17)2.4.3 prompt方法 (18)2.4.4 navigate方法 (18)2.4.5 setinterval方法 (18)2.4.6 setTimeout方法 (18)2.4.7 clearinterval方法 (18)2.4.8 clearTimeout方法 (18)2.4.9 moveTo方法 (18)2.4.10 resizeTo方法 (18)2.4.11 open方法 (18)2.5 WINDOW对象-属性 (20)2.6 WINDOW对象-事件 (21)2.6.1 onload事件 (21)2.6.2 onunload事件 (21)2.6.3 onbeforeunload事件 (21)2.6.4 通用事件(针对html元素而言) (22)2.7 WINDOW对象-对象属性 (22)2.7.1 location对象 (22)2.7.2 event对象 (23)2.7.3 screen对象 (23)2.7.4 history对象 (23)2.7.5 navigator对象 (23)2.7.6 document对象 (23)2.8 FORMS对象(DOCUMENT的对象属性) (27)2.8.1 form对象 (27)2.8.2 form表单字段元素的应用案例 (27)第 1 章javascript的语法1.1什么是脚本程序和javascript1.1.1什么是脚本程序<html><script language=“JavaScript”>alert(new Date()); ----→就是在浏览器中跳出一个对话框</script>顺平你好!</html>问题:●什么时候执行,在哪里执行的?(注意顺平你好是什么时候显示的?????)1.1.2Javascrpit的简介最早是livescript,是一种基于对象和事件驱动,并具备安全性的脚本语言,是有netscapce公司提供的,后和sun公司合作,将livescript更名为javascript microsoft jscirpt1.1.2.1Java 与javascript的关系●由两个公司提供的.●作用与用途不一样.●两个公司合作,这样他们的语法有相识之处●javascript不是java的子集1.1.2.2javacript、Jscript 与ECMAscriptjscript是由微软提供的,由于得不到netscape公司的技术支持,自己编写的.它和javascript就非常相似的.他们在不停的发展,你可以去网站了解最新的标准.Javascript : Jscript: http://msdn.microsoft/scripting1.2脚本代码的位置<script>var sp=“中国”;</script><p>这是一个html段落</p><script>alert(sp);</scipt>它等同与将<p>这是一个html段落</p><script>var sp=“中国”;alert(sp);</scipt>为了防止浏览器将javascript的内容与html相互混淆,你可以在<script>之间加入<!-- -- >1.2.1也可将javascript放入到单独的一个文件js文件,在需要使用的时候引入:比如:你的一个js 文件var sp="中国";alert(sp);在某个网页文件中引入<html><script src="my.js" language="javascript"></script>顺平!</html>这个效果如同将my.js的所有内容都引入到<script></script>标签之间1.2.2在超连接中使用javascript<a href="javascript: alert(new Date());">顺平!</a>1.2.3在button中也可使用javascript<input type=button value=test onclick=“alert(new Date());”>其实就是对html控件的事件进行处理1.3javascript的保留关键字查看javascript帮助文档1.4javascript的基本语法不要使用javascript的保留字javascript大小写敏感sp , Sp是不同的中,英文的分号、引号要注意.Javascript的注释:// 单行注释/* */多行注释1.4.1基本数据类型和常量1.4.1.1整形常量比如: 1 ,45,5671.4.1.2实数常量比如: 34.5 ,67.891.4.1.3布尔常量true,false1.4.1.4字符串常量没有字符常量,即使是一个字符,也被当作字符串“a girl”, …abcde‟,”a”,”“注意: 1如果有特殊字符串,要有\ 转义2 在js中不能把一个长的字符串简单的分成多行显示,要有+来分行1.4.1.5null常量1.4.1.6undefine常量1.4.2变量:js 中是弱数据类型的,在定义变量时,不需要指明该变量的类型(由js引擎来决定) var name=“shunping”; //name是字符串var kk=2 //kk是数var yy //yy是undefined如果name=234;//这时name自动变成数.不声明变量直接使用x=345; //亦可, 但是这应该是一个字符串1.4.3运算符号1.4.3.1算术运算符号加号运算符☞注意:可以用于数的加运算,也可以用于字符串的拼结。
javascript学习笔记ECMAScript 是javascript的规范规范起草了必须支持类型值对象属性和函数和程序语法和语意义对象具有松散和动态的命名属性(其实就是字典序列)对象的命名属性用于保存值,该值可以是指向另一个对象(Objects)的引用,也可以是一些基本的数据类型那么web浏览器就是ECMAScript 规范的实现(我们叫做宿主环境)p176/****************************************************************************/javascript的基础特性计算机程序是通过操作value 如123 hello来运行的程序语言把能够操作的值定义为数据类型数据类型有基本类型和复合类型(对象)对象是基本类型和复合类型的无序集合数组也是对象但是是有序集合javascript中定义了一个特殊的对象function 是可执行代码的对象注意:在别的程序语言中函数(java中叫方法)是语法的一部分但是在javascript中函数是个数据类型能够保存在变量中var name='cijun';function test(){alert(name);/* 你肯定会认为输出是 cijun 但是遗憾的告诉你是 undefinde当在函数体中定义某个变量一但定义不管的执行顺序这个变量始终在函数体中了其实这个是你可以把他看成 var name;*/var name='baobao';alert(name); //输出为baobao}test();</script>有效的检查参数的方法function chackArgs (args){//方法作用检查参数个数var fact=args.length;//实际传入的参数var expect=args.callee.length;//需要的参数个数if(fact!=expect){throw new Error("参数输入不符合规范");}/***案例*function test(x,y,z)*{*chackArgs(arguments);如果输入参数不符合直接抛出异常*return x+y+z;*}*/}让函数产生唯一的值(原理就是根据函数在执行前就可以使用)uniqueNumber.count=0;function uniqueNumber(){return uniqueNumber.count +1;}Javascritp中的类Javascript中的继承(类也有了那怎么完成继承呢)在论对象就是字典序列看下面的试验javascript中的异常处理机制Error对象就象java中的ThrowableJavascript的debugger调试器Firefox的javascript调试器https:///en-US/firefox/addon/216Dom节点查看器Web Developer for firefox https:///en-US/firefox/addon/60学习文档/DOM(Document Object Model)文档对象模型注意: 下面给出的对象属性事件方法集合等是该对象比较常用浏览器中window对象就是js的全局对象注意当你窗口对象打开了子窗口你又把主窗口关了但是你只要记住如果子窗口存在的对主窗口的引用虽然主窗口关闭了但是你仍然可以访问主窗口的数据其实他在内存中没销window对象常用的方法方法就是能够直接调用的函数window对象专用的事件关于事件就是对象在某种状态下就去会执行该对象的某个方法用狸猫换太子就可以触发你自己的函数在该事件上的行为了onload事件(注意该事件是转载完成页面的内容才执行的)onunload事件onbeforeunload事件浏览器在关闭前做的事情window对象属性引用的对象Window对象的2个重要属性(可以做购物车计价显示)方法属性document 对象的集合很重要Html元素的通用属性Id 给该元素在标记个唯一名称在该页面中Name 可以给js 访问在form中该属性是用来和服务器交换信息的ClassName 是给css 选择器访问的名称(可以配合js实现动态改变样式)InnerText 在html元素的标签对中嵌入文本格式(比如<div> innerText 的文本是嵌入在这里的如果出现了html标记那么抱歉标记也是以文本格式显示的</div>)InnerHtml 以html格式嵌入在标记对中OuterText 连同标记自己和标记中包含的内容返回如果设置就可以改变原来的标记OuterText 同上Offset 返回自己的边界坐标ClientTop 返回窗体编辑区和本对象之间顶点坐标的差Scrooll 是否显示滚动条方法属性事件方法事件方法属性方法集合属性总结下事件和html元素的对应onclick 点击元素时候触发大多数元素都支持该事件onmousedown 和onmouseup 和onclick区别在于不需要特定元素按下鼠标和释放鼠标就触发大多数元素都支持该事件onmouseover onmouseout 分别在鼠标移动或移出元素时候触发大多数元素都支持该事件<a>元素比较常使用onchange在用户改变了元素显示的值或者移出了元素的焦点时候触发<input><select><textarea>支持这个事件onsubmit onreset 表示提交个表单和重新设置表单的时候触发<form>使用注意:脚本执行顺序比如你要操作个form 但是你的脚步操作语句写在了这个form前面那么就会出现异常因为你操作的对象还没生成脚本的执行顺序和html文档的解释顺序是同时的Javascript技巧Css补充说明名词解释embed 插入354。
JAVASCRIPT学习记录学习记录:JavaScript学习记录:JavaScriptJavaScript是一种广泛应用于网页和移动应用开发的脚本语言。
作为一名前端开发人员,学习JavaScript是必不可少的,因为它不仅可以为网站增加交互性,还可以实现动态效果、创建图表、处理表单验证等。
在学习JavaScript的过程中,我首先学习了基本的语法和数据类型。
JavaScript的语法与许多其他编程语言相似,它由语句和表达式组成。
语句是执行一些动作或操作的命令,而表达式是由值、运算符和变量组成的。
我掌握了基本的语句语法,如if语句、for循环和函数的使用。
接下来,我学习了JavaScript中的变量和数据类型。
JavaScript有几种基本数据类型,包括数字、字符串、布尔值、数组和对象。
了解这些数据类型对于正确使用和操作数据至关重要。
我还学习了变量的声明和赋值,以及变量的作用域和生命周期。
熟悉变量的使用和数据类型的判断是编写高质量代码的基础。
在学习了基本的语法和数据类型之后,我开始了解JavaScript中的函数和对象。
函数是可重复使用的代码块,可以接受输入参数并返回结果。
我学习了如何声明和调用函数,以及如何编写具有不同功能的函数。
对象是JavaScript的核心构建块之一,它是一种复合数据类型,可以存储多个值和方法。
我学习了如何创建对象、添加属性和方法,并了解了如何使用对象进行数据的组织和操作。
除了基本的语法和数据类型,我还学习了JavaScript中的条件语句和循环结构。
条件语句允许根据不同的条件执行不同的代码块。
我掌握了if语句和switch语句的使用,以及如何使用逻辑运算符对多个条件进行判断。
循环结构允许重复执行一些代码块,它有for循环、while循环和do-while循环等不同的类型。
我学习了这些循环结构的使用方法,并尝试编写了一些实例来加深理解。
除了DOM操作,我还学习了AJAX和JSON的使用。
<title>自动选择文本框/编辑框中的文字</title><script type="text/javascript">function Myselect_txt(){if (document.form1.title.focus){document.form1.title.select();}}function Myselect_txtarea(){if (document.form1.content.focus){document.form1.content.select();}}</script>A href中target属性的用法target这个属性指定所链接的页面在浏览器窗口中的打开方式,它的参数值主要有:_blank、_parent、_self、_top,这些参数值代表的含义如下:_blank,在新浏览器窗口中打开链接文件。
_parent,将链接的文件载入含有该链接框架的父框架集或父窗口中。
如果含有该链接的框架不是嵌套的,则在浏览器全屏窗口中载入链接的文件,就象_self参数一样。
_self,在同一框架或窗口中打开所链接的文档。
此参数为默认值,通常不用指定。
_top,在当前的整个浏览器窗口中打开所链接的文档,因而会删除所有框架。
二级菜单的显示:创建Ajax对象:Ajax用于做异步操作在IE游览器下可以适用:达到兼容性:事件驱动:(1)单击事件onClick(2)改变事件onChange(3)提交事件onSubmit(4)选中事件onSelect(5)获取焦点事件onFocus(6)失去焦点onBlur(7)载入文件onload(8)卸载文件onUnload(9)按下键盘按键onKeydown(10)按下字面键onKeyPress(11)释放键盘按键onKeyUp(12)鼠标滑过onMouseMove(13)鼠标移除onMouseOut(14)鼠标移入onMouseOver(15)鼠标释放onMouseUp(16)按下鼠标onMousedown(17)鼠标双击onDblClickJavaScript 的极大对象是:window history location document form 等;其中window窗口对象时最大的对象因此引用它的属性和方法时,可以不必加入对象名window 例如:window.alert(l);和alert(l);效果一样;属于window把一个文本文件中的字符串数字给读取出来:文本文件中存储的是一个字符串数组:{1,2,3,4,5,6,7,8}解决缓存的方法:绑定事件:绑定事件的兼容性解决:以上存在兼容性的问题:解决兼容性的问题如下:解决冒泡的方法:随鼠标移动的div效果:Client与scrollTop的配合使用防止出错:Ctrl+enter 提交留言:延时提示框:解决图片的兼容问题对于隐藏事件的写法但是id的直接使用会引起兼容性问题Display有两个值none 和block none表示不显示block表示显示网页的换肤效果;用于显示信息Console .dir();Console.log()(1)鼠标移动到图片上,图片上下移动效果var A_Img=new Image();function move(image,num){image.src='Images/top/menu_0'+num+'_over.gif';}//此处的num为1时就是Images/top/menu_01_over.gif'这张图片,它仍然是一张图片让新的一张图片赋给了点击时的图片function out(image,num){image.src='Images/top/menu_0'+num+'.gif';}</script><td width="94" align="center"><img src="Images/top/menu_05.gif" name="image5" width="95" height="119" border="0" onMouseMove="move(this,'5')" onMouseout="out(this,'5')"></td>(2)打开网页显示广告信息窗口属性的参数(3)定时打开窗口(4)通过按钮创建窗口(5)自动关闭的广告窗口(6)弹出窗口居中(7)地图图片热点地图链接类型的链接<map name="Map"><area shape="rect" coords="164,8,246,26" href="#" onClick="window.close();"> <area shape="rect" coords="76,8,158,26" href="#" onClick="mycheck(myform)"> </map>(8)弹出的窗口之Cookie控制<Script Language="JavaScript">function openWindow(){window.open("placard.htm","","width=352,height=193")}function GetCookie(name){var search = name + "=";var returnvalue = "";var offset,end;if(document.cookie.length>0){offset = document.cookie.indexOf(search);if(offset != -1){offset += search.length;end = document.cookie.indexOf(";",offset);if(end == -1) end = document.cookie.length;returnvalue = unescape(document.cookie.substring(offset,end));}}return returnvalue;}function LoadPop(){if(GetCookie("pop")==""){openWindow();var today = new Date()var time="Sunday,1-jan-"+today.getYear()+1+" 23:59:59 GMC";document.cookie="pop=yes;expires="+time;}}</Script>(9)关闭弹出窗口时刷新父窗口点击一个按钮显示一个新的子网页<a href="#"onClick="Javascript:window.open('new.htm','','width=400,height=220')">会议记录</a>在子网页中用于关闭的按钮<input type="submit" name="Submit" value="关闭" onclick="Mycheck();"> <script language="javascript">function Mycheck(){alert("关闭子窗口!");window.opener.location.reload(); //刷新父窗口中的网页window.close();//关闭当前窗窗口}</script>(10)(11)全屏显示代码:弹窗显示代码:<script language="javascript">function opendialog(){varsomeValue=window.showModalDialog("new.htm","","dialogWidth=640px;dialogHeight=423px;s tatus=no;help=no;scrollbars=no")}</script>网页拾色器代码:<script language="javascript">function colorpick(field){var rtn = window.showModalDialog("color.htm","","dialogWidth:225px;dialogHeight:170px;status:no;help:no;scrolling=no;scrollbars=no");if(rtn!=null)field.style.background=rtn;return;}</script><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><title>网页拾色器</title></head><body><script language="JavaScript"><!--var h = new Array(6)h[0] = "FF";h[1] = "CC";h[2] = "99";h[3] = "66";h[4] = "33";h[5] = "00";function action(RGB) {//alert('您选择的颜色是:#'+RGB);parent.window.returnValue="#"+RGB;window.close();}function Mcell(R, G, B) {document.write('<td bgcolor="#' + R + G + B + '">');document.write('<a href="#" onClick="action(\'' + (R + G + B) + '\')">');document.write('<img border=0 height=12 width=12 \')" alt=\'#'+R+G+B+'\'>');document.write('</a>');document.write('</td>');}function Mtr(R, B) {document.write('<tr>');for (var i = 0; i < 6; ++i) {Mcell(R, h[i], B);}document.write('</tr>')}function Mtable(B) {document.write('<table cellpadding=0 cellspacing=0 border=0>');for (var i = 0; i < 6; ++i) {Mtr(h[i], B);}document.write('</table>');}function Mcube() {document.write('<table cellpadding=0 cellspacing=0 border=0><tr>'); // for (var i = 0; i < 6; ++i) {if(i%3==0){document.write('<tr>');}document.write('<td bgcolor="#FFFFFF">');Mtable(h[i])document.write('</td>');}if(i%3==0){document.write('</tr>');}document.write('</tr></table>');}Mcube()--></script></body>网页可见区域宽:document.body.clientWidth;网页可见区域高:document.body.clientHeight;网页可见区域宽:document.body.offsetWidth (包括边线的宽); 网页可见区域高:document.body.offsetHeight (包括边线的宽); 网页正文全文宽:document.body.scrollWidth;网页正文全文高:document.body.scrollHeight;网页被卷去的高:document.body.scrollTop;网页被卷去的左:document.body.scrollLeft;网页正文部分上:window.screenTop;网页正文部分左:window.screenLeft;屏幕分辨率的高:window.screen.height;屏幕分辨率的宽:window.screen.width;屏幕可用工作区高度:window.screen.availHeight; 屏幕可用工作区宽度:window.screen.availWidth;setInterval(function(),30)设置定时器;offsetInterval清除定时器Offsetleft当前的距离左边位置。
JavaScript权威指南之学习笔记(第六版)核心笔记一、说明JS权威指南文字用红色标出;JS高级程序设计用橙色标出;自己加上的文字用粉红色标出;其(一)-(九)为JS权指南,(十)为JS高级程序设计二、记法结构2.1字符集Javascript程序用的是Unicode字符集编码。
2.2大小写敏感Javascript是一种区分大小写的语言,但是注意HTML是不区分大小写的(尽管XH TML区分大小写的)。
也即在HTML中这些标记和属性名可以任意的大小写方式输入,但是在Javascript中它们通常都是小写的。
2.4可选的分号尽管理论上说来JS允许在任意两个标识符之间放置换行符,但是实际上JS会自动插入分号。
例:ReturnTrue;JS会假定你的意图是:Return;True;2.7标识符第一个字母必须是字母、下划线或美元符号($)!三、数据类型和值3.1数字Javascript不区整型值和浮点型数值。
在Javascript中,所有的数字都是由浮点型表示的。
3.1.1,3.1.2整型直接量、八进制和十六进制的直接量十六进制直接量是以”0x”或”0X”开头,而八进制是以数字0开头。
在ECMAScript标准中不支持八进制的直接量,但是Javascript的某些实现是允许八进制格式的整型直接量的。
所以一般最好不要使用以0开头的整型直接量。
3.1.3浮点直接量例如3.14234.342.3424242.32e231.23424E-323.1.6特殊的数值当一个算术运算(如0除0)产生了未定义的结果或错误时,就会返回一个特殊的非数字的值,为NaN。
这个数字值和任何数值都不相等,包括它自己在内,所以需要一个专门的数字来检测IsNaN()来检测这个值。
特殊数值常量NANInfinity 无穷大Number.MAX_VALUENumber.MIN_VALUENumber.NaNNumber.POSITIVE_INFIITYNumber.NEGATIVE_INFITY这是特殊的常量都是在运算时可能产生的,用IsNaN()或isFinite()等函数来检测。
1、JavaScript内容3.1、JSP的发展过程JSP出现前,Java是通过Applet完成网页的动态效果的。
最早的网页技术就是纯粹的HTML,就是一个页面一个页面的编写程序。
为了加入动态效果,加入了javaScript和css,可以完成简单的与用户的交互,但所有用户显示的内容都是相同的。
Java出现了Applet后,完成了第一个真正意义的动态网页技术。
结合了Java的Socket网络编程,使用户下载一个Applet 客户端程序,这样可以完成动态的显示效果,但有很多的缺点,例如:下载时速度比较慢,安全性比较差,要求浏览器要有applet支持。
由于Applet存在缺点,因此由出现了一些网页技术。
ASP:简单,但可维护性很差,基本上只能开发小型的网站项目。
由于是微软开发,因此安全性能比较差,而且只支持微软的产品。
IIS服务器+ Access/SQL Server + Windows2000或2003PHP:执行速度快,维护性也比较差,适合完成外网的一些中型项目。
PHP也有自己的一套架构:Apache服务器+ MySQL + UNIX.NET(aspx):就是ASP结合了C#的语法完成的动态网页技术,维护性比较好,由于仍然是微软的产品,因此也存在上面的安全问题。
JSP/Servlet:缺点:执行比较慢。
由于可扩展性和安全性都很高,因此适合大型项目和内网项目的开发。
JSP开发一般会向行业软件发展。
3.2、JavaScript基本语法(重点)JavaScript与Java并没有任何关系,JavaScript之前被称为LiveScript,由于语法很像Java,所以改为了JavaScript。
JavaScript是嵌入到html页面中,完成简单的用户交互和动态效果的。
所有支持html语法的动态网页技术都可以支持JavaScript。
完成打印Hello World:建立一个html页面。
<script language="javascript">alert("Hello World");</script>除了以上方式外,还有一种打印方式:<script type="text/javascript">document.write("Hello World");</script>上面的alert()是弹出一个对话框,提示信息。
这个document.write是直接将信息输出到html页面上。
编写JavaScript时,需要在<head></head>中定义一个<script>标签,并加入language或type来声明使用的script语法。
JavaScript的判断,循环等语法和Java基本一致。
其变量的类型与Java不同。
JavaScript中声明变量时只使用一种类型声明:var其具体类型依据为它赋的具体值来决定。
值可以为以下类型:整型:<script language="javascript">var i = 10;alert(10 + 10);</script>浮点型:<script language="javascript">var i = 10.1;alert(i + i);</script>注意,如果该浮点型可以自动转换为整型,则会按照整型进行处理。
字符串类型:<script language="javascript">var i = "ss10";alert(i + i);</script>Boolean类型:<script language="javascript">var i = true;alert(i && i);</script>由于JavaScript不是面向对象的语言,因此不存在类和接口的概念,所有JavaScript中的对象都按照对象类型处理。
两种高级类型:数组,对象。
数组:<script language="javascript">var i = new Array();// 该数组的模式类似ArrayList,是一个动态的数组,其大小与里面的数据量一致。
// 但加入数据时,使用的是Java中数组的语法i[0] = 23;i[1] = "str";i[2] = 23.4;// 循环取得所有的数据for (var j = 0;j < i.length ;j++ ) {alert(i[j]);}</script>如果要设置IE提示js错误,可以在浏览器的选项中设置。
对象:在javaScript里,对象一般指的是页面的元素。
对象一般会包含属性和方法,但注意,这里的对象的属性和方法没有访问限制了,可以直接通过.属性的形式取得或设置属性,也可以直接调用该对象的方法。
要取得页面对象可以使用以下方法:1、通过元素的id属性取得。
<input type="text" name="userid" id="userid"><script language="javascript">var obj = document.getElementById("userid");alert(obj.type);</script>如果某个表单元素没有包含id,只包含了name属性,也可以将name作为id进行处理。
表单元素包括(<input>,<select>,<textarea>)<input type="text" name="userid"><script language="javascript">var obj = document.getElementById("userid");alert(obj.type);</script>2、通过表单名称取得表单中的元素。
<form name="myform"><input type="text" name="userid"></form><script language="javascript">var obj = erid ;alert(obj.type);</script>前提是必须有表单,而且表单元素必须包含在表单中。
3、通过元素名称或id取得所有该名称的元素。
<input type="text" name="userid"><script language="javascript">var obj = document.all("userid");alert(obj.type);</script>以上三种,第二种使用上有局限性。
第一种和第三种的区别就在于多个同名元素的处理上。
<input type="radio" name="sex" value="男">男<input type="radio" name="sex" value="女">女<script language="javascript">var obj = document.getElementById("sex");var obj2 = document.all("sex");alert(obj.value);alert(obj2[1].value);</script>第一种当有多个同名元素时,只取得第一个元素,而第三种是将所有的都返回为一个数组。
3.3、JavaScript中的方法定义(重点)Java中定义方法格式:访问权限返回值类型方法名(参数类型参数名,….)JavaScript中定义方法的格式:function 方法名(参数名,参数名2….)<script language="javascript">function add(a,b) {return a + b;}alert(add(3,5));</script>如果出现了类似Java中重载的概念,方法名相同,参数个数不同。
但不会按照Java重载的方式进行处理(不会自动以及参数个数来判断执行的方法)。
下面的方法会将上面的同名方法覆盖掉,因此在定义JavaScript方法时,不要定义同名的方法。
<script language="javascript">function add(a,b) {alert("两个参数");return a + b;}function add(a,b,c) {alert("三个参数");return a + b + c;}alert(add(3,5));</script>提示中出现的NaN表示,数据类型转换出错。
数字转换为字符串类型的方法:通过加法运算,加一个空的字符串var i = 3;i = i + "";alert(i + i);字符串类型转换为数字类型:通过- 0、/ 1、* 1 来转换为合法数字var i = "3";i = i - 0;alert(i + i);如果这个字符串无法转换,则会返回NaN。
这样就可以依据这个转换结果判断是否出现转换错误。
var i = "3s";i = i - 0;if (isNaN(i)) {alert("出错");} else {alert(i );}JavaScript也提供了两个字符串转换为数字的方法:parseInt,parseFloat。