脚本化文档:
客户端js把静态html转变为交互式的web应用程序,脚本化web页面的内容正是js存在的理由。
每个web浏览器窗口(帧)显示一个html文档,表示这个窗口的window对象有一个document属性,他引用了一个Document对象,
下面便学习Document对象的属性和方法:
1、动态文档内容:Document.write()
Document.write()允许把内容写入到文档中,有两种使用方式:
第一,在脚本中使用,把html输入到当前正在被解析的文档中,如:把当前日期添加到一个静态html文档
<script> var today = new Date(); document.write("<p>Document accessed on:"+today.toString()); </script>
注意:如果<script>有一个defer属性,它就不能包含任何对document.write()的调用;
第二,使用write()(结合Document对象的open()和close())来在其他窗口中创建一个全新的文档,如创建一个弹出窗口:
function hello(){ var w = window.open(); var d = w.document; d.open(); d.write("<p>hello world</p>"); d.close(); }
2、Document属性
bgcolor——设置文档背景颜色,对应于标记<body>的bgcolor属性;
cookie——允许js程序读写http cookie;
domain
3、文档对象集合:
anchors[]——存放文档中命名的位置集,使用一个具有name属性的<a>标记来创建;
applets[]
forms[]——存放文档中<form>元素集,每个Form对象都有自己的一个名为elements[]集合属性,在表单提交之前,Form对象触发一个onsubmit事件句柄;
images[]——存放<img>元素集;
links[]——
(1)命名Document对象
使用数字来索引文档对象集合容易产生一个问题:基于位置的所以不稳定;更加健壮的做法是为重要的文档元素分配名字,并用名字来引用这些元素。
在DOM中,可以使用表单、表单元素、图像、applet和链接的name属性做到这一点:出现name属性时,它的值将被用作相应对象的名字,如:
<form name="myform"><input type="button" value="push me"></form>
如果<form>是文档中的第一个元素,那么js代码就可以用下面三种表达式中的任何一种实现:
document.forms[0];
document.forms.myform;
document.forms["myform"];