欢迎来到福编程网,本站提供各种互联网专业知识!

超清晰的document对象详解

发布时间:2007-02-27 作者: 来源:转载
document文挡对象-JavaScript脚本语言描述---------------------------------------------------------------------注:页面上元素name属性和JavaScript引用的名称必须一致包括大小写否则会提示你一个错误信息"引用的元素为空或者不是对象"-----------------
document文挡对象-JavaScript脚本语言描述
---------------------------------------------------------------------
注:页面上元素name属性和JavaScript引用的名称必须一致包括大小写
否则会提示你一个错误信息"引用的元素为空或者不是对象"
---------------------------------------------------------------------

对象属性
document.title//设置文档标题等价于HTML的标签 <BR>document.bgColor//设置页面背景色 <BR>document.fgColor//设置前景色(文本颜色) <BR>document.linkColor//未点击过的链接颜色 <BR>document.alinkColor//激活链接(焦点在此链接上)的颜色 <BR>document.vlinkColor//已点击过的链接颜色 <BR>document.URL//设置URL属性从而在同一窗口打开另一网页 <BR>document.fileCreatedDate//文件建立日期,只读属性 <BR>document.fileModifiedDate//文件修改日期,只读属性 <BR>document.fileSize//文件大小,只读属性 <BR>document.cookie//设置和读出cookie <BR>document.charset//设置字符集简体中文:gb2312 <BR>--------------------------------------------------------------------- <BR>对象方法 <BR>document.write()//动态向页面写入内容 <BR>document.createElement(Tag)//创建一个html标签对象 <BR>document.getElementById(ID)//获得指定ID值的对象 <BR>document.getElementsByName(Name)//获得指定Name值的对象 <BR>--------------------------------------------------------------------- </p><p></p><p>images集合(页面中的图象) </p><p></p><p>a)通过集合引用 <BR>document.images//对应页面上的<img>标签 <BR>document.images.length//对应页面上<img>标签的个数 <BR>document.images[0]//第1个<img>标签 <BR>document.images[i]//第i-1个<img>标签 </p><p></p><p>b)通过nane属性直接引用 <BR><imgname="oImage"> <BR>document.images.oImage//document.images.name属性 </p><p></p><p>c)引用图片的src属性 <BR>document.images.oImage.src//document.images.name属性.src </p><p></p><p>d)创建一个图象 <BR>varoImage <BR>oImage=newImage() <BR>document.images.oImage.src="/1.jpg" <BR>同时在页面上建立一个<img>标签与之对应就可以显示 </p><p></p><p><html> <BR><imgname=oImage> <BR><scriptlanguage="javascript"> <BR>varoImage <BR>oImage=newImage() <BR>document.images.oImage.src="/1.jpg" <BR></script> <BR></html> </p><p></p><p>---------------------------------------------------------------------- </p><p></p><p>forms集合(页面中的表单) </p><p></p><p>a)通过集合引用 <BR>document.forms//对应页面上的<form>标签 <BR>document.forms.length//对应页面上<form>标签的个数 <BR>document.forms[0]//第1个<form>标签 <BR>document.forms[i]//第i-1个<form>标签 <BR>document.forms[i].length//第i-1个<form>中的控件数 <BR>document.forms[i].elements[j]//第i-1个<form>中第j-1个控件 </p><p></p><p>b)通过标签name属性直接引用 <BR><formname="Myform"><inputname="myctrl"></form> <BR>document.Myform.myctrl//document.表单名.控件名 </p><p></p><p>----------------------------------------------------------------------- <BR><html> <BR><!--Text控件相关Script--> <BR><formname="Myform"> <BR><inputtype="text"name="oText"> <BR><inputtype="password"name="oPswd"> <BR><form> <BR><scriptlanguage="javascript"> <BR>//获取文本密码框的值 <BR>document.write(document.Myform.oText.value) <BR>document.write(document.Myform.oPswd.value) <BR></script> <BR></html> <BR>----------------------------------------------------------------------- <BR><html> <BR><!--Select控件相关Script--> <BR><formname="Myform"> <BR><selectname="oSelect"> <BR><optionvalue="1">1</option> <BR><optionvalue="2">2</option> <BR><optionvalue="3">3</option> <BR></select> <BR></form> </p><p></p><p><scriptlanguage="javascript"> <BR>//遍历select控件的option项 <BR>varlength <BR>length=document.Myform.oSelect.length <BR>for(i=0;i<length;i++) <BR>document.write(document.Myform.oSelect[i].value) <BR></script> </p><p></p><p><scriptlanguage="javascript"> <BR>//遍历option项并且判断某个option是否被选中 <BR>for(i=0;i<document.Myform.oSelect.length;i++){ <BR>if(document.Myform.oSelect[i].selected!=true) <BR>document.write(document.Myform.oSelect[i].value) <BR>else <BR>document.write("<fontcolor=red>"+document.Myform.oSelect[i].value+"</font>") <BR>} <BR></script> </p><p></p><p><scriptlanguage="javascript"> <BR>//根据SelectedIndex打印出选中的option <BR>//(0到document.Myform.oSelect.length-1) <BR>i=document.Myform.oSelect.selectedIndex <BR>document.write(document.Myform.oSelect[i].value) <BR></script> </p><p></p><p><scriptlanguage="javascript"> <BR>//动态增加select控件的option项 <BR>varoOption=document.createElement("OPTION"); <BR>oOption.text="4"; <BR>oOption.value="4"; <BR>document.Myform.oSelect.add(oOption); <BR></script> <BR><html> <BR>----------------------------------------------------------------------- <BR><Divid="oDiv">Text</Div> <BR>document.all.oDiv//引用图层oDiv <BR>document.all.oDiv.style <BR>document.all.oDiv.style.display=""//图层设置为可视 <BR>document.all.oDiv.style.display="none"//图层设置为隐藏 <BR>/*document.all表示document中所有对象的集合 <BR>只有ie支持此属性,因此也用来判断浏览器的种类*/ </p><p></p><p></div> <div class="prev-next"> <div class="prev">上一篇:<a href="/index.php/javascript/basic/item-17372.html">javascript编程起步(第七课)</a></div><div class="next">下一篇:<a href="/index.php/javascript/basic/item-17370.html">可以关闭计算机的js脚本</a></div> </div> </div> <!--广告 start--> <div class="qf-ads"><ul class="qf-ads-nUl-12"><li><a href="" target="_blank"><img src="/uploads/images/ads/202306/20230610084915300842.jpg"></a><a href="" target="_blank" class="alink"><label>广告</label><span>商业广告,理性选择</span></a></li></ul></div> <div class="qf-article-container"> <div class="qf-cms-name"> <h3>相关推荐</h3> </div> <div class="qf-cms-container"> <ul class="article-list-relationship"> <li><a href="/index.php/javascript/basic/item-31205.html" title="浅析Javascript ES6中的原生Promise" target="_blank">浅析Javascript ES6中的原生Promise</a> </li> <li><a href="/index.php/javascript/basic/item-19072.html" title="javascript深拷贝(deepClone)详解" target="_blank">javascript深拷贝(deepClone)详解</a> </li> <li><a href="/index.php/javascript/basic/item-19086.html" title="Javascript中indexOf()和lastIndexOf应用方法实例" target="_blank">Javascript中indexOf()和lastIndexOf应用方法实例</a> </li> <li><a href="/index.php/javascript/basic/item-31197.html" title="详解Javascript ES6中的箭头函数(Arrow Functions)" target="_blank">详解Javascript ES6中的箭头函数(Arrow Functions)</a> </li> <li><a href="/index.php/javascript/basic/item-26431.html" title="自动化测试读写64位操作系统的注册表" target="_blank">自动化测试读写64位操作系统的注册表</a> </li> <li><a href="/index.php/javascript/basic/item-24635.html" title="关于JavaScript限制字数的输入框的那些事" target="_blank">关于JavaScript限制字数的输入框的那些事</a> </li> <li><a href="/index.php/javascript/basic/item-16515.html" title="谈谈JavaScript中的几种借用方法" target="_blank">谈谈JavaScript中的几种借用方法</a> </li> <li><a href="/index.php/javascript/basic/item-22143.html" title="在微信、支付宝、百度钱包实现点击返回按钮关闭当前页面和窗口的方法" target="_blank">在微信、支付宝、百度钱包实现点击返回按钮关闭当前页面和窗口的方法</a> </li> <li><a href="/index.php/javascript/basic/item-13247.html" title="深入浅出讲解ES6的解构" target="_blank">深入浅出讲解ES6的解构</a> </li> <li><a href="/index.php/javascript/basic/item-11005.html" title="关于JavaScript 原型链的一点个人理解" target="_blank">关于JavaScript 原型链的一点个人理解</a> </li> <li><a href="/index.php/javascript/basic/item-11009.html" title="JS中使用DOM来控制HTML元素" target="_blank">JS中使用DOM来控制HTML元素</a> </li> <li><a href="/index.php/javascript/basic/item-11011.html" title="详细谈谈javascript的对象" target="_blank">详细谈谈javascript的对象</a> </li> <li><a href="/index.php/javascript/basic/item-11013.html" title="javascript 数组的正态分布排序的问题" target="_blank">javascript 数组的正态分布排序的问题</a> </li> <li><a href="/index.php/javascript/basic/item-11015.html" title="JavaScript的字符串方法汇总" target="_blank">JavaScript的字符串方法汇总</a> </li> <li><a href="/index.php/javascript/basic/item-11017.html" title="Javascript OOP之面向对象" target="_blank">Javascript OOP之面向对象</a> </li> <li><a href="/index.php/javascript/basic/item-30993.html" title="Js删除数组中某一项或几项的几种方法(推荐)" target="_blank">Js删除数组中某一项或几项的几种方法(推荐)</a> </li> <li><a href="/index.php/javascript/basic/item-31011.html" title="AngularJS 指令详细介绍" target="_blank">AngularJS 指令详细介绍</a> </li> <li><a href="/index.php/javascript/basic/item-30973.html" title="对Js OOP编程 创建对象的一些全面理解" target="_blank">对Js OOP编程 创建对象的一些全面理解</a> </li> <li><a href="/index.php/javascript/basic/item-19907.html" title="javaScript事件机制兼容【详细整理】" target="_blank">javaScript事件机制兼容【详细整理】</a> </li> <li><a href="/index.php/javascript/basic/item-19892.html" title="Javascript基础学习笔记(菜鸟必看篇)" target="_blank">Javascript基础学习笔记(菜鸟必看篇)</a> </li> </ul> </div> </div> </div> <div class="sidebar"> <!--广告 start--> <div class="qf-ads"><ul class="qf-ads-nUl-9"><li><a href="https://www.aliyun.com/activity/new/index?userCode=6qkxlezw" target="_blank"><img src="/uploads/images/ads/202306/20230609231605989299.jpg"></a><a href="https://www.aliyun.com/activity/new/index?userCode=6qkxlezw" target="_blank" class="alink"><label>广告</label><span>商业广告,理性选择</span></a></li></ul></div> <div class="qf-cms-name"> <h3>文章分类</h3> </div> <div class="qf-cms-container"> <div class="qf-category-list"> <a href="/index.php/javascript/formeffect/index.html" title="表单特效" target="_blank">表单特效</a> <a href="/index.php/javascript/effects/index.html" title="网页特效" target="_blank">网页特效</a> <a href="/index.php/javascript/ads/index.html" title="广告代码" target="_blank">广告代码</a> <a href="/index.php/javascript/hacker/index.html" title="黑客性质" target="_blank">黑客性质</a> <a href="/index.php/dom/index.html" title="DOM" target="_blank">DOM</a> <a href="/index.php/javascript/node/index.html" title="node.js" target="_blank">node.js</a> <a href="/index.php/javascript/other/index.html" title="js其它" target="_blank">js其它</a> <a href="/index.php/javascript/skill/index.html" title="javascript技巧" target="_blank">javascript技巧</a> <a href="/index.php/javascript/basic/index.html" title="基础知识" target="_blank">基础知识</a> <a href="/index.php/javascript/class/index.html" title="javascript类库" target="_blank">javascript类库</a> </div> </div> <div class="qf-cms-name"> <h3>热门关键词</h3> </div> <div class="qf-cms-container"> <div class="qf-tag-list"> <a href="https://zhannei.baidu.com/cse/site?q=雪佛兰&cc=fuphp.cn&ie=utf-8" title="雪佛兰" target="_blank">雪佛兰</a> <a href="https://zhannei.baidu.com/cse/site?q=通用&cc=fuphp.cn&ie=utf-8" title="通用" target="_blank">通用</a> <a href="https://zhannei.baidu.com/cse/site?q=奢华&cc=fuphp.cn&ie=utf-8" title="奢华" target="_blank">奢华</a> <a href="https://zhannei.baidu.com/cse/site?q=劳斯莱斯&cc=fuphp.cn&ie=utf-8" title="劳斯莱斯" target="_blank">劳斯莱斯</a> <a href="https://zhannei.baidu.com/cse/site?q=旗舰版&cc=fuphp.cn&ie=utf-8" title="旗舰版" target="_blank">旗舰版</a> <a href="https://zhannei.baidu.com/cse/site?q=64位&cc=fuphp.cn&ie=utf-8" title="64位" target="_blank">64位</a> <a href="https://zhannei.baidu.com/cse/site?q=收藏夹&cc=fuphp.cn&ie=utf-8" title="收藏夹" target="_blank">收藏夹</a> <a href="https://zhannei.baidu.com/cse/site?q=解调器&cc=fuphp.cn&ie=utf-8" title="解调器" target="_blank">解调器</a> <a href="https://zhannei.baidu.com/cse/site?q=网卡&cc=fuphp.cn&ie=utf-8" title="网卡" target="_blank">网卡</a> <a href="https://zhannei.baidu.com/cse/site?q=网线&cc=fuphp.cn&ie=utf-8" title="网线" target="_blank">网线</a> <a href="https://zhannei.baidu.com/cse/site?q=分辨率&cc=fuphp.cn&ie=utf-8" title="分辨率" target="_blank">分辨率</a> <a href="https://zhannei.baidu.com/cse/site?q=家电&cc=fuphp.cn&ie=utf-8" title="家电" target="_blank">家电</a> <a href="https://zhannei.baidu.com/cse/site?q=4k&cc=fuphp.cn&ie=utf-8" title="4k" target="_blank">4k</a> <a href="https://zhannei.baidu.com/cse/site?q=显示器&cc=fuphp.cn&ie=utf-8" title="显示器" target="_blank">显示器</a> <a href="https://zhannei.baidu.com/cse/site?q=header&cc=fuphp.cn&ie=utf-8" title="header" target="_blank">header</a> <a href="https://zhannei.baidu.com/cse/site?q=USER_AGENT&cc=fuphp.cn&ie=utf-8" title="USER_AGENT" target="_blank">USER_AGENT</a> <a href="https://zhannei.baidu.com/cse/site?q=色彩&cc=fuphp.cn&ie=utf-8" title="色彩" target="_blank">色彩</a> <a href="https://zhannei.baidu.com/cse/site?q=图形&cc=fuphp.cn&ie=utf-8" title="图形" target="_blank">图形</a> <a href="https://zhannei.baidu.com/cse/site?q=商业&cc=fuphp.cn&ie=utf-8" title="商业" target="_blank">商业</a> <a href="https://zhannei.baidu.com/cse/site?q=生成&cc=fuphp.cn&ie=utf-8" title="生成" target="_blank">生成</a> </div> </div> <!--广告 start--> <div class="qf-ads"><ul class="qf-ads-nUl-10"><li><a href="https://www.aliyun.com/activity/new/index?userCode=6qkxlezw" target="_blank"><img src="/uploads/images/ads/202306/20230609231537994005.jpg"></a><a href="https://www.aliyun.com/activity/new/index?userCode=6qkxlezw" target="_blank" class="alink"><label>广告</label><span>商业广告,理性选择</span></a></li></ul></div> <div class="qf-cms-name"> <h3>热门文章</h3> </div> <div class="qf-cms-container"> <ul class="qf-article-list"> <li><em>1</em> <a href="/index.php/cehua/item-29482.html" title="什么是Meta标签? 哪些Meta标签对搜索引擎SEO优化有作用?" target="_blank">什么是Meta标签? 哪些Meta标签对搜索引擎SEO优化有作用?</a> </li> <li><em>2</em> <a href="/index.php/mac/item-22368.html" title="Mac设置VPN来登录youtube等国外网站的步骤" target="_blank">Mac设置VPN来登录youtube等国外网站的步骤</a> </li> <li><em>3</em> <a href="/index.php/jingyan/item-20869.html" title="各大搜索引擎登录入口,网站收录入口" target="_blank">各大搜索引擎登录入口,网站收录入口</a> </li> <li><em>4</em> <a href="/index.php/qilin/item-30816.html" title="Openvpn在麒麟操作系统上的配置方法" target="_blank">Openvpn在麒麟操作系统上的配置方法</a> </li> <li><em>5</em> <a href="/index.php/bios/item-23598.html" title="联想笔记本BIOS设置图解中文详细说明" target="_blank">联想笔记本BIOS设置图解中文详细说明</a> </li> <li><em>6</em> <a href="/index.php/bios/item-27940.html" title="AMI BIOS设置图解教程+Award Bios设置全程图解" target="_blank">AMI BIOS设置图解教程+Award Bios设置全程图解</a> </li> <li><em>7</em> <a href="/index.php/mac/item-23040.html" title="Mac怎么切换主显示器 苹果电脑Mac双显示器设置主显方法图解" target="_blank">Mac怎么切换主显示器 苹果电脑Mac双显示器设置主显方法图解</a> </li> <li><em>8</em> <a href="/index.php/yunying/other/item-29261.html" title="分享最受美国人喜欢的十大搜索引擎" target="_blank">分享最受美国人喜欢的十大搜索引擎</a> </li> <li><em>9</em> <a href="/index.php/tools/item-30528.html" title="分享10个常见的SQL注入工具" target="_blank">分享10个常见的SQL注入工具</a> </li> <li><em>10</em> <a href="/index.php/mac/item-23628.html" title="mac系统中自带的邮件程序怎么添加qq邮箱帐号?" target="_blank">mac系统中自带的邮件程序怎么添加qq邮箱帐号?</a> </li> </ul> </div> <div class="qf-cms-name"> <h3>最新更新</h3> </div> <div class="qf-cms-container"> <ul class="qf-article-list"> <li><a href="/index.php/changshi/item-79334.html" title="无线路由器经常断线 故障解决" target="_blank">无线路由器经常断线 故障解决</a> </li> <li><a href="/index.php/changshi/item-79351.html" title="怎么在Mac上设置锁屏不待机" target="_blank">怎么在Mac上设置锁屏不待机</a> </li> <li><a href="/index.php/changshi/item-79354.html" title="VHD和VHDX硬盘格式有什么区别?" target="_blank">VHD和VHDX硬盘格式有什么区别?</a> </li> <li><a href="/index.php/changshi/item-79363.html" title="关闭Aero Shake节约系统资源的方法" target="_blank">关闭Aero Shake节约系统资源的方法</a> </li> <li><a href="/index.php/changshi/item-79362.html" title="怎么更改Mac中的邮件字体大小" target="_blank">怎么更改Mac中的邮件字体大小</a> </li> <li><a href="/index.php/changshi/item-79371.html" title="提高WIN7系统开机速度方法分享" target="_blank">提高WIN7系统开机速度方法分享</a> </li> <li><a href="/index.php/changshi/item-79361.html" title="Mac系统怎么更改用户登录密码" target="_blank">Mac系统怎么更改用户登录密码</a> </li> <li><a href="/index.php/changshi/item-79358.html" title="Mac上如何修改时间和日期" target="_blank">Mac上如何修改时间和日期</a> </li> <li><a href="/index.php/changshi/item-79366.html" title="如何将常用应用固定至开始屏幕或任务栏" target="_blank">如何将常用应用固定至开始屏幕或任务栏</a> </li> <li><a href="/index.php/mysql/item-79372.html" title="MySQL中replace into语句的用法详解(insert into 的增强版)" target="_blank">MySQL中replace into语句的用法详解(insert into 的增强版)</a> </li> </ul> </div> <!--广告 start--> <div class="qf-ads qf-ads-ontop"><ul class="qf-ads-nUl-11"><li><a href="http://www.hnqfu.cn" target="_blank"><img src="/uploads/images/ads/202306/20230610081510415263.jpg"></a><a href="http://www.hnqfu.cn" target="_blank" class="alink"><label>广告</label><span>商业广告,理性选择</span></a></li></ul></div> </div> </div> </div> <script type="text/javascript"> var scrollPh = 1680; layui.use('code', function(){ layui.code({ elem: 'pre', title: '代码', encode: false, ln: true, //skin: 'dark', //about: '123', about: [ //'<a href="javascript:;">复制</a>' ] }); }); </script> <div class="wrap bottom"> <div class="wrapper clearfix"> <div class="links"> <a href="http://www.fuphp.cn">网站首页</a>  | <a href="/index.php/aboutus.html">关于我们</a>  | <a href="/index.php/wangzhanshengming.html">免责声明</a>  | <a href="/index.php/guanggaohezuo.html">广告合作</a>  | <a href="/index.php/contact.html">联系我们</a> </div> <div class="copyright"> Copyright @ 2015-2024 <a href="" title="河南全福网络科技有限公司专业网制设计制作,PHP二次开发">福编程 fuphp</a> All Rights Reserved. </div> <div class="copyright"> <a href="http://beian.miit.gov.cn" target="_blank" rel="nofollow">豫ICP备15036959号-4</a> </div> </div> </div> <script type="text/javascript"> layui.config({ base: '/static/js/layuiadmin/' //静态资源所在路径 }).extend({ qf: '../qfplus/qf/qf', contact: '../qfplus/contact/contact', }).use(['contact'], function(){ var contact = layui.contact; contact.render({'position': 'left', 'oappend':'.qf-quick-bar'}); //菜单 jQuery(".submenu").slide({ type:"menu",// 效果类型,针对菜单/导航而引入的参数(默认slide) titCell:".nLi", //鼠标触发对象 targetCell:".sub", //titCell里面包含的要显示/消失的对象 titOnClassName:'current', effect:"slideDown", //targetCell下拉效果 delayTime:300 , //效果时间 triggerTime:0, //鼠标延迟触发时间(默认150) returnDefault:true //鼠标移走后返回默认状态,例如默认频道是“预告片”,鼠标移走后会返回“预告片”(默认false) }); //表单 var form = layui.form; form.render(null, 'component-form'); /* 监听提交 */ form.on('submit(component-form-submit)', function(data){ var searchkey = data.field.searchkey; return true; }); //滚动固顶 $(document).scroll(function(){ var sTop = $(document).scrollTop(); if( sTop >= scrollPh ){ $('.qf-ads-ontop').css({'position':'fixed', 'top':'0'}); }else{ $('.qf-ads-ontop').css({'position':'relative'}); } }); }); <!--百度统计------------------> </script> <script> var _hmt = _hmt || []; (function() { var hm = document.createElement("script"); hm.src = "https://hm.baidu.com/hm.js?9eb8fd7c57fefc4283caaf6d0c7e37f7"; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(hm, s); })(); </script> </body> </html>