DOM编程
》1.js重要的作用就是可以让用户可以与网页元素进行交互操作-->JS精华之所在

》2.DOM编程也是ajax的基础

》3.DOM(文档对象模型),是HTML与XML的应用编程接口(API),DOM将整个页面映射为一个由层次节点组成的文件。

》4.dom对象层次图
window
|
|___event
|_____________document
|_____document |______body
|_____location |______styleSheet
|_____history |
|_____navigator |
|_____screen |______images
|______links
|______froms
|______all
|______frames

》5.confirm()
setInterval("表达式",时间):方法可按照指定的周期(以毫秒计)来调用函数或计算表达式

》6.History:即该对象包含客户端访问过的URL信息

》7.Loaction:

》8.screen

》9.event
------------------------------------------------------------------------------------------------------------------
<!DOCTYPE html PUBLIC '-//W3C//DTD HTML 4.01 Strict//EN' 'http://www.w3.org/TR/html4/strict.dtd'>
<html>
<head>
<meta http-equiv='Content-Type' content='text/html; charset=UTF-8'>
<title>在此插入标题</title>
<script type="text/javascript">
function test(){
document.write("Hello");
}

</script>

</head>
<body>
<input type="button" id="but1" value="lisnda"/>
<script type="text/javascript">
document.getElementById("but1").onclick=test;
</script>
</body>
</html>
--------------------------------------------------------------------------------------------------------------

》》》》》》》》》》》》》》》》》》》》》Document对象
————————————————————————————————————————————————————————————————
》1.document对象代表整个HTML文档,因此可以访问整个文档中所有的元素(对象)。

》2.document常见函数:
(1).write() 向文档输出文本内容或者JS代码
(2).writeln()向文档输出文本内容或者JS代码,换行输出
(3).open()方法可打开一个新文档,并擦除当前文档的内容。
(4).close()
(5).getElementByID() 方法可返回对拥有指定 ID 的第一个对象的引用。
(6).getElementByName()返回带有指定名称的对象集合。
(7).getElementByTagName()返回带有指定标签名的对象集合。
(8).createElement()
》3.如何利用dom对象动态创建HTML元素
(1)创建元素
var myElement=document.createElement("??")
(2)给元素添加必要的标示信息
myElement.href="http://www.sina.com";
myElement.innerText="连接到新浪";
myElement.left="200px";
myElement.top="300px";
myElement.position="absolut";
//添加到document.body
document.body.appendChild(myElement);

》4.关于dom节点
在Dom中节点类型都包括的特性和方法如下:
特性/方法 类型/返回值 说明
nodeName String 节点的名字,根据节点类型而定义
nodeValue String 节点的值
nodeType Number 节点的类型常量值
onerDocument Document 节点所属文档
firstChild Node 指向节点childNodes列表中的第一个节点
lastChild Node 指向节点childNodes列表中的最后一个节点
childNodes Nodelist 所有节点列表
parentNode 父节点
previousSibling Node 指向前一个兄弟节点
nextSibing Node 指向后一个兄弟节点
hasChildNOdes() boolean 是否包含了一个或者多个子节点
attributes NameNodeMap 包含了代表一个元素特性的attr对象,仅用于Element节点
appendChild(node) Node 将node 节点添加到父节点末尾
removeChild(node) Node 将node从父节点中删除
replaceChild(newnode,oldnode) node 从父节点中用newnode替换了oldnode节点
insertBefore(newnode,oldnode) node 在父节点中在oldnode前添加newnode节点.
上面便是Dom中节点的方法和属性,因为常用,谨记!

》5.在dom编程中,一个html文档会被当做DOM树对待,DOM会把所有的HTML元素映射成Node节点。于是我们就可以使用Node节点(对象)
的属性和节点。

》6.document 的属性与方法
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
2012-04-20 16:07 2546人阅读 评论(0) 收藏 举报
document 文挡对象 - JavaScript脚本语言描述
---------------------------------------------------------------------
注:页面上元素name属性和JavaScript引用的名称必须一致包括大小写
否则会提示你一个错误信息 "引用的元素为空或者不是对象"
---------------------------------------------------------------------

