码迷,mamicode.com
首页 > 编程语言 > 详细

JavaScript讲义(三)

时间:2016-11-01 01:36:04      阅读:195      评论:0      收藏:0      [点我收藏+]

标签:访问   修改   open   节点   ntp   使用   利用   option   creat   

DOM:拥有用JS脚本动态修改HTML

DOM模型
---------------------------------------------------------
HTML文档只有一个根节点,其他都是子节点,最终形成一个结构化文档。DOM提供了访问结构化文档的一种方式,但DOM不是一种技术,它只是访问结构化文档的一种思想。基于这种思想,各种语言都有自己的DOM解析器。

DOM模型和HTML文档
---------------------------------------------------------
虽然JS不是一门纯粹的面向对象语言,但是DOM为常用HTML元素找到了一套完整的继承体系。
HTML元素之间常见的包含关系。有些HTML元素之间可以互相嵌套,有些不可。

访问HTML元素
---------------------------------------------------------
两种方式:根据ID访问HTML元素(document.getElementById()),利用节点关系访问HTML元素(利用父子,兄弟关系来访问)

访问表单控件
访问列表框、下拉菜单的选项

修改HTML元素
---------------------------------------------------------
修改节点(内容,属性,CSS样式)。修改HTML元素通常通过修改如下几个常用属性:
innerHTML: 如xx.innerHTML=document.getElementById("celVal").value;
value:
className:
style:
options[index]:

增加HTML元素
---------------------------------------------------------
两步:1)创建/复制节点;2)添加节点
var a=document.createElement("divxxx");
var ajax=ul.firstChild.nextSibling.cloneNode(false)
ul.insertBefore(ajax,ul.firstChild);

动态添加表格内容

删除HTML元素
---------------------------------------------------------
删除节点:removeChild

传统DHTML模型
---------------------------------------------------------
通过DOM不仅能访问和更新页面内容及结构,还能操纵文档的风格样式。在DOM出现前,JS采用传统DHTML模型访问和更新HTML页面。相比DHTML,DOM功能更强大,提供了对整个HTML文档的访问模型,其将文档转换为Tree结构,树上每个节点对应HTML元素。

使用window对象
---------------------------------------------------------
window对象是整个JS脚本运行的顶层对象。
访问历史:history属性。
访问页面URL:
客户机屏幕信息:screen属性
弹出新窗口:window.open()
用定时器:
navigator和地理位置:比如
for(var propname in window.navigator)
{
window.navigator[propname];
}
HTML5新增的geolocation属性:getCurrentPosition,watchCurrentPosition

使用document对象
---------------------------------------------------------
document对象既是HTMLDocument类的一个实例,也是DHTML模型中的一个对象。

JavaScript讲义(三)

标签:访问   修改   open   节点   ntp   使用   利用   option   creat   

原文地址:http://www.cnblogs.com/jinji/p/6018020.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!