关于Javascript的使用参考
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的使用参考的更多相关文章
- [转]JavaScript RegExp 对象参考手册
JavaScript RegExp 对象参考手册 RegExp 对象 RegExp 对象表示正则表达式,它是对字符串执行模式匹配的强大工具. 直接量语法 /pattern/attributes 创建 ...
- Javascript传参参考
可参考的细节: <!doctype html> <html lang="en"> <head> <meta charset="U ...
- JavaScript常用事件参考
onabort 图像加载被中断 onblur 元素失去焦点 onchange 用户改变域的内容 onclick 鼠标点击某个对象 ondblclick 鼠标双击某个对象 onerror 当加载文档 ...
- javascript进击(九)参考手册
完整的 Number 对象参考手册 如需可用于 Number 对象的所有属性和方法的完整参考,请访问我们的 Number 对象参考手册. 该参考手册包含每个属性和方法的描述和实例. 完整的 Strin ...
- javascript for循环
2016年12月28日 20:01:54 星期三 html: <a href="aaaa">AAAA</a> <a href="bbbb&q ...
- 最新JavaScript、Ajax典藏级学习资料下载分类汇总 (2011年12月21日更新)
其他网站开发相关资料 超强HTML和xhtml,CSS精品学习资料下载汇总 最新htm ...
- Javascript学习笔记2.1 Javascript与DOM简介
DOM(文档对象模型)简介 DOM(文档对象模型)针对HTML和XML文档的一个API. DOM可以将任何HTML或XML文档描绘成由多层节点构成的树形结构,它是中立于平台和语言的接口,允许程序和脚本 ...
- JavaScript中本地对象、内置对象和宿主对象
链接:http://www.cnblogs.com/luckyXcc/p/5892896.html(Milk.╮的博客园提供) 其中内置对象只有两种:ECMA-262 只定义了两个内置对象,即 Glo ...
- JsBridge实现Javascript和Java的互相调用
前端网页Javascript和Native互相调用在手机应用中越来越常见,JsBridge是最常用的解决方案. 在Android开发中,能实现Javascript与Native代码通信的,有4种途径: ...
随机推荐
- Neutron 理解 (8): Neutron 是如何实现虚机防火墙的 [How Neutron Implements Security Group]
学习 Neutron 系列文章: (1)Neutron 所实现的虚拟化网络 (2)Neutron OpenvSwitch + VLAN 虚拟网络 (3)Neutron OpenvSwitch + GR ...
- [C#] 逆袭——自制日刷千题的AC自动机攻克HDU OJ
前言 做过杭电.浙大或是北大等ACM题库的人一定对“刷题”不陌生,以杭电OJ为例:首先打开首页(http://acm.hdu.edu.cn/),然后登陆,接着找到“Online Exercise”下的 ...
- 【2016-11-5】【坚持学习】【Day20】【Linq where in 语句】
今天用到一个where in LINQ 语句 IEnumerable<Line> lines = wf.Lines.Where(n => n.RightNode == formR ...
- 三种方法查看MySQL数据库的版本
1.使用-V参数 首先我们想到的肯定就是查看版本号的参数命令,参数为-V(大写字母)或者--version 使用方法: D:\xampp\mysql\bin>mysql -V 或者 D:\xam ...
- [No000084]C# 使用Log4Net(1)-快速建立一个demo
1.下载Log4Net: http://logging.apache.org/log4net/download_log4net.cgi 2.新建一个WinForm程序,取名Log4NetDemo 3. ...
- MVC 问答
1.View含有什么,默认就念有Models吗? 不是,ViewBag是一个空对象.ViewBag 与 Models 不是必须一起使用的 . 2.Models 可用可不用?存在意义?
- Fullscreen API 全屏显示网页
可参考文档:http://blog.csdn.net/tywali/article/details/8623938 脚本代码 <script type="text/javascript ...
- 设计模式——抽象工厂(Abstract Factory)
Abstract Factory 抽象工厂模式(创建型模式): new的问题:实现依赖,不能应变应对“具体实例化类型”的变化. 解决思路:--封装变化点:哪里变化,封装哪里 - - ...
- 读书笔记---《火球:UML大战需求分析》
书评 作为一本UML和需求分析的入门书来说还算可以,写的比较接地气,如果是做过很多项目的读者,很容易找到共鸣点. 美中不足:部分概念可能有错误,其中对于Component和Artifact的解释明显和 ...
- java画图之曲线拖动
目标:在窗体上按下鼠标按键.然后拖动鼠标,在按下和拖动之间绘制曲线 事件机制 事件源对象:窗体 事件监听方法:addMouseListener(MouseListener l);addMouseMot ...