对象属性
document.title //设置文档标题等价于HTML的<title>标签
document.bgColor //设置页面背景色
document.fgColor //设置前景色(文本颜色)
document.linkColor //未点击过的链接颜色
document.alinkColor //激活链接(焦点在此链接上)的颜色
document.vlinkColor //已点击过的链接颜色
document.URL //设置URL属性从而在同一窗口打开另一网页
document.fileCreatedDate //文件建立日期,只读属性
document.fileModifiedDate //文件修改日期,只读属性
document.fileSize //文件大小,只读属性
document.cookie //设置和读出cookie
document.charset //设置字符集 简体中文:gb2312
---------------------------------------------------------------------
对象方法
document.write() //动态向页面写入内容
document.createElement(Tag) //创建一个html标签对象
document.getElementById(ID) //获得指定ID值的对象
document.getElementsByName(Name) //获得指定Name值的对象
---------------------------------------------------------------------

images集合(页面中的图象)

a)通过集合引用
document.images //对应页面上的<img>标签
document.images.length //对应页面上<img>标签的个数
document.images[0] //第1个<img>标签
document.images[i] //第i-1个<img>标签

b)通过nane属性直接引用
<img name="oImage">
document.images.oImage //document.images.name属性

c)引用图片的src属性
document.images.oImage.src //document.images.name属性.src

d)创建一个图象
var oImage
oImage = new Image()
document.images.oImage.src="/1.jpg"
//同时在页面上建立一个<img>标签与之对应就可以显示

<html>
<img name=oImage>
<script language="javascript">
var oImage
oImage = new Image()
document.images.oImage.src="/1.jpg"
</script>
</html>

----------------------------------------------------------------------

forms集合(页面中的表单)

a)通过集合引用
document.forms //对应页面上的<form>标签
document.forms.length //对应页面上<form>标签的个数
document.forms[0] //第1个<form>标签
document.forms[i] //第i-1个<form>标签
document.forms[i].length //第i-1个<form>中的控件数
document.forms[i].elements[j] //第i-1个<form>中第j-1个控件

b)通过标签name属性直接引用
<form name="Myform"><input name="myctrl"></form>
document.Myform.myctrl //document.表单名.控件名
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
》7.body对象
document.body //指定文档主体的开始和结束等价于<body></body>
document.body.bgColor //设置或获取对象后面的背景颜色
document.body.link //未点击过的链接颜色
document.body.alink //激活链接(焦点在此链接上)的颜色
document.body.vlink //已点击过的链接颜色
document.body.text //文本色
*document.body.innerText //设置<body>...</body>之间的文本
*document.body.innerHTML //设置<body>...</body>之间的HTML代码
document.body.topMargin //页面上边距
document.body.leftMargin //页面左边距
document.body.rightMargin //页面右边距
document.body.bottomMargin //页面下边距
document.body.background //背景图片
document.body.appendChild(oTag) //动态生成一个HTML对象
document.body.scroll //为窗口添加滚动条事件其实非常的简单
document.body.onselectstart() //用户选中文文档时候触发

