day04_DOM&xml

1. BOM

BOM ==> Browser Object Model ==> 浏览器对象模型 ==> 控制浏览器的一些行为

window对象 ==> 代表一个HTML文档

1.1 属性:

页面导航的5个属性

selfparenttopopenerframes

方法:

    弹出对话框.3个:alert confirm prompt    页面定时器. setInterval clearInterval setTimeout clearTimeout    窗口打开关闭. open  close

1.2 History

History ==> 浏览器的历史记录 ==> 前进,后退.
属性: length
方法:

forward 前进back 后退go   前进/后退

1.3 Location

Location ==> 浏览器地址栏 ==> 跳转,刷新

属性:    href => 改变当前页面位置方法:    reload => 刷新 

2.DOM

DOM ==> Document Object Model ==> 文档对象模型 ==> 让JS 和 HTML ,css结合.可以使用JS来控制他们.

原理: 将页面中所有内容,都封装成了对象.

2.1 Dom中的五类对象:

    Document 文档(重点)    Element  元素(重点)    Attribute 属性    Text 文本    Commons 注释

以上五类对象抽取了一个父类:

    Node         自身属性:            nodeType            nodeName            nodeValue        导航属性:            父找儿: firstChild lastChild childNodes            儿找父: parentNode (重要)            找兄弟: nextSibling priviousSibling

2.2 获取Element的方式(重点):

    从Document中获得ELement:        1.getElementById        2.getElementsByTagName        3.getElementsByClassName        4.getElementsByName    从Element中获得ELement:        1.getElementsByTagName        2.getElementsByClassName

2.3 DOM中的事件

给Element对象添加一个FUnction类型的属性.那么这个Function的运行时机与属性的名称有关.例如:

属性名     触发时机onClick     单击ondblclick  双击onload      当加载完毕onchange    当内容改变onblur      当失去焦点onfocus     当得到焦点

在事件中我们想要获得事件的详情,那么我们需要拿到Event(侦探)对象.

获得:
事件函数是由浏览器在对应时机调用的,浏览器在调用的时候,已经Event传给我们了.对于我们来讲.接受下就可以了.

属性:

keyCode  :  按键的编码button   :  鼠标按键的编码clientX/clientX : 鼠标所在位置的x y轴坐标

方法:

preventDefault : 阻止默认行为. 例如 :在点击submit按钮时,表单提交就是默认动作.stopPropergation : 停止事件的继续传播. 例如: 在嵌套的DIV中,点击里面的div ,同时也会触发外层div的onclick事件.如果不想触发外层使用该方法.

2.4 Dom中常见操作

增    创建元素:  document.createElement    添加: element.appendChild => 添加到末尾          element.insertBefore => 指定添加位置删    removeAttribute 删除属性    removeChild  删除子节点改    replaceChild 改元素    setAttribute 改属性查         getAttribute 查属性值        getElementById        getElementsByTagName        getElementsByClassName        getElementsByName

3.DHTML技术

3.1简介

由微软提出, Dynamic HTML 动态网页技术. 整合了 HTML CSS Javascript DOM 4个技术.可以理解为对DOM对象的增强: 增加了一些新的属性和方法.让我们开发更加便捷.例如:     一个元素的class属性,我们想改变,我们使用setAttribute("class","类名")可以.但是DHTML提供了更方便的操作,className属性.

3.2 frameSet间通信.

3.3 事件