2014年辛星解读Javascript之用DOM动态操纵HTML元�

关于DOM,我们了解了能够用DOM操纵HTML的一些属性和样式,还能够为HTML元素绑定事件等等,那么接下来,我们将涉及到用DOM来动态的创建.删除HTML等一些操作,我的核心思路还是重实战,因此,代码演示样例是肯定少不了的. 只是在使用DOM动态操纵HTML元素之前,我们还是先了解一下DOM树,以下是我从网上找的一个DOM树的图片,它的截图例如以下: 假设大家学习过"树"这样的数据结构,就会非常好理解,一个父节点能够包括N个子节点,这些子节点可能是div.p等标签,也能够是属性,还能…

2014年辛星解读Javascript之DOM之冒泡和捕获

上篇博客提到了Javascript事件绑定函数的三个參数.第一个是一个event.第二个是一个function.第三个是一个布尔变量.它用于指定事件传递的顺序,分为冒泡和捕获两种方式,接下来我们将揭开它的神奇面纱,彻底的解读它. 首先看例如以下代码: <html> <body> <div id = "demo"><p id = "tag">辛星</p></demo> <script typ…

2014年辛星解读Javascript之DOM之事件及其绑定

我们通过DOM的事件能够对HTML的事件作出反应.就像我们用其它编程语言写GUI一样,那么HTML包含哪些事件呢?以下是几个常见的样例,比方网页已经完毕记载,图像完毕载入,鼠标移动到元素上方.输入文字被改变.表单提交.用户点击按键等等,还是蛮多的. 以下我们用实例来演示一下,看以下的HTML代码: <html> <p id = "tag" onclick="this.innerHTML ='小倩' ">辛星</p> </ht…

2014年辛星解读Javascript之DOM高速入门

在Javascript的知识中,有一个所谓的DOM.即文档对象模型,我们能够通过它来訪问HTML文档的元素,当网页被载入的时候,浏览器会去创建DOM,有了这个DOM.我们能够使用Javascript去改变页面中HTML元素和属性,改变CSS样式,能够对页面中的事件作出响应. 首先就是查找一个HTML元素,我们能够通过三种方式来做到,即通过id.标签名和类名,通过id是使用getElementById方法.它是doucument的一个方法.通过标签名则能够使用getElementsByTagNam…

2014年度辛星解读css第四节

接下来的这一节我计划解说的是超链接和列表的样式,然后我们做出一个导航栏出来,事实上导航栏是很常见的,可是我们这里做得这个有点并不那么完好,等我们学完了css之后再完好它. **************超链接************* 1.我们讲伪类的时候已经讲到了,一个超链接能够有link(正常状态).visited(已经訪问过).hover(获得鼠标焦点)active(被鼠标点击中)这样四个状态,我们前面也分别设置过不同的颜色了,使用选择器:伪类的形式. 2.我们还能够使用background…

2014年辛星解读css第一节

CSS是Cascading Style Sheets的缩写.即层叠样式表,它用于表现HTML的样式,即HTML仅仅是去写该网页有哪些内容,至于怎样去表现它们,由CSS去定制. *************时代的呼唤************* 1.在之前,我们直接把网页的格式写到HTML中去,这样会造成格式的混乱,并且难以阅读和改动,只是这不是最大的问题,最大的问题在于我们想给网页换一个表达样式的时候,须要改动的地方不仅非常多关键是非常零散,须要花费非常大的力气去定位这些样式. 2.于是,把网页内容…

2014年辛星解读css第五节

本小节我们解说css中的"盒模型".即"box model",它通经常使用于在布局的时候使用,这个"盒模型"也有人成为"框模型".事实上原理都一样,它的大致原理是这种,它把一个HTML元素分为了这么几个部分:边距.边框.填充和实际内容,我们通过设置这几个内容能够设置它的一些现实形式. *************盒模型***************** 1.盒模型从内向外依次是实际内容(Content).内边距(Padding)…

2014年辛星解读css第二节

