javascript 的Document属性和方法集合


Posted in Javascript onJanuary 25, 2010

document.title //设置文档标题等价于HTML的title标签
document.bgColor //设置页面背景色
document.fgColor //设置前景色(文本颜色)
document.linkColor //未点击过的链接颜色
document.alinkColor //激活链接(焦点在此链接上)的颜色
document.vlinkColor //已点击过的链接颜色
document.URL //设置URL属性从而在同一窗口打开另一网页
document.fileCreatedDate //文件建立日期,只读属性
document.fileModifiedDate //文件修改日期,只读属性
document.charset //设置字符集 简体中文:gb2312
document.fileSize //文件大小,只读属性
document.cookie //设置和读出cookie

———————————————————————
常用对象方法

document.write() //动态向页面写入内容
document.createElement(Tag) //创建一个html标签对象
document.getElementById(ID) //获得指定ID值的对象
document.getElementsByName(Name) //获得指定Name值的对象
document.body.appendChild(oTag)
———————————————————————

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.onclick=”func()” //鼠标指针单击对象是触发
document.body.onmouseover=”func()” //鼠标指针移到对象时触发
document.body.onmouseout=”func()” //鼠标指针移出对象时触发
———————————————————————
location-位置子对象

document.location.hash // #号后的部分
document.location.host // 域名+端口号//好像返回的是主机名localhost,没有返回端口号
document.location.hostname // 域名
document.location.href // 完整URL
document.location.pathname // 目录部分
document.location.port // 端口号
document.location.protocol // 网络协议(http:)
document.location.search // ?号后的部分
documeny.location.reload() //刷新网页
document.location.reload(URL) //打开新的网页
document.location.assign(URL) //打开新的网页
document.location.replace(URL) //打开新的网页
———————————————————————
selection-选区子对象
document.selection

例如:

<div>请选中这里的部分文字。</div>
<div><input type="button" value="请选中部分文字,然后点击这里执行 empty" onclick="javascript:Foo();" /></div>
<script type="text/javascript" language="javascript">
<!--
function Foo()
{
document.selection.empty();
}
-->
</script>

selection的createRange方法

document.selection.createRange() 根据当前文字选择返回 TextRange 对象,或根据控件选择返回 ControlRange 对象。

配合 execCommand,在 HTML 编辑器中很有用,比如:文字加粗、斜体、复制、粘贴、创建超链接等。

这些好像都是只有在IE下才能实现。。

———————————————————————

images集合(页面中的图象)

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

b)通过name属性直接引用
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 /标签与之对应就可以显示

———————————————————————-

forms集合(页面中的表单)

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

b)通过标签name属性直接引用
/formform name=”Myform”>input name=”myctrl”/>/form
document.Myform.myctrl //document.表单名.控件名

c)访问表单的属性
document.forms[i].name //对应form name>属性
document.forms[i].action //对应/formform action>属性
document.forms[i].encoding //对应/formform enctype>属性
document.forms[i].target //对应/formform target>属性

document.forms[i].appendChild(oTag) //动态插入一个控件
document.all.oDiv //引用图层oDiv
document.all.oDiv.style.display=”" //图层设置为可视
document.all.oDiv.style.display=”none” //图层设置为隐藏
document.getElementId(”oDiv”) //通过getElementId引用对象
document.getElementId(”oDiv”).style=”"
document.getElementId(”oDiv”).display=”none”
/*document.all表示document中所有对象的集合
只有ie支持此属性,因此也用来判断浏览器的种类*/

图层对象的4个属性
document.getElementById(”ID”).innerText //动态输出文本
document.getElementById(”ID”).innerHTML //动态输出HTML
document.getElementById(”ID”).outerText //同innerText
document.getElementById(”ID”).outerHTML //同innerHTML

