javascript入门经典零基础学习

     2022-05-09     496

关键词:

本书目录

第一章:  JavaScript语言基础

第二章:  JavaScript内置对象
第三章:  窗口window对象
第四章:  文档document对象
第五章:  表单form对象
第六章:  History与Navigator对象
第七章:  JavaScript框架编程
第八章:  JavaScript异常处理

第九章:  自定义JavaScript对象

 

 

第一章 JavaScript语言基础

 

[javascript] view plain copy
 
 print?
  1. 什么是JavaScript  
  2. JavaScript是一种基于对象(Object)和事件驱动(Event Driven)并具有安全性能的脚本语  
  3. 言。  
  4. JavaScript的出现弥补了HTML语言的不足,它是Java与HTML折中的选择,具有以下几个基  
  5. 本特点。  
  6. 1、脚本编写  
  7. JavaScript是一种脚本语言,它采用小程序段的方式实现编程。它作为一种解释性语言,不需要  
  8. 进行编译,而是在程序运行过程中逐行地被解释。  
  9. 2、基于对象  
  10. JavaScript是一种基于对象的语言,这意味着它能运用自己已经创建的对象。因此,许多功能可  
  11. 能来自于JavaScript运行环境(即浏览器本身)中对象的方法与JavaScript的对象相互作用。  
  12. 3、简单性  
  13. JavaScript的简单性首先主要体现在它基于Java的基本语句和控制流,是一种简单而紧凑的  
  14. 语言,对于学习Java是一种非常好的过度;其次,它的变量类型是采用“弱类型”,并未使用严格  
  15. 的数据类型。  
  16. 4、安全性  
  17. JavaScript是一种安全性语言,它不允许访问本地的硬盘,而且不能将数据存入到服务器上;  
  18. 不允许对网络文档进行修改和删除,只能通过浏览器实现信息浏览或动态交互,从而有效地防止数据  
  19. 的丢失。  
  20. 5、动态性  
  21. JavaScript是动态的,它可以直接对用户或客户输入做出响应而无需经过Web服务程序。它对  
  22. 用户的响应是采用以事件驱动的方式进行的。所谓事件驱动,就是指在页面中执行某种操作所产生的动  
  23. 作,比如按下鼠标、移动窗口或选择菜单等都可以视为事件,当事件发生后就会引起相应的事件响应。  
  24. 6、跨平台性  
  25. JavaScript仅依赖于浏览器本身,与操作系统无关,只要是能运行浏览器的计算机,并支持  
  26. JavaScript的浏览器就可以正确执行。从而实现“编写一下,走遍天下” 的梦想。  
  27.   
  28. Java和Javascript的区别  
  29. 1、基于对象和面向对象  
  30. Java是一种真正的面向对象的语言,即使是开发简单的程序,必须设计对象。  
  31. JavaScript是种脚本语言,它可以用来制作与网络无关的,与用户交互作用的复杂软件。它是  
  32. 一种基于对象(Object Based)和事件驱动(Event Driver)的编程语言。因而它本身提供了非  
  33. 常丰富的内部对象供设计人员使用。  
  34. 2、解释和编译  
  35. 两种语言在其浏览器中所执行的方式不一样。Java的源代码在传递到客户端执行之前,必须经过  
  36. 编译,因而客户端上必须具有相应平台上的仿真器或解释器,它可以通过编译器或解释器实现独立  
  37. 于某个特定的平台编译代码的束缚。  
  38. JavaScript是一种解释性编程语言,其源代码在发往客户端执行之前不需经过编译,而是将文  
  39. 本格式的字符代码发送给客户编由浏览器解释执行。  
  40. 3、强变量和弱变量  
  41. 两种语言所采取的变量是不一样的。  
  42. Java采用强类型变量检查,即所有变量在编译之前必须作声明。  
  43. JavaScript中变量声明,采用其弱类型。即变量在使用前不需作声明,而是解释器在运行时检  
  44. 查其数据类型,  
  45. 4、代码格式不一样  
  46. Java是一种与HTML无关的格式,必须通过像HTML中引用外媒体那么进行装载,其代码以字节  
  47. 代码的形式保存在独立的文档中。  
  48. JavaScript的代码是一种文本字符格式,可以直接嵌入HTML文档中,并且可动态装载。编写  
  49. HTML文档就像编辑文本文件一样方便。  
  50. 5、嵌入方式不一样  
  51. 在HTML文档中,两种编程语言的标识不同,JavaScript使用<Script>...</Script>来标  
  52. 识,而Java使用<applet>...</applet>来标识,或采用java脚本语言。  
  53. 6、静态联编和动态联编  
  54. Java采用静态联编,即Java的对象引用必须在编译时的进行,以使编译器能够实现强类型检查。  
  55. JavaScript采用动态联编,即JavaScript的对象引用在运行时进行检查,如不经编译则就  
  56. 无法实现对象引用的检查。  
  57.   
  58. 第一节 语言基础  
  59. 编写JavaScript程序  
  60. 1、JavaScript直接嵌入HTML文件中  
  61. 写在head或body标记对之间,要加标记如下:  
  62. <script language="javascript">  
  63. document.write("<font color=blue>Hello World!</font>");  
  64. </script>  
  65. 2、JavaScript程序存放在单独的.js文件中,再在HTML文件中链接  
  66. <head>  
  67. <script language="javascript" SRC="xxx.js"></script>  
  68. </head>  
  69. <body>  
  70. <form>  
  71. <input type=button onclick=show()>  
  72. </form>  
  73. </body>  
  74. 在.js文件中直接书写javascript代码即可。  
  75. function show(){  
  76. document.write("hello world!");  
  77. }  
  78. 基本数据类型  
  79. 在JavaScript中有四种基本的数据类型:  
  80. 数值型(整数和实数)  
  81. 字符串型(用""号或‘‘号括起来的字符或数值)  
  82. 布尔型(使用true或false表示)  
  83. 空值(null)  
  84. 变量  
  85. 在程序执行过程中值可变的量,是系统内存中的一个命名的存储单元。  
  86. 变量的命名:  
  87.   
  88. 变量名以字母开头,中间可以出现数字,下划线。变量名不能有空格、+或其他符号  
  89. 不能使用JavaScript的关键字作为变量。如:var、int、double、delete  
  90. 变量名第一个单词全部小写,第二个单词开始每个单词的首字母大写,其余字母小写。  
  91. 声明(定义)变量:  
  92. var x, myString;  
  93. var y=100, st="hello";  
  94. cost=23.6;  
  95. JavaScript中的保留字(关键字):  
  96. abstract boolean break byte case catch  
  97. char class const continue default do  
  98. double else extends false final finally  
  99. float for function goto if implements  
  100. import in instanceof int interface long  
  101. native new null package private protected  
  102. public return short static super switch  
  103. synchronized this throw throws transient true  
  104. try var void while with  
  105. 变量的作用域  
  106. 在JavaScript中有全局变量和局部变量之分。全局变量时定义在所有函数体之外,其作用范围  
  107. 是所有函数;而局部变量时定义在函数体之内,只对该函数是可见的。  
  108. <script language="javascript">  
  109. var quanju=100;  
  110. function get(){  
  111. var i=10;  
  112. if(true){  
  113. var j=1;  
  114. }  
  115. }  
  116. </script>  
  117. 常量  
  118. 在程序执行过程中其值不可改变的量。  
  119. 1、整型常量  
  120. 如:123 ,512  
  121. 2、实型常量  
  122.   
  123. 实型常量是由整数部分加小数部分表示,如3.14,12.43等,也可以使用科学或标准方法表示,  
  124. 如5E7,4e5等。  
  125. 3、布尔值  
  126. 布尔常量只有两种取值true 或false。主要用来说明或代表一种状态或标志,用以控制操作流  
  127. 程  
  128. 4、字符型常量  
  129. 字符型常量是指使用单引号(‘)括起来的字符或双引号(")括起来的字符串。例如,字符‘a‘,  
  130. 字符串 "hello"。  
  131. JavaScript也支持以反斜杠()开头的不可显示的特殊字符,通常称为控制字符。例如换行符  
  132. ‘ ‘)、制表符(‘ ‘)等  
  133. 5、空值  
  134. JavaScript中有一个空值null,表示什么也没有。如试图引用没有定义的变量,就会返回一个  
  135. null值。  
  136. 运算符  
  137. 运算符是完成某种操作的符号。  
  138. 算术运算符:+, -, *, /, %, ++, --  
  139. 比较运算符:= =, >, >=, <, <=, !=  
  140. 逻辑运算符:&&, ||, !  
  141. 赋值运算符:=, +=, -=, *=, /=,  
  142. 表达式  
  143. x=100;  
  144. str="你好";  
  145. t=null;  
  146. 表达式通常是由变量、常量和函数通过运算符构成的有意义的算式。  
  147. 如:a, a*2/3, (x+y)*10+(z-3)*20, x==y  
  148. 第二节 控制结构  
  149. 1、if 语句  
  150. if (表达式){  
  151. 语句块;  
  152. }  
  153. x=80;  
  154. if (x>=60){  
  155. document.write( "恭喜你,及格了!");  
  156. }  
  157. if (表达式){  
  158. 语句块1 ;  
  159. }else{  
  160. 语句块2 ;  
  161. }  
  162. if (x>=0){  
  163. y=x;  
  164. }else{  
  165. y=-x;  
  166. }  
  167. 2、switch语句  
  168. switch(表达式) {  
  169. case 值1:语句1; break;  
  170. case 值2:语句2; break;  
  171. case 值3:语句3; break;  
  172. default: 语句4;  
  173. }  
  174. <script language="javascript">  
  175. function getWeek(week){  
  176. switch(week){  
  177. case 0:  
  178. st="星期日";  
  179. break;  
  180. case 1:  
  181. st="星期一";  
  182. break;  
  183. case 2:  
  184. st="星期二";  
  185. break;  
  186. case 3:  
  187. st="星期三";  
  188. break;  
  189. case 4:  
  190. st="星期四";  
  191. break;  
  192. case 5:  
  193. st="星期五";  
  194. break;  
  195. case 6:  
  196. st="星期六";  
  197. break;  
  198. default:  
  199. st="错误";  
  200. }  
  201. return st;  
  202. }  
  203. </script>  
  204. 3、for 语句  
  205. for (初值表达式; 条件表达式; 更新语句) {  
  206. //循环体语句  
  207. }  
  208. 4、While语句  
  209. while(条件表达式) {  
  210. //循环体语句  
  211. }  
  212. break语句:结束当前的循环或switch语句。  
  213. continue语句:用于for或while语句中,结束本次循环,继续下一次循环。  
  214.   
  215. 第三节 函数  
  216. 函数是一个设定名字的一系列JavaScript语句的有效组合。  
  217. 函数可以带参数,也可以不带,可以有返回值,也可以没有  
  218. 1、函数的定义  
  219. function 函数名([参数列表]) {  
  220. 语句块;  
  221. [return 表达式;]  
  222. }  
  223. <script language="javascript">  
  224. //例:返回两个参数中较大的。  
  225. function max(a,b){  
  226. var x;  
  227. if (a>b)  
  228. x=a;  
  229. else  
  230. x=b;  
  231. return x;  
  232. }  
  233. </script>  
  234. 2、调用函数  
  235. 函数被调用时函数内的代码才真正被执行。  
  236. 调用函数的方法就是使用函数的名称并赋给全部参数相应的值。  
  237. <script language="javascript">  
  238. max(20,30);  
  239. </script>  
  240. 或  
  241. <input type="button" onClick="max(23,45);">  
  242.   
  243. 在JavaScript中调用函数时,可以向函数传递比在函数定义时参数数目要少的参数。在这种情  
  244. 况下,只要不是试图去读那些没有传递过来的参数就行。  
  245. typeof运算符可以得到参数的类型。对于未传递的参数,用typeof运算符得到的结果是  
  246. “undefined”。示例如下:  
  247. <script language="javascript">  
  248. function get(a,b){  
  249. document.write("参数a的数据类型是:"+typeof(a)+"<br>");  
  250. document.write("参数b的数据类型是:"+typeof(b));  
  251. }  
  252. get(32.4);  
  253. </script>  
  254.   
  255. 另外,JavaScript也可以向函数传递比在函数定义时参数数目要多的参数,为了读取这样的参  
  256. 数,可以使用arguments数组。传递给函数的第一个参数是arguments数组的第一个元素,我们可  
  257. 以用“函数名称.arguments[0]”来进行引用。示例如下:  
  258. <script language="javascript">  
  259. function getSum(){  
  260. var sum=0;  
  261. var number=getSum.arguments.length;//使用函数的参数数组  
  262. for(var i=0;i<number;i++){  
  263. sum+=getSum.arguments[i];  
  264. }  
  265. return sum;  
  266. }  
  267. document.write("23+54+65="+getSum(23,54,65));  
  268. </script>  
  269.   
  270. 第四节 JavaScript系统函数  
  271. JavaScript中的系统函数又称为内部方法,它们不属于任何对象,可以直接使用。它们可以完成许  
  272. 多很常用的功能。  
  273. 1、 eval( 字符串表达式)  
  274. 返回字符串表达式中的运算结果值。  
  275. 例:test=eval("x=8+9+5/2");  
  276. document.write(test); //输出显示19.5  
  277. 2、 escape(字符串)  
  278. 返回字符串的一种简单编码,将非字母数字的符号转换为%加其unicode码的十六进制表示。  
  279. 例如: escape("Hello there") 返回 "Hello%20there"  
  280. 3、unescape(字符串)  
  281. 将已编码的字符串还原为纯字符串。  
  282. 4、parseFloat(字符串)  
  283. 返回浮点数  
  284. 5、parseInt(字符串,radix)  
  285. 其中radix是数的进制,默认是十进制数 parseInt(字符串)  
  286. 第五节 事件驱动及事件处理  
  287. 在JavaScript中编写的函数,通常是在其他代码进行调用时才会执行。不过我们也可以将某个  
  288. 函数与某个事件(Event,通常是鼠标或热键的动作)联系起来,使得当事件发生时执行该函数。这个  
  289. 方法称之为事件驱动(Event Driver)。而对事件进行处理的函数,称之为事件处理程序(Event  
  290. Handler事件句柄)。  
  291. 1、事件  
  292. JavaScript事件驱动中的事件是通过鼠标或热键的动作(点击或按下)引发的。下表中列出了  
  293. 常见的事件及其说明。  
  294. FF: Firefox, N: Netscape, IE: Internet Explorer  
  295. 属性说明FF N IE  
  296. onabort 图像加载被中断1 3 4  
  297. onblur 元素失去焦点1 2 3  
  298. onchange 用户改变域的内容1 2 3  
  299. onclick 鼠标点击某个对象1 2 3  
  300. ondblclick 鼠标双击某个对象1 4 4  
  301. onerror 当加载文档或图像时发生某个错误1 3 4  
  302. onfocus 元素获得焦点1 2 3  
  303. onkeydown 某个键盘的键被按下1 4 3  
  304. onkeypress 某个键盘的键被按下或按住1 4 3  
  305. onkeyup 某个键盘的键被松开1 4 3  
  306. onload 某个页面或图像被完成加载1 2 3  
  307. onmousedown 某个鼠标按键被按下1 4 4  
  308. onmousemove 鼠标被移动1 6 3  
  309. onmouseout 鼠标从某元素移开1 4 4  
  310. onmouseover 鼠标被移到某元素之上1 2 3  
  311. onmouseup 某个鼠标按键被松开1 4 4  
  312. onreset 重置按钮被点击1 3 4  
  313. onresize 窗口或框架被调整尺寸1 4 4  
  314. onselect 文本被选定1 2 3  
  315. onsubmit 提交按钮被点击1 2 3  
  316. onunload 用户退出页面1 2 3  
  317. 2、事件与函数的关联  
  318. 要将一个函数与某个HTML元素的事件关联起来,需要设置相应的HTML标记中的属性值。例如,  
  319. 对于一个button元素的click事件的处理函数为MyProc(),则可以用如下的形式将事件与函数关  
  320. 联起来:  
  321. <script language="javascript">  
  322. function myPorc(){  
  323. alert(document.all("txt").value);  
  324. }  
  325. </script>  
  326. <input type="text" name="txt" />  
  327. <input type="button" value="Try" onClick="myPorc( );"/>  
  328. 另一个示例,实现翻转图的效果,原来在网页上显示一幅图片,当用户把鼠标移到该图像上时,自  
  329. 动将图像切换成新的一幅图片;当用户把鼠标移开时,最初的图像又被恢复回来。  
  330. <script language="javascript">  
  331. //处理mouseover事件  
  332. function imgover(){  
  333. document.myForm.img1.src="color.jpg";  
  334. }  
  335. //处理mouseout事件  
  336. function imgout(){  
  337. document.myForm.img1.src="gray.jpg";  
  338. }  
  339. </script>  
  340. <form name="myForm">  
  341. <img border=0 name="img1" src="gray.jpg"  
  342. onmouseover="imgover();"  
  343. onmouseout="imgout()">  
  344. </form>  
  345.   
  346. 课后练习题:  
  347. 1、计算1加到100的和  
  348. 2、使用while语句计算1加到100的和  
  349. 3、打印100以内的偶数序列 :02468。。。  
  350. 4、循环1-100,单数次输出“好好学习!”,偶数次输出“天天向上!”  
  351. 5、在死循环中用if和break实现连续打印20个*就结束循环。  
  352. 6、编程查找满足下列条件的三个正整数:x+y+z=50并且x+2*y+5*z=100  
  353. 7、编写函数输出下面的图案  
  354. *  
  355. **  
  356. ***  
  357. ****  
  358. 最多的星数目为函数参数n所决定。  
  359. 8、将a,b,c三个整数按它们数值的大小,从小到大的顺序打印显示。  
  360. (练习if else语句)  
  361. 9、编写函数输出下面的图案  
  362. *  
  363. **  
  364. ***  
  365. ****  
  366. ***  
  367. **  
  368. *  
  369. 行数为函数的参数n决定。  
  370. 10、编写函数寻找水仙花数。  
  371. (三位数各位数字的立方和恰巧是该数本身,100到999之间有四个这样的数)。<strong><span style="font-size:32px;color:#ff0000;">  
  372. </span></strong>  
