javascript
1,什么是javascript
最早由网景公司开发的一种脚本语言,由浏览器解释执行。其作用是:
1,操纵html(修改html元素的属性,增加或删除html标记,修改样式)
2,获得浏览器的信息
3,发送异步请求
2,javascript的特点
1,基于对象的语言
2,弱类型语言
3,大小写敏感
4,在浏览器端执行,也可以在web服务器端执行
5,文件后缀为 .js
3,js的语言基础
1,数据类型
1,基本类型 number string boolean null undefined
2,复合类型 函数,数组,对象
js的事件处理机制及dom模型
=======================================================================
一,dom 模型
1,什么是dom?
dom:Document object model:文档对象模型
作用是:将结构化的文档(XML,HTML) 转变为一棵对应的树.
结构化的文档不利于对节点进行增删改查操作,如果将其转变为内存当中的一系列对象,
程序通过对象的操作,
来间接实现对文档的操作,这样更方便,效率更高。
也可以将这棵树输出为一个结构化的文档
2,浏览器如何处理html文档
浏览器会依据dom模型(w3c dom),将html文件读取到内存以后,会转变成一棵dom树。
可以通过js等语言来
操作dom树。
3,w3c dom 的结构
1,节点类型(了解)
2,如何访问节点
A, 依据Id查找 document.getElementById();
B,遍历(了解)
<ul id="u1">
<li>...
<li>...
</ul>
var obj=document.getElementById("u1");
obj.getElementsByTagName("li"):依据标记名查找,返回一个数组
C,一些html元素的特殊的访问方式:
3,创建一个节点
document.createElement(tagName);//创建一个html节点,相当于创建了一个标记
document.createTextNode(tagName);//创建一个文本节点(标记之间的文本)
比如创建一个div
var div1=document.createElement("div");
var txt1=document.createTextNode("hello");
4,添加节点
appendChild(newNode):将新节点添加到当前节点的所有孩子节点的末尾。
insertBefore(newNode,refNode);
replaceChild(newNode,refNode);
二,案例
1,数据验证
在html中,有两个标记
<form>,<a href="">
的默认行为可以通过js改变
对于form:
点击submit,浏览器会提交表单中的数据
改变:
<form onsubmit="return false;">
对于a href:
点击链接,浏览器会转向href指向的地址
改变:
<a href="abc.html" false;">test</a>,此时,链接不会转向对应的地址