Javascript 相关文章推荐
二级域名转向类
Nov 09 Javascript
读jQuery之四(优雅的迭代)
Jun 20 Javascript
javascript跑马灯悬停放大效果实现代码
Dec 12 Javascript
分享33个jQuery与CSS3实现的绚丽鼠标悬停效果
Dec 15 Javascript
jQuery制作效果超棒的手风琴折叠菜单
Apr 03 Javascript
简述JavaScript对传统文档对象模型的支持
Jun 16 Javascript
jquery背景跟随鼠标滑动导航
Nov 20 Javascript
js时间控件只显示年月
Jan 08 Javascript
jQuery插件HighCharts绘制简单2D折线图效果示例【附demo源码】
Mar 21 jQuery
Javascript中JSON数据分组优化实践及JS操作JSON总结
Dec 22 Javascript
vue-cli 引入jQuery,Bootstrap,popper的方法
Sep 03 jQuery
node使用request请求的方法
Dec 20 Javascript
起点页面传值js,有空研究学习下
Jan 25 #Javascript
js 巧妙去除数组中的重复项
Jan 25 #Javascript
将函数的实际参数转换成数组的方法
Jan 25 #Javascript
javascript中利用数组实现的循环队列代码
Jan 24 #Javascript
document.getElementById为空或不是对象的解决方法
Jan 24 #Javascript
JavaScript 未结束的字符串常量常见解决方法
Jan 24 #Javascript
php gethostbyname获取域名ip地址函数详解
Jan 24 #Javascript
You might like
PHP开发框架总结收藏
2008/04/24 PHP
浅析php中如何在有限的内存中读取大文件
2013/07/02 PHP
codeigniter中测试通过的分页类示例
2014/04/17 PHP
Yii2如何批量添加数据
2016/05/17 PHP
谈谈php对接芝麻信用踩的坑
2016/12/01 PHP
PHP实现的注册,登录及查询用户资料功能API接口示例
2017/06/06 PHP
几款极品的javascript压缩混淆工具
2007/05/16 Javascript
AngularJS ng-app 指令实例详解
2016/07/30 Javascript
React进阶学习之组件的解耦之道
2017/08/07 Javascript
JavaScript解决浮点数计算不准确问题的方法分析
2018/07/09 Javascript
jQuery实现的导航条点击后高亮显示功能示例
2019/03/04 jQuery
JavaScript Array对象使用方法解析
2019/09/24 Javascript
Vue Router 实现动态路由和常见问题及解决方法
2020/03/06 Javascript
VUE table表格动态添加一列数据,新增的这些数据不可以编辑(v-model绑定的数据不能实时更新)
2020/04/03 Javascript
微信小程序实现首页弹出广告
2020/12/03 Javascript
Python之日期与时间处理模块(date和datetime)
2017/02/16 Python
Python3一行代码实现图片文字识别的示例
2018/01/15 Python
python实现的MySQL增删改查操作实例小结
2018/12/19 Python
PyQt打开保存对话框的方法和使用详解
2019/02/27 Python
浅析Windows 嵌入python解释器的过程
2019/07/26 Python
python实现对图片进行旋转,放缩,裁剪的功能
2019/08/07 Python
python给指定csv表格中的联系人群发邮件(带附件的邮件)
2019/12/31 Python
将keras的h5模型转换为tensorflow的pb模型操作
2020/05/25 Python
使用python求斐波那契数列中第n个数的值示例代码
2020/07/26 Python
HTML5自定义data-* data(obj)属性和jquery的data()方法的使用
2012/12/13 HTML / CSS
微信浏览器取消缓存的方法
2015/03/28 HTML / CSS
HTML5中使用json对象的实例代码
2018/09/10 HTML / CSS
德国BA保镖药房韩文网:kr.ba.de
2017/09/04 全球购物
俄罗斯最大的在线手表商店:Bestwatch.ru
2020/01/11 全球购物
澳大利亚在线批发商:Simply Wholesale
2021/02/24 全球购物
C++:局部变量能否和全局变量重名
2014/03/03 面试题
什么是虚拟内存?虚拟内存有什么优势?
2012/02/19 面试题
经济系大学生求职信
2013/10/01 职场文书
庆祝教师节活动方案
2014/01/31 职场文书
党支部承诺书范文
2014/03/28 职场文书
六一文艺汇演开幕词
2015/01/29 职场文书