读书笔记-javascript dom

来源:互联网 发布:瞻博网络工厂 编辑:程序博客网 时间:2024/05/22 05:10

1、代码是思想和概念的体现。它是你与一门新语言交流的方式,它定下规则,你就要读懂和遵守它的语法规则。理解“如何”和”为什么”
2、缘由:由于Netscape和IE的浏览器之争,各自产生了自己的一套标准,因此程序员需要学习两种不同浏览器的方式,然后w3c出来与大家一起共同制造一套标准
3、DOM目的:理解DOM脚本编程技术背后的思路和原则。利用DOM给文档增加交互能力
4、现在谈论的javascript实际上是ECMAScript
5、DOM是一套对文档的内容进行抽象和概念化的方法。/对象模型–大家对客观存在或抽象的事物有基本的共识(大家大致都知道是什么)/
6、DHTML Dynamic HTML(动态HTML的简称),描述HTML、css、javascript技术组合的术语。DHTML背后的含义是①利用HTML把网页标记为各种元素 ②利用css设置元素样式或它们显示的位置 ③利用js实时操控页面和改变样式
7、API(应用编程接口) ,简单来说就是一组已经得到各方共同认可的基本约定,使人们能够方便交流与合作 (好比英语的规则,你懂的话就便于与其他人交流一样)
8、w3c对DOM定义:一个与系统平台和编程语言无关的接口,程序和脚本可以通过这个接口动态地访问和修改文档的内容、结构和样式。 DOM是一种API
9、script标签放在<body>之后,</body>之前(前面的文档元素加载完),能使浏览器更快加载页面
10、javascript是一门解释性语言,而java等是编译性语言 (编译性语言和解释性语言的区别)
11、对变量的赋值 等价于 变量包含了这个值。 注意:js允许程序员直接对变量赋值而无需事先声明(var)。
字面量可以直接在js代码中写出来的数据
例:

    a=10;    alert(a);  //10    var mood="happy";    //"happy"是字面量

12、变量以及函数的命名是区分大小写的。变量名允许包含数字、字母、美元符号($)和下划线(_)组成,但是不能以数字开头。
13、字符串的转义: 不想所包的字符被当作此字符串的结束标志
例:

var a="i \'m studying"; alert(a);

14、数组到对象的转变:用对象代替传统数组的做法意味着可以通过元素的名字而不是下标数字来引用它们,提高脚本的可读性。
15、函数不仅能够(以参数)接收数据,还能够返回数据
16、变量的作用域分为全局变量和局部变量。全局变量,在脚本的任何位置(包括函数内)都能引用它 ;局部变量,仅限某个特定(特定)的函数内部使用。—->在函数里既可以用全局变量,也可以用局部变量—>容易导致在函数里使用到全局变量—>用var关键字设定作用域
例:

function square(num){   total=num*num;   return total;}var total=50;square(20);alert(total);   //400

17、对象是由一些属性和方法组合在一起构成的一个数据实体
对象的创建

var p1=new Person();p1.name="maomao";p1.age=10;p1.say=function(){alert("hello");}或者var p1={"name":"maomao","age"=10};对象的访问alert(p1.name);  //maomaop1.say();     //hello

实例是对象的具体个体 如:我是人 我是实体,人是对象
18、对象分为
自定义对象:程序员自行创建
內建对象:由js提供预定义好的对象。如:Date对象、Math对象
宿主对象:由浏览器提供预定义好的对象。如:Form对象、Image对象
19、DOM 文档对象模型
window对象对应浏览器窗口本身,该对象的属性和方法通常称为BOM浏览器对象模型
DOM把一份文档表示为一颗节点树(模型model或者地图map),代表家族(节点)成员间的关系。其中html标签作为根元素,代表整个文档
节点的类型:元素节点、文本节点、属性节点等
20、三种DOM方法获取元素节点:
document.getElementById() 返回的是一个对象 {}
document.getElementsByTagName() 返回的是一个对象数组 [{},{}]
document.getElementsByClassName() 返回的是一个对象数组 [{},{}]

var aLi=document.getElementByTagName("li");for(var i=0;i<aLi.length;i++){    alert(typeof aLi[i]);     //object   证明上面返回的是由对象组成的数组}
//获取ul1下的livar oUl=document.getElementById("ul1");var aLi=oUl.getElementByTagName("li");alert(aLi.length);

21、设置属性和获取属性
元素节点对象.getAttribute(“属性名”);
元素节点对象.setAttribute(“属性名”,属性值);
通过setAttribute对属性作出修改后,再通过源代码看到还是修改前的属性。
说明DOM的工作模式:先加载文档的静态内容,再动态刷新,动态刷新不影响文档的静态内容。(即对页面内容进行刷新却不需要在浏览器里刷新页面)
22、如何阻止标签的默认行为被调用?
事件处理函数的工作机制:在给某元素添加事件后,会调用相应的javascript代码,然后将函数的返回值返回给所相应的事件。当返回的是布尔值false,则不会触发该事件的默认行为。
如:

<a href="http://www.baidu.com"  onclick="return false;">链接到百度</a>
原创粉丝点击