第二章 JavaScript内置对象

 

 

[javascript] view plain copy
 
 print?
  1. 对象概述  
  2. JavaScript是一种基于对象的脚本语句,而不是面向对象的编程语言。  
  3. 对象就是客观世界存在的实体,具有属性和方法两方面特性。  
  4. 访问对象的属性和方法的方式如下:  
  5. 对象名.属性  
  6. 对象名.方法名()  
  7. 第一节 数组对象类型 Array  
  8. 数组可以存放很多相同类型的数据。有数组名代表所有这些数据,而用  
  9. 数组名[下标]表示其中某个元素(下标从0开始)。  
  10. 如:var myA=["张三","李四","王五"];  
  11. document.write(myA); //看到所有三个字符串  
  12. myA[0]指向第一个元素  
  13. myA[2]指向第三个元素  
  14. 1、建立数组的三种方法:  
  15. (1) 使用方括号,创建数组的同时赋初值  
  16. var myA=["张三", "李四","王五"];  
  17. var b=[10,20,30,40];  
  18. (2) 使用new 操作符,创建数组的同时赋初值  
  19. var myA=new Array("张三", "李四","王五");  
  20. 注意圆括号和方括号的区别,不能任意使用。  
  21. (3) 先创建长度为10的数组,内容后面再赋值  
  22. var anArray = new Array(9);  
  23. anArray[0]= "张三";  
  24. anArray[1]= "李四";  
  25. anArray[2]= "王五";  
  26.   
  27. 2、数组的属性  
  28. length  
  29. 数组名.length 返回数组中元素的个数  
  30. 如:myA.length 为 3  
  31. 例:使用for语句输出myA数组的各个元素。  
  32. for(i=0;i<myA.length;i++){  
  33. alert(myA[i]);  
  34. }  
  35. 3、数组的方法  
  36. join(分割符)  
  37. 该方法的功能是把数组中所有数据用指定的分割符连接起来,以一个字符串的形式表达出来。  
  38. 例如:  
  39. myA.join("/") 返回一个字符串 "张三/李四/王五"  
  40. reverse()  
  41. 该方法的功能是将数组中的元素整个反转顺序。  
  42. 例如:  
  43. myA.reverse( ) 数组变为 ["王五","李四","张三"]  
  44. sort()  
  45. 该方法的功能是将数组元素排序(汉字按拼音的字母顺序)。  
  46. 例如:  
  47. myA.sort () 数组变为 ["李四","王五","张三"]  
  48. concat()  
  49. 方法用于连接两个或多个数组。  
  50. 下面的例子将把 concat() 中的参数连接到数组 a 中  
  51. <script type="text/javascript">  
  52. var a = [1,2,3];  
  53. document.write(a.concat(4,5));  
  54. //输出结果是:  
  55. //1,2,3,4,5  
  56. </script>  
  57. 下面的例子创建了两个数组,然后使用 concat() 把它们连接起来  
  58. <script type="text/javascript">  
  59. var arr = ["George","John","Thomas"];  
  60. var arr2 = ["James","Adrew","Martin"];  
  61. document.write(arr.concat(arr2));  
  62. //输出结果是:  
  63. //George,John,Thomas,James,Adrew,Martin  
  64. </script>  
  65. 下面的例子创建了三个数组,然后使用 concat() 把它们连接起来  
  66. <script type="text/javascript">  
  67. var arr = ["George","John","Thomas"];  
  68. var arr2 = ["James","Adrew","Martin"];  
  69. var arr3 = ["William","Franklin"];  
  70. document.write(arr.concat(arr2,arr3));  
  71. //输出结果是:  
  72. //George,John,Thomas,James,Adrew,Martin,William,Franklin  
  73. </script>  
  74. pop()  
  75. 方法用于删除并返回数组的最后一个元素。  
  76. 删除数组的最后一个元素,把数组长度减 1,并且返回它删除的元素的值。如果数组已经为空,  
  77. 则 pop() 不改变数组,并返回 undefined 值。  
  78. <script type="text/javascript">  
  79. var arr = ["George","John","Thomas"];  
  80. document.write(arr);  
  81. document.write("<br />");  
  82. document.write(arr.pop());  
  83. document.write("<br />");  
  84. document.write(arr);  
  85. //输出结果是:  
  86. //George,John,Thomas  
  87. //Thomas  
  88. //George,John  
  89. </script>  
  90. push()  
  91. 方法可向数组的末尾添加一个或多个元素,并返回新的长度。  
  92. 语法:arrayObject.push(newelement1,newelement2,....,newelementX)  
  93. push() 方法可把它的参数顺序添加到 arrayObject 的尾部。它直接修改 arrayObject,而  
  94. 不是创建一个新的数组。push() 方法和 pop() 方法使用数组提供的先进后出栈的功能。  
  95. <script type="text/javascript">  
  96. var arr = ["George","John","Thomas"];  
  97. document.write(arr + "<br />");  
  98. document.write(arr.push("James") + "<br />");  
  99. document.write(arr);  
  100. //输出结果是:  
  101. //George,John,Thomas  
  102. //4  
  103. //George,John,Thomas,James  
  104. </script>  
  105. shift()  
  106. 方法用于把数组的第一个元素从其中删除,并返回第一个元素的值。  
  107. 如果数组是空的,那么 shift() 方法将不进行任何操作,返回 undefined 值。请注意,该方  
  108. 法不创建新数组,而是直接修改原有的 arrayObject。  
  109. <script type="text/javascript">  
  110. var arr = ["George","John","Thomas"];  
  111. document.write(arr + "<br />");  
  112. document.write(arr.shift() + "<br />");  
  113. document.write(arr);  
  114. //输出结果是:  
  115. //George,John,Thomas  
  116. //George  
  117. //John,Thomas  
  118. </script>  
  119. unshift()  
  120. 方法可向数组的开头添加一个或更多元素,并返回新的长度。  
  121. unshift() 方法将把它的参数插入 arrayObject 的头部,并将已经存在的元素顺次地移到  
  122. 较高的下标处,以便留出空间。该方法的第一个参数将成为数组的新元素 0,如果还有第二个参数,  
  123. 它将成为新的元素 1,以此类推。  
  124. 请注意,unshift() 方法不创建新的创建,而是直接修改原有的数组。  
  125. <script type="text/javascript">  
  126. var arr = ["George","John","Thomas"];  
  127. document.write(arr + "<br />");  
  128. document.write(arr.unshift("William") + "<br />");  
  129. document.write(arr);  
  130. //输出结果是:  
  131. //George,John,Thomas  
  132. //4  
  133. //William,George,John,Thomas  
  134. </script>  
  135. slice(start,end)  
  136. 从已有的数组中返回选定的元素。  
  137. <script type="text/javascript">  
  138. var arr = ["George","John","Thomas"];  
  139. document.write(arr + "<br />");  
  140. document.write(arr.slice(1) + "<br />");  
  141. document.write(arr);  
  142. //输出结果是:  
  143. //George,John,Thomas  
  144. //John,Thomas  
  145. //George,John,Thomas  
  146. </script>  
  147. <script type="text/javascript">  
  148. var arr =["George","John","Thomas","James","Adrew","Martin"];  
  149. document.write(arr + "<br />");  
  150. document.write(arr.slice(2,4) + "<br />");  
  151. document.write(arr);  
  152. //输出结果是:  
  153. //George,John,Thomas,James,Adrew,Martin  
  154. //Thomas,James  
  155. //George,John,Thomas,James,Adrew,Martin  
  156. </script>  
  157. splice()  
  158. 方法用于插入、删除或替换数组的元素。  
  159. 语法:arrayObject.splice(index,howmany,element1,.....,elementX)  
  160. splice() 方法可删除从 index 处开始的零个或多个元素,并且用参数列表中声明的一个或多  
  161. 个值来替换那些被删除的元素。  
  162. 参数描述  
  163. index  
  164. 必需。规定从何处添加/删除元素。  
  165. 该参数是开始插入和(或)删除的数组元素的下标,必须是数字。  
  166. howmany 必需。规定应该删除多少元素。必须是数字,但可以是 "0"。  
  167. 如果未规定此参数,则删除从 index 开始到原数组结尾的所有元素。  
  168. element1 可选。规定要添加到数组的新元素。从 index 所指的下标处开始插入。  
  169. elementX 可选。可向数组添加若干元素。  
  170. 下面的实例中,创建一个新数组,并向其添加一个元素:  
  171. <script type="text/javascript">  
  172. var arr =["George","John","Thomas","James","Adrew","Martin"];  
  173. document.write(arr + "<br />");  
  174. arr.splice(2,0,"William");  
  175. document.write(arr + "<br />");  
  176. //输出结果是:  
  177. //George,John,Thomas,James,Adrew,Martin  
  178. //George,John,William,Thomas,James,Adrew,Martin  
  179. </script>  
  180. 下面的实例中,将删除位于 index 2 的元素,并添加一个新元素来替代被删除的元素:  
  181. <script type="text/javascript">  
  182. var arr =["George","John","Thomas","James","Adrew","Martin"];  
  183. document.write(arr + "<br />");  
  184. arr.splice(2,1,"William");  
  185. document.write(arr);  
  186. //输出结果是:  
  187. //George,John,Thomas,James,Adrew,Martin  
  188. //George,John,William,James,Adrew,Martin  
  189. </script>  
  190. 下面的实例中,将删除从 index 2 ("Thomas") 开始的三个元素,并添加一个新元素  
  191. ("William") 来替代被删除的元素:  
  192. <script type="text/javascript">  
  193. var arr =["George","John","Thomas","James","Adrew","Martin"];  
  194. document.write(arr + "<br />");  
  195. arr.splice(2,3,"William");  
  196. document.write(arr);  
  197. //输出结果是:  
  198. //George,John,Thomas,James,Adrew,Martin  
  199. //George,John,William,Martin  
  200. </script>  
  201. 4、内部数组  
  202. 在网页对象中,有很多本身就是数组对象。例如:document对象的forms属性就是一个数组对  
  203. 象,其中每个元素对应网页中的一个表单,示例如下:  
  204. <form name="firstForm"></form>  
  205. <form name="secondForm"></form>  
  206. <form name="thirdForm"></form>  
  207. <script language="javascript">  
  208. var fs=document.forms;  
  209. for(i=0;i<fs.length;i++){  
  210. alert(fs[i].name);  
  211. }  
  212. </script>  
  213. 表单中的一个选择列表的options属性也是一个数组对象,其中每个元素对应于列表中的一个  
  214. 选择项目  
  215. <form name="myForm">  
  216. <select multiple size="5" name="box" style="width:150" onClick="f(this);">  
  217. <option value="apple">苹果</option>  
  218. <option value="orange">橘子</option>  
  219. <option value="banana">香蕉</option>  
  220. </select>  
  221. </form>  
  222. <script language="javascript">  
  223. function f(o){  
  224. for(i=0;i<o.options.length;i++){  
  225. alert(o.options[i].value+","+o.options[i].text);  
  226. }  
  227. }  
  228. </script>  
  229.   
  230. 第二节 字符串对象类型 String  
  231. myStr="我们来自五湖四海!";  
  232. 或  
  233. myStr= new String("我们来自五湖四海!");  
  234. 1、字符串的长度属性  
  235. myStr.length 返回字符串中字符的个数9,一个汉字算一个字符。  
  236. 2、字符串的方法  
  237. 分为两大类,如下:  
  238. (1) 格式设置方法:  
  239. big(), bold(), fontcolor(颜色字符串), fontsize(字体号), sub(), sup()  
  240. (2) 通用字符串操作。  
  241. str="Hello";  
  242. 方法描述示例及结果  
  243. anchor() 创建 HTML 锚。str.anchor("b"):<A NAME=”b”>Hello</A>  
  244. big() 用大号字体显示字符串。str.big() : <BIG>Hello</BIG>  
  245. blink() 显示闪动字符串。str.blink() : <BLINK>Hello</BLINK>  
  246. bold() 使用粗体显示字符串。str.bold() : <B>Hello</B>  
  247. charAt() 返回在指定位置的字符。"北京欢迎你".charAt(2)结果是"欢"  
  248. "北京欢迎你".charAt(0)结果是"北"  
  249. charCodeAt() 返回在指定的位置的字符的  
  250. Unicode 编码。  
  251. "北京欢迎你".charCodeAt(2)结果是27426  
  252. concat() 连接字符串。"北京".concat("欢迎你")结果是"北京欢迎你"  
  253. fixed() 以打字机文本显示字符串。str.fixed() : <FIXED>Hello</FIXED>  
  254. fontcolor() 使用指定的颜色来显示字符串。str. Fontcolor ("Red") :  
  255. <FONT color="red">Hello</FONT>  
  256. fontsize() 使用指定的尺寸来显示字符串。str. fontsize () : <FONT  
  257. size="3">Hello</FONT>  
  258. indexOf() 检索字符串。"北京欢迎你".indexOf("欢迎")结果是2  
  259. "北京欢迎你".indexOf("上海")结果是-1  
  260. "北京欢迎你,欢迎".indexOf("欢迎")结果是2  
  261. italics() 使用斜体显示字符串。str. italics () : <I>Hello</I>  
  262. lastIndexOf() 从后向前搜索字符串。"北京欢迎你,欢迎".lastIndexOf("欢迎")结果是6  
  263. link() 将字符串显示为链接。str.link("http://www.javakc.com") :  
  264. <a href="http://www.javakc.com"> Hello  
  265. </a>  
  266. match() 找到一个或多个正则表达式的匹配。  
  267. replace() 替换与正则表达式匹配的子串。  
  268. search() 检索与正则表达式相匹配的值。  
  269. slice() 提取字符串的片断,并在新的字符  
  270. 串中返回被提取的部分。  
  271. "北京欢迎你".slice(2,4) 结果是"欢迎"  
  272. small() 使用小字号来显示字符串。str.small():<SMALL>Hello</SMALL>  
  273. split() 把字符串分割为字符串数组。"北京|欢迎你|欢迎".split("|")结果是  
  274. 数组{"北京","欢迎你","欢迎"}  
  275. strike() 使用删除线来显示字符串。str.strike():<strike>Hello </strike>  
  276. sub() 把字符串显示为下标。  
  277. str.sub( ) : <sub> Hello </sub>  
  278. substr() 从起始索引号提取字符串中指定数  
  279. 目的字符。  
  280. "北京欢迎你".substr(1,2) 结果是"京欢"  
  281. substring() 提取字符串中两个指定的索引号之  
  282. 间的字符。  
  283. "北京欢迎你".substring(2,4)结果是"欢迎"  
  284. sup() 把字符串显示为上标。str.sup():<sub> Hello </sub>1  
  285. toLowerCase() 把字符串转换为小写。  
  286. (不改变旧的字符串)  
  287. "Welcome to BeiJing".toLowerCase()结果  
  288. 是  
  289. welcome to beijing  
  290. toUpperCase() 把字符串转换为大写。  
  291. (不改变旧的字符串)  
  292. "Welcome to BeiJing".toUpperCase()结果  
  293. 是WELCOME TO BEIJING  
  294.   
  295. 第三节 数学类 Math  
  296. 包含了常用的数学常量和函数。不需要创建该类型的对象,而可以直接使用Math.属性名或  
  297. Math.方法名来使用这些常量和方法。  
  298. Math.E 返回2.718  
  299. Math.PI 返回3.14159  
  300. Math 对象方法  
  301. 方法描述  
  302. abs(x) 返回数的绝对值。  
  303. acos(x) 返回数的反余弦值。  
  304. asin(x) 返回数的反正弦值。  
  305. atan(x) 以介于 -PI/2 与 PI/2 弧度之间的数值来返回 x 的反正切值。  
  306. atan2(y,x) 返回从 x 轴到点 (x,y) 的角度(介于 -PI/2 与 PI/2 弧度之间)。  
  307. ceil(x) 对数进行上舍入。  
  308. cos(x) 返回数的余弦。  
  309. exp(x) 返回 e 的指数。  
  310. floor(x) 对数进行下舍入。  
  311. log(x) 返回数的自然对数(底为e)。  
  312. max(x,y) 返回 x 和 y 中的最高值。  
  313. min(x,y) 返回 x 和 y 中的最低值。  
  314. pow(x,y) 返回 x 的 y 次幂。  
  315. random() 返回 0 ~ 1 之间的随机数。  
  316. round(x) 把数四舍五入为最接近的整数。  
  317. sin(x) 返回数的正弦。  
  318. sqrt(x) 返回数的平方根。  
  319. tan(x) 返回角的正切。  
  320. toSource() 返回该对象的源代码。  
  321. valueOf() 返回 Math 对象的原始值。  
  322. 第四节 日期时间类 Date  
  323. 该类型对象中存放年月日时分秒等信息。  
  324. 1、创建日期对象的几种办法:  
  325. new Date() 不带参数,则以系统时间为新创建日期对象的内容。  
  326. new Date(毫秒数) 以距1970年1月1日零时到期望时间的毫秒数为参数,创建日期对象  
  327. new Date(2005,6,3,21,0,22) 设定2005年7月3日,注意月从0开始的  
  328. new Date("July 3, 2005 21:00:22") 以指定的时间为新创建日期对象的内容  
  329. 2、日期对象的方法:  
  330. getDate() 返回几号  
  331. getDay() 返回星期几 (0代表星期日,1到6代表星期一到星期六)  
  332. getHours() 返回几点  
  333. getMinutes() 返回分钟数  

    javascript零基础入门2:javascript数据类型

    🍅Java学习路线总结:搬砖工逆袭Java架构师🍅Java经典面试题大全:10万字208道Java经典面试题总结(附答案)🍅简介:Java领域优质创作者🏆、CSDN哪吒公众号作者✌、Java架构师奋斗者💪🍅扫描主... 查看详情

    不容错过,零基础入门python学习路线最佳实践(代码片段)

    今天我们来分享零基础入门Python,应该如何自学,自学的路径是怎么样的,内容是从入门到进阶,既有教程,也有经典书籍推荐,还有众多类库介绍,不要错过哦文章目录文档教程Python官方文档廖雪峰... 查看详情

    javascript零基础入门6:javascript垃圾回收(代码片段)

    🍅Java学习路线配套文章:搬砖工逆袭Java架构师🍅Java经典面试题大全:10万字208道Java经典面试题总结(附答案)🍅简介:Java领域优质创作者🏆、CSDN哪吒公众号作者✌、Java架构师奋斗者💪🍅扫... 查看详情

    阿里云天池学习赛汇总(教学赛,零基础入门,长期赛)

    ...析【教学赛】数据分析达人赛3:汽车产品聚类分析零基础入门语音识别-食物声音识别零基础入门数据挖掘-心跳信号分类预测零基础入门语义分割-地表建筑物识别零基础入门数据分析-学术前沿趋势分析零基础入门Docker-cuda练习场... 查看详情

    javascript零基础入门5:javascript函数(代码片段)

    🍅Java学习路线配套文章:搬砖工逆袭Java架构师🍅Java经典面试题大全:10万字208道Java经典面试题总结(附答案)🍅简介:Java领域优质创作者🏆、CSDN哪吒公众号作者✌、Java架构师奋斗者💪🍅扫... 查看详情

    javascript零基础入门10:正则表达式(代码片段)

    🍅Java学习路线配套文章:Java学习路线总结,搬砖工逆袭Java架构师(全网最强)🍅基础推荐:Java基础教程系列🍅实战推荐:SpringBoot基础教程🍅简介:Java领域优质创作者🏆、CSDN哪... 查看详情

    零基础入门深度学习目录

    ...:《深度学习100例》🔥推荐专栏:《零基础入门深度学习》📚选自专栏:《Matplotlib教程》🧿优秀专栏:《Python入门100题》📕入门篇1.环境配置【零基础入门深度学习】1-1:配置深度学习环境... 查看详情

    转载零基础入门深度学习-参考文献

    【转载】零基础入门深度学习-参考文献机器学习深度学习参考资料零基础入门深度学习(1)-感知器TomM.Mitchell,“机器学习”,曾华军等译,机械工业出版社零基础入门深度学习(2)-线性单元和梯度下降TomM.Mitchell,“机器学习”,曾华军... 查看详情

    转载零基础入门深度学习-参考文献

    【转载】零基础入门深度学习-参考文献机器学习深度学习参考资料零基础入门深度学习(1)-感知器TomM.Mitchell,“机器学习”,曾华军等译,机械工业出版社零基础入门深度学习(2)-线性单元和梯度下降TomM.Mitchell,“机器学习”,曾华军... 查看详情

    量化金融零基础如何入门哪里有系统学习资料需要考什么证书?

    量化金融零如何基础入门、哪里有系统学习资料、需要考什么证书?1课程知识量化金融对口专业是金融工程,金融工程常用的技能。概率论数理统计数学分析线性代数(矩阵分析运算)常/偏微分方程风险管理分... 查看详情

    量化金融零基础如何入门哪里有系统学习资料需要考什么证书?

    量化金融零如何基础入门、哪里有系统学习资料、需要考什么证书?1课程知识量化金融对口专业是金融工程,金融工程常用的技能。概率论数理统计数学分析线性代数(矩阵分析运算)常/偏微分方程风险管理分... 查看详情

    学习资料

    ...、深度学习1、https://www.zybuluo.com/hanbingtao/note/433855零基础入门深度学习(1)-感知器 零基础入门深度学习(2)-线性单元和梯度下降 零基础入门深度学习(3)-神经网络和反向传播算法 零基础入门深度学习(4)-卷积神经网络 ... 查看详情

    转载零基础入门深度学习-感知器(代码片段)

    【转载】零基础入门深度学习(1)-感知器机器学习深度学习转载自https://www.zybuluo.com/hanbingtao/note/433855无论即将到来的是大数据时代还是人工智能时代,亦或是传统行业使用人工智能在云上处理大数据的时代,作为一个有理... 查看详情

    javascript零基础入门day3javascript运算符(代码片段)

    🍅Java学习路线配套文章:搬砖工逆袭Java架构师🍅Java经典面试题大全:10万字208道Java经典面试题总结(附答案)🍅简介:Java领域优质创作者🏆、CSDN哪吒公众号作者✌、Java架构师奋斗者💪🍅扫... 查看详情

    《算法零基础100讲》(第55讲)哈希表入门

    文章目录零、写在前面一、概念定义1、哈希表的定义2、哈希数组3、关键字4、哈希函数5、哈希冲突6、哈希地址二、题目描述三、算法详解四、源码剖析五、推荐专栏六、习题练习零、写在前面  这是《算法零基础100讲》专栏... 查看详情

    零基础怎么学前端?要学哪些内容?

    ...已)-->CSS(不做纯前端看几天,做纯前端练一个月)-->JavaScript(重点基础,花1到2个月时间用心学),然后看你想用什么语言做后端,不想学其它语言就接着看Node.js,vue。这2个合起来一个月左右,恭喜你,你入门了!后面你就知... 查看详情

    前端零基础入门学习

    不管任何行业、任何技术,零基础的人要入门都是要踩很多的坑的,但是时间宝贵,如果有人能帮你避坑,帮你解决问题,效率会更高,少花一些时间走弯路。点击前端学习笔记进行学习 查看详情

    2023年web前端开发学习路线图

    ...3+前端项目2.移动web开发实战第二阶段:技术进阶1.JavaScript深入浅出-0基础入门神器2.JavaScript核心之WebAPIs3.数据交互&异步编程-前端进阶Ajax零基础入门第三阶段:VUE开发1.前端高级Node.js零基础入门教程2.前端框架 查看详情