JavaScript的基础与DOM编程
详细阐述了JavaScript的基础,并且对网站前后台开发所牵扯的重要DOM编程进行了详细的解说和测试,对想要了解js或者需要提高DOM编程的程序猿很适合
光仔December
技术宅,系统集成项目管理工程师,FCP-报表开发工程师,全国软件开发(C/C++)专业人才高级认证,2014年ACM-ICPC河南省赛区银奖,2014年第五届蓝桥杯河南赛区C/C++程序设计本科B组二等奖,2015年甲骨文杯全国Java程序设计大赛华中赛区A组二等奖,2015年中国大学生计算机设计大赛团队三等奖
展开
-
【JavaScript】小样例-js仿jquery的表单验证
自己写了一个仿jquery的表单验证,用的纯javascript效果:代码: js测试 用户名: 密码: function confirm(){ var uELement=document.getElementById("u"); var pELement=document.get原创 2015-08-30 20:52:38 · 1578 阅读 · 0 评论 -
【JavaScript】DOM操作下拉框
DOM操作下拉框这次要实现一个效果,如下图:在左边选框里选择一个选项,点击"-->",就会把该选项选到右边框里。在左边选框里选择多个选项,点击"==>",就会把多个选项选到右边框里。在右边选框里选择一个选项,点击"-->",就会把该选项选到左边框里。在右边选框里选择多个选项,点击"==>",就会把多个选项选到左边框里。效果就是这样,下面我们来实现它:原创 2015-08-30 20:48:08 · 2353 阅读 · 0 评论 -
【JavaScript】DOM操作复选框
DOM操作复选框实现一个效果如下图:点击"全选/全不选"复选框之后,足球、篮球、游泳和唱歌均被选取。取消"全选/全不选"复选框之后,被选中的所有都变成未选中。点击"全选"按钮之后,足球、篮球、游泳和唱歌均被选取,点击"全不选"之后,被选中的所有都变成未选中。点击反选之后,未选中的变成选中的,选中的变成未选中的。下面我们来实现这个效果。源代码: j原创 2015-08-26 21:05:04 · 2967 阅读 · 0 评论 -
【JavaScript】DOM操作表格
DOM操作表格1.利用JavaScript动态增加、删除表格内容页面如图注:首先说个小问题,有些如制定按钮点击事件的js代码,放在html文档最后可以,放在最前面(标签内)不可以,原因是html文档是自上往下读取,当读到最上面的js、代码时,并没有读取相应的DOM标签,所以制定的按钮功能没有效果,如果非要放在上面,可以指定到window.onload方法中去:原创 2015-08-26 21:02:41 · 1902 阅读 · 0 评论 -
【JavaScript】DOM节点常用方法介绍02
DOM节点常用方法介绍021.替换节点replaceChild()把一个给定父元素里的一个子节点替换为另外一个子节点var reference = element.replaceChild(newChild,oldChild);返回值是一个指向已被替换的那个子节点的引用指针。如果被插入的子节点还有子节点,则那些子节点也被插入到目标节点中例子:原创 2015-08-24 09:57:47 · 1336 阅读 · 0 评论 -
【JavaScript】DOM节点常用方法介绍01
DOM节点常用方法介绍011.查找元素节点1.1getElementById() 寻找一个有着给定 id 属性值的元素,返回值是一个有着给定id属性值的元素节点。如果不存在这样的元素,它返回null.var oElement = document.getElementById ( sID ) 该方法只能用于document对象例子:原创 2015-08-24 09:48:46 · 1384 阅读 · 0 评论 -
【JavaScript】DOM结构介绍和方法预览
DOM1.DOM介绍DOM是Document Object Model文档对象模型的缩写。根据W3C DOM规范,DOM是一种与浏览器,平台,语言无关的接口,使得你可以访问页面其他的标准组件D:文档 – html 文档 或 xml 文档O:对象 – document 对象的属性和方法M:模型 DOM 是针对xml(html)的基于树的API。DOM树:节点原创 2015-08-20 13:35:31 · 3515 阅读 · 0 评论 -
【JavaScript】javaScript基础知识回顾
我们首先对JavaScript的基础进行回顾。1.浏览器的对象树总浏大纲,还是要先看浏览器的对象树:如1.1浏览器的对象树.png2.window对象常用方法alert(‘信息’): 消息框prompt(‘提示信息’,默认值): 标准输入框confirm( ): 确认框open( ): 打开一个新窗口close( ):原创 2015-08-20 13:32:54 · 1253 阅读 · 0 评论 -
【JavaScript】document对象属性
document对象中,并没有特别的事件,它所支持的都是通用的。在document上讲解这些属性不具有典型性,但只要掌握了一个对象在某个事件上的处理方式,也就自然的掌握了在其它对象上处理这个事件。对于document对象所支持的事件在这里就不赘述了。下面说一下document对象属性:1.forms数组对象:代表html文档中的所有form标签对的集合。2.an原创 2015-08-13 17:00:59 · 2637 阅读 · 0 评论 -
【JavaScript】script标签的属性
Script标签当中,除了一些我们经常使用的属性外,它他还有一些更为特殊的属性。1.defer属性,这是一个不用设置属性值的属性。下面通过两段程序代码来说明defer属性:代码A:aaadocument.write("bbb");ccc代码B:aaadocument.write("bbb");ccc程序代码A的运行效果:原创 2015-03-15 13:35:30 · 2620 阅读 · 0 评论 -
【JavaScript】document对象_Cookie属性
Cookie是什么?借助document的cookie属性,Javascript程序就可以实现与www服务器一样的cookie功能,即获取当前的cookie信息和产生一个新的cookie。一个浏览器访问www服务器的每个网页文件,都是独立的,每个网页的javascript程序之间的信息也不能共享。即使是同一个网页的上一次访问和下一次访问之间也无法传递数据。同一张网页原创 2015-03-15 13:33:04 · 2820 阅读 · 0 评论 -
【JavaScript】window对象属性
window对象-属性closed属性:表示对应的window对象的窗口是否关闭。返回true表示窗口已经被关闭,返回false表示窗口没有被关闭。opener属性:返回打开当前窗口的window对象。defaultstatus属性:用于设置和返回窗口状态栏中缺省显示的文本内容。 也就是在没有任何操作的情况下状态栏中所显示的文本内容。status属性:它原创 2015-03-08 12:17:25 · 1571 阅读 · 0 评论 -
【JavaScript】window对象事件
window对象-事件专用事件:onload事件:我们需要在网页文档下载完毕时执行的程序代码,需要放在onload事件处理程序中去编写。onunload事件:在网页文档卸载完毕后,需要在网页关闭时执行的程序代码,需要放在onunload事件处理程序中去编写。onbeforeunload事件:对于浏览器准备卸载网页文件时的事件,也就是onbeforeunloa原创 2015-03-08 12:08:27 · 2926 阅读 · 0 评论 -
【JavaScript】window对象_event事件对象
1.event对象属性event对象可以获取和设置当前事件的有关信息,比如,获取发生事件的事件源对象,像键盘按下时使用的是哪个按键,鼠标事件发生时的鼠标位置,以及按下的鼠标按键是哪个。主要属性:altKey属性:用于检测事件发生时,alt键是否被按下(true/false)。ctrlKey属性:用于检测事件发生时,ctrl键是否被按下(true/false)。原创 2015-03-08 01:11:06 · 2054 阅读 · 0 评论 -
【JavaScript】window对象_frames数组对象
window对象的frames属性是一个数组,它与window对象的parent、top等对象属性,都是用于对HTML的帧标签(或)进行编程的javascript对象。(利用parent.frames.来调用)framedemo.html:脚本代码最好不要编写在framedemo.html中,而是写在frame各个区域的网页中。top.html:<原创 2015-03-08 01:04:49 · 6251 阅读 · 0 评论 -
【JavaScript】DOM编程-DHTML与Windows对象
A.什么是DHTML?javascript是在浏览器中运行的,如果它仅限于加减乘除运算,而不能将运算结果显示在浏览器当中,或者不能与用户进行交互操作,那么他就失去了存在的意义。在程序中,创建的对象是用来描述现实世界的有行或无形的事物的。javascript将浏览器本身、网页文档、以及网页文档中的HTML元素等都用相应的内置对象来表示,这些对象及对象之间的层次系统称为原创 2015-02-24 09:57:38 · 1599 阅读 · 0 评论 -
【JavaScript】JavaScript的数组剖析
1.数组列表数组列表用于表示一个数据的集合,它由一对方括号([])包围,列表中的每个元素用逗号分隔,数组元素可以使任意类型的数据(包括其他数组)。例如, var arr=["zs",123,'li',3.5];对于每个数组变量,都有一个length属性,表示该数组元素中的个数。使用“数组变量名[索引号]”的格式来访问每个数组元素。数组列表中的第一个原创 2015-02-24 09:40:17 · 1057 阅读 · 0 评论 -
【JavaScript】JavaScript的对象-对象专门语句
1.Math对象:是一个静态对象,不能使用new关键字创建对象实例,应直接使用“对象名.成员”的格式来访问其属性或方法,例如var num=Math.random();属性:E,代表数字常数e,约等于2.718LN10,代表10的自然对数,约等于2.302LN2,代表2的自然对数,约等于0.693PI不用解释了SQPT1-2,代表2的平方根分之一,约原创 2015-02-22 21:34:35 · 1441 阅读 · 0 评论 -
【JavaScript】JavaScript的对象-内部对象
JavaScript的内部对象1.动态对象 使用"对象实例名.成员"的格式来访问其属性和方法。2.静态对象 直接使用"对象名.成员"的格式来访问其属性和方法常用对象:Object对象String对象Math对象Date对象toString方法1.Object对象Object对象提供了一种创建自定义对象的简单方式,不需要程序员再原创 2015-02-22 20:39:37 · 1708 阅读 · 0 评论 -
【JavaScript】JavaScript的对象-在函数中修改参数值的问题
在函数中修改参数值的问题将基本数据类型的变量作为函数参数传递的情况: function changeValue(x) { x=5; } var x=3; changeVlaue(x); alert(x);//此处的x为多少?其实形参是局部变量,当函数调用结束以后,用作形参的局部变量就会不存在。即使在函数中修改了传原创 2015-02-22 20:33:55 · 7414 阅读 · 0 评论 -
【JavaScript】JavaScript的对象-构造方法与this关键字
构造方法和this关键字*为一个对象实例新增加的属性和方法,不会增加到同一个对象所产生的其他对象实例上。 function Person()//构造函数 { } var person1=new Person(); person1.age=18; person1.name="Tom"; function say原创 2015-02-22 20:23:41 · 1253 阅读 · 0 评论 -
【JavaScript】JavaScript的对象-JavaScript对象简单剖析
1.对象与对象实例:对象是javascript用来表示复杂数据类型的一种方式。例如,我们要在程序中运用一种数据类型来描述一个人的信息。由于人有身高、体重、年龄性别等各种特性,吃饭、睡觉等各种动作,就需要创建一种“对象”的数据类型。“对象”就是描述一类事物的若干变量的集合体。同时它还提供了对这些变量进行操作的函数。(javascript的对象类似Java的类,javascript的对象实原创 2015-02-21 23:08:22 · 1133 阅读 · 0 评论 -
【JavaScript】JavaScript基础-函数
1,函数的作用与定义:Javascript也是基于对象(Object-based)的编程语言,而不是面向对象的语言。----主程序-----| | 函数1 | ..... | 函数2 | ..... |原创 2015-02-21 23:00:58 · 1195 阅读 · 0 评论 -
【JavaScript】JavaScript基础-变量、运算符与控制语句
一.变量变量:定义一个变量,系统会为之分配一块内存,程序可以用变量名来表示这块内存中的数据。由于javascript采用的是弱类型的变量形式,因此,在声明一个变量的时候,我们不必声明它的类型,但是在使用的时候由javascript引擎来自动确定变量的数据类型。声明变量需要使用var关键字例如:var name;声明变量的同时为其赋值例如:var name="原创 2015-02-21 22:58:00 · 1266 阅读 · 0 评论 -
【JavaScript】JavaScript基础-基本数据类型与常量和关键字
1.整型常量十六进制以0x或0X开头,例如:0x8a八进制必须以0开头,例如:0123十进制的第一位不能是0(数字0除外),例如:1232.实型常量12.32、193.98、5E7、4e5等。3.布尔值true和false4.字符串和常量"a book of JavaScript"、"abc"、"a"、""。5.字符串中的特殊字符,需要以反斜原创 2015-02-20 19:09:01 · 1596 阅读 · 0 评论 -
【JavaScript】JavaScript基础-脚本代码的位置与基本语法
一.脚本代码的位置1.放置在标签对之间。a)可以使用多个标签对来嵌入多段javascript代码 var x=3;这是一个HTML段落 alert(x);b)可以全部放在一个标签对之间这是一个HTML段落 var x=3; alert(x);c)防止浏览器不识别JavaScript原创 2015-02-20 19:02:26 · 1117 阅读 · 0 评论 -
【JavaScript】JavaScript概述-JavaScript的定义与基础
Html只是表现形式的语言,无法与用户进行交互活动,这就催生出了脚本语言的面世。脚本程序的出现,弥补了html的不足。最常见的两种脚本语言是VBScript和JavaScript。VBScript是微软的脚本语言,同时它又是asp动态网页默认的编程语言;JavaScript是Netscape与Sun合作的脚本语言,前身是Livescript。为了取得技术优势,微软推原创 2015-02-20 18:58:45 · 2279 阅读 · 0 评论