关于Javascript的使用参考的更多相关文章

  1. [转]JavaScript RegExp 对象参考手册

    JavaScript RegExp 对象参考手册 RegExp 对象 RegExp 对象表示正则表达式,它是对字符串执行模式匹配的强大工具. 直接量语法 /pattern/attributes 创建 ...

  2. Javascript传参参考

    可参考的细节: <!doctype html> <html lang="en"> <head> <meta charset="U ...

  3. JavaScript常用事件参考

      onabort 图像加载被中断 onblur 元素失去焦点 onchange 用户改变域的内容 onclick 鼠标点击某个对象 ondblclick 鼠标双击某个对象 onerror 当加载文档 ...

  4. javascript进击(九)参考手册

    完整的 Number 对象参考手册 如需可用于 Number 对象的所有属性和方法的完整参考,请访问我们的 Number 对象参考手册. 该参考手册包含每个属性和方法的描述和实例. 完整的 Strin ...

  5. javascript for循环

    2016年12月28日 20:01:54 星期三 html: <a href="aaaa">AAAA</a> <a href="bbbb&q ...

  6. 最新JavaScript、Ajax典藏级学习资料下载分类汇总 (2011年12月21日更新)

    其他网站开发相关资料            超强HTML和xhtml,CSS精品学习资料下载汇总                                               最新htm ...

  7. Javascript学习笔记2.1 Javascript与DOM简介

    DOM(文档对象模型)简介 DOM(文档对象模型)针对HTML和XML文档的一个API. DOM可以将任何HTML或XML文档描绘成由多层节点构成的树形结构,它是中立于平台和语言的接口,允许程序和脚本 ...

  8. JavaScript中本地对象、内置对象和宿主对象

    链接:http://www.cnblogs.com/luckyXcc/p/5892896.html(Milk.╮的博客园提供) 其中内置对象只有两种:ECMA-262 只定义了两个内置对象,即 Glo ...

  9. JsBridge实现Javascript和Java的互相调用

    前端网页Javascript和Native互相调用在手机应用中越来越常见,JsBridge是最常用的解决方案. 在Android开发中,能实现Javascript与Native代码通信的,有4种途径: ...

随机推荐

  1. monkeyrunner之坐标或控件ID获取方法(六)

    Monkeyrunner的环境已经搭建完成,现在对Monkeyrunner做一个简介. Monkeyrunner工具提供了一套API让用户/测试人员来调用,调用这些api可以控制一个Android设备 ...

  2. NopCommerce 增加 Customer Settings

    预期: 仿照Customer 的 Phone number enabled 和 required 增加MemberType 相关步骤如下: 1.运行站点 Admin -> Settings -& ...

  3. import com.sun.image.codec.jpeg.JPEGCodec不通过 找不到包

    import com.sun.image.codec.jpeg.JPEGCodec;   在Eclipse中处理图片,需要引入两个包: import com.sun.image.codec.jpeg. ...

  4. svm训练显示信息说明

    现简单对屏幕回显信息进行说明: #iter 为迭代次数, nu  与前面的操作参数 -n nu  相同, obj 为 SVM 文件转换为的二次规划求解得到的最小值, rho  为判决函数的常数项 b  ...

  5. Windows 10 装机回忆录

    Frank.Han 标记: Windows,快捷键,安装 2015年10月我便更新了Win10系统,一直用着很顺手,比起Win8.x,他更像Win7的嫡系版本. 屏蔽掉系统自带的平板服务(小娜.地理位 ...

  6. NOIP模拟赛20161022

    NOIP模拟赛2016-10-22 题目名 东风谷早苗 西行寺幽幽子 琪露诺 上白泽慧音 源文件 robot.cpp/c/pas spring.cpp/c/pas iceroad.cpp/c/pas ...

  7. Unity Mono脚本 加密

    加密环境 引擎版本:Unity3D 5.3.4 及更高版本 (使用Mono而并非IL2CPP) 操作系统:CentOS 6.2(Final) 加密环境:Android.IOS(暂定) 加密对象:C#源 ...

  8. RAID级别

    raid磁盘阵列,我们一般使用RAID 5,挂载单独硬盘测试读写速度,一般使用RAID0.

  9. 【笔记4】用pandas实现条目数据格式的推荐算法 (基于用户的协同)

    ''' 基于用户的协同推荐 条目数据 ''' import pandas as pd from io import StringIO import json #数据类型一:条目(用户.商品.打分)(避 ...

  10. IE浏览器中Image对象onload失效的解决办法

    作为WEB设计者,为了在网页展示上加强用户体验,经常会利用图象载入显示状态方法,这自然需要Image对象的onload事件. 在firefox浏览器下完成开发后,可是在IE浏览器中进行调试总不能被调用 ...