第一节我们简单介绍了一下CSS的工作流程,我相信读者会有一个大体的认识,那么接下来我们将会深入的研究一下CSS的细节问题,这些问题的涉及将会使我们的工作更加完好. *************凝视************ 1.CSS也是须要凝视的.凝视中的内容不会被解释运行,它也和C语言一样.用/*开头,用*/结尾.当中的内容会被当做凝视.我们想怎么写就怎么写. 2.以下给个样例: p{ color: green; /* 我们在这里书写凝视 * 辛星CSS,与博客园共同成长 */ font-siz…

2014年辛星解读css第六节

这一节我们就要讲到布局了,事实上布局本身特别简单.可是要合理的布好局就不那么简单了,就像我们写文章一样.写一篇文章非常easy,可是要写一篇名著就非常难了,这须要我们扎实的功底和对文学的理解,可是.千里之行.始于足下,我们開始吧. ************显示方式************* 1.有时候我们会设置一个元素的显示方式.比方我们在做导航条的时候,就会使用display:inline来使它们成为内联的样式. 2.以下先不说这个display,先说一下visibility属性把,它能够设置…

2014年辛星解读css第三节

第二节我们讲述的差点儿全是CSS的选择器,那么以下这一节我们来讲一下CSS的颜色和文本的一些东西,尽管我对调色不大敏感.可是对于颜色还是比較感兴趣的. *********CSS中的颜色*********** 1.说到颜色,不得不一下牛顿.简直是伟大,光的色散,很大的突破,能够说它一个人完毕了几代人没有完毕的工作. 2.以下说一下三原色:即红绿蓝,即RGB,我们在CSS中定义一个颜色能够用这样的三原色的方式来自己配色.还能够用一些比方red.green等这样的比較经典的颜色. 3.我们要配色的话,…

2014年度辛星css教程夏季版第六节

这一节我们就要讲到布局了,其实布局本身特别简单,但是要合理的布好局就不那么简单了,就像我们写文章一样,写一篇文章非常简单,但是要写一篇名著就很难了,这需要我们扎实的功底和对文学的理解,但是,千里之行,始于足下,我们开始吧. ************显示方式************* 1.有时候我们会设置一个元素的显示方式,比如我们在做导航条的时候,就会使用display:inline来使它们成为内联的样式. 2.下面先不说这个display,先说一下visibility属性把,它可以设置为hid…

2014年度辛星css教程夏季版第五节

本小节我们讲解css中的”盒模型“,即”box model“,它通常用于在布局的时候使用,这个”盒模型“也有人成为”框模型“,其实原理都一样,它的大致原理是这样的,它把一个HTML元素分为了这么几个部分:边距.边框.填充和实际内容,我们通过设置这几个内容可以设置它的一些现实形式. *************盒模型***************** 1.盒模型从内向外依次是实际内容(Content).内边距(Padding).边框(Border).外边距(Margin),其中我们通常也说内边距为边…

2014年度辛星css教程夏季版第四节

接下来的这一节我计划讲解的是超链接和列表的样式,然后我们做出一个导航栏出来,其实导航栏是非常常见的,但是我们这里做得这个有点并不那么完善,等我们学完了css之后再完善它. **************超链接************* 1.我们讲伪类的时候已经讲到了,一个超链接可以有link(正常状态).visited(已经访问过).hover(获得鼠标焦点)active(被鼠标点击中)这样四个状态,我们前面也分别设置过不同的颜色了,使用选择器:伪类的形式. 2.我们还可以使用background…

2014年度辛星css教程夏季版第三节

第二节我们讲述的几乎全是CSS的选择器,那么下面这一节我们来讲一下CSS的颜色和文本的一些东西,虽然我对调色不大敏感,但是对于颜色还是比较感兴趣的. *********CSS中的颜色*********** 1.说到颜色,不得不一下牛顿,简直是伟大,光的色散,非常大的突破,可以说它一个人完成了几代人没有完成的工作. 2.下面说一下三原色:即红绿蓝,即RGB,我们在CSS中定义一个颜色可以用这种三原色的方式来自己配色,还可以用一些比如red,green等这种比较经典的颜色. 3.我们要配色的话,首先…

2014年度辛星css教程夏季版第二节

第一节我们简介了一下CSS的工作流程,我相信读者会有一个大体的认识,那么接下来我们将会深入的研究一下CSS的细节问题,这些问题的涉及将会使我们的工作更加完善. *************注释************ 1.CSS也是需要注释的,注释中的内容不会被解释执行,它也和C语言一样,用/*开头,用*/结尾,其中的内容会被当做注释,我们想怎么写就怎么写. 2.下面给个例子: p{ color: green; /* 我们在这里书写注释 * 辛星CSS,与博客园共同成长 */ font-size:…

2014年度辛星css教程夏季版第一节

CSS是Cascading Style Sheets的缩写,即层叠样式表,它用于表现HTML的样式,即HTML只是去写该网页有哪些内容,至于如何去表现它们,由CSS去定制. *************时代的呼唤************* 1.在之前,我们直接把网页的格式写到HTML中去,这样会造成格式的混乱,而且难以阅读和修改,不过这不是最大的问题,最大的问题在于我们想给网页换一个表达样式的时候,需要修改的地方不仅很多关键是非常零散,需要花费很大的力气去定位这些样式. 2.于是,把网页内容与其表…

零积分下载，2014年辛星mysql教程秋季版第一本已经完工，期待您的支持

经过一段时间的不懈努力.终于,2014年辛星mysql教程秋季版的第一本,即夯实基础已经完工,在csdn的下载地址为:去下载地址 ,假设左边地址跪了,能够去http://download.csdn.net/detail/xinguimeng/7798413 去下载,能够把该url输入到浏览器中,然后回车就可以.在百度网盘的下载地址为:去网盘共享,假设左边的地址跪了,能够去: http://pan.baidu.com/s/1gd1QdRt 去下载,能够把该url输入到浏览器中訪问. 希望对您有…

2014年辛星完全解读Javascript第一节

***************概述*************** 1.Javascript是一种原型化继承的基于对象的动态类型的脚本语言,它区分大小写,主要运行在客户端,用户即使响应用户的操作并进行数据的解析和传递. 2.Javascript和Java并没有太多的关系,只是名字重复了四个字母. 3.Javascript的主要功能是进行数据验证.提供网页特效,动态响应用户的操作,我们提到Javascript也通常会提到jQuery和Ajax. ************Javascript的历史**…

2014年辛星完全解读Javascript第七节数组和对象

由于Javascript是脚本语言,因此,使用起来非常方便,数组的使用也是比较简单的,下面我们就主要介绍一下Javascript中数组的介绍,以及上一节中没有完成的对象的介绍. **************数组************** 1.在Javascript中,声明一个数组太简单了,而且它支持三种方式,第一种方式是直接实例化一个Array,然后用下标的形式去添加,但是它不像PHP那样灵活,它不允许不写下标就向里面添加数据,因此,我们指定下标即可. 2.访问数组的成员就向C语言的数组那样访…

2014年辛星完全解读Javascript第八节 json

json是JavaScript Object Notation的简写,它是一种轻量级的数据交换格式,而且表达上很容易靠字面去理解.json是用于存储和传输数据的格式,通常用于向服务器端传递数据. *************JSON************** 1.我们上一节介绍了对象,这一节我们将介绍json,json既然是一种数据的传输方式,那么它也必然会有自己的语法规则,它的语法规则如下:由大括号保存对象,由方括号保存数组,数据以键值对的方式存储,而且多个数据之间需要用逗号分开. 2.比如下…

2014年辛星完全解读Javascript第六节对象

随着面向对象的普及,现在很多语言都在支持面向对象,Javascript也不例外,所谓对象,就是拥有属性和方法的数据.这里的属性其实就是变量,这里的方法,其实就是函数.但是Javascript的面向对象和其他编程语言还是有很大区别的. ************对象************* 1.Javascript中的对象的定义“属性的无序集合,每个属性存放一个初始值.函数或者对象”,也就是说,对象是没有额定顺序的值的数组. 2.Javascript中的对象一般可以分为本地对象.内置对象.宿主对象…

2014年辛星完全解读Javascript第五节 break和continue与错误处理

先说一下break和continue的主要用法吧,break用于跳出循环,continue用于跳过该循环中的一个迭代.简单的说,就是break直接从该语句跳出,但是continue不会跳出该循环语句,但是它会重新来过,即本次不会再次执行. ************具体说明************* 1.我们通过举例的形式来说明,首先看代码一: var sum = 0; for(i = 0;i<10;i++){ if(i==5){ break; } sum += i; } alert(sum);…

2014年辛星完全解读Javascript第四节流程控制语句

上一节我们介绍了函数,本小节我们介绍一下流程控制语句,对于任何一门编程语言来说,流程控制都是非常重要的,也就是我们常说的顺序结构.选择结构和循环结构. ************选择结构*************** 1.Javascript中用条件语句来实现选择结构,它提供的选择结构主要是if语句.if....else语句和if...else if ...else语句,还有一个switch语句,和PHP很像. 2.这些语句都比较基础,因此我们这里只给出if...else if..else的形式的…

2014年辛星完全解读Javascript第三节

经过第一节的入门和第二节的运算符,那么接下来我们就可以学习Javascript的函数了,当然了,不管大家之前学习的是什么编程语言,都会有函数的概念,如果大家学的是Pascal,还会有”过程“的概念,但是js中没有那么复杂. ************函数*********** 1.所谓函数,就是一些代码的集合,我们用一种形式把它封装起来,当做一个整体,就有了函数的概念. 2.在js中,我们首先使用关键词funtion来声明一个函数,然后紧跟的就是函数名,然后是一个小括号,括号内可以写一些参数,然后…

2014年辛星完全解读Javascript第二节

本小节我们讲解一下Javascript的语法,虽然js语言非常简单,它的语法也相对好学一些,但是不学总之还是不会的,因此,我们来一探究竟把. ********注释************* 1.我们通常用注释来标记一些代码,它会使得我们更好理解我们之前写过的程序代码,这些注释不会被解释执行,但是它是非常有用的. 2.Javascript支持以C++风格的//开头的单行注释,即两个斜线之后的部分直到这一行的结束,都会被当做注释来对待,它们是不会被计算机解释执行的. 3.Javascript还支持C…

2014年辛星Javascript解读第二节

本小节我们解说一下Javascript的语法,尽管js语言很easy,它的语法也相对好学一些,可是不学总之还是不会的,因此,我们来一探到底把. ********凝视************* 1.我们通经常使用凝视来标记一些代码,它会使得我们更好理解我们之前写过的程序代码,这些凝视不会被解释运行,可是它是很实用的. 2.Javascript支持以C++风格的//开头的单行凝视,即两个斜线之后的部分直到这一行的结束,都会被当做凝视来对待,它们是不会被计算机解释运行的. 3.Javascript还支…

2014年辛星Javascript解读第四节流程控制语句

上一节我们介绍了函数,本小节我们介绍一下流程控制语句,对于不论什么一门编程语言来说,流程控制都是很重要的,也就是我们常说的顺序结构.选择结构和循环结构. ************选择结构*************** 1.Javascript中用条件语句来实现选择结构,它提供的选择结构主要是if语句.if....else语句和if...else if ...else语句,另一个switch语句,和PHP非常像. 2.这些语句都比較基础,因此我们这里仅仅给出if...else if..else的形…

2014年辛星Javascript解读第三节

经过第一节的入门和第二节的运算符.那么接下来我们就能够学习Javascript的函数了,当然了.无论大家之前学习的是什么编程语言.都会有函数的概念,假设大家学的是Pascal,还会有"过程"的概念,可是js中没有那么复杂. ************函数*********** 1.所谓函数.就是一些代码的集合,我们用一种形式把它封装起来,当做一个总体.就有了函数的概念. 2.在js中,我们首先使用关键词funtion来声明一个函数,然后紧跟的就是函数名,然后是一个小括号,括号内能够写一些…

2014在辛星Javascript口译科

***************概要*************** 1.Javascript是一种原型化继承的基于对象的动态类型的脚本语言,它区分大写和小写.主要执行在client,用户即使响应用户的操作并进行数据的解析和传递. 2.Javascript和Java并没有太多的关系.仅仅是名字反复了四个字母. 3.Javascript的主要功能是进行数据验证.提供网页特效,动态响应用户的操作,我们提到Javascript也一般会提到jQuery和Ajax. ************Javascrip…

2014年辛星全然解读html第八节

经过前面七节的学习,我感觉大家的HTML的功底也差点儿相同了,并且我特别的删去了某些东西,比方框架,假设回到几年前,那么框架是很流行的,可是如今都到了2014年了,这些东西早就该被遗忘了,因此,我果断的把这些我感觉过时的东西所有扔掉. 而HTML5的话,本教程还是没有涉及,我觉得如今学习HTML5已经能够了,毕竟HTML5的教程也有一些人出了,可是本教程不涉及,并非我不建议大家学.不建议大家用,仅仅是本教程没有提及而已. 还有些东西,比方样式的设置,比方标签的id和name什么的,凡是我觉得能够…

【2014年辛星解读Javascript之用DOM动态操纵HTML元�】的更多相关文章