有趣的javascript API

最新推荐文章于 2024-09-04 18:00:00 发布

奔跑的前端er

最新推荐文章于 2024-09-04 18:00:00 发布

阅读量370

点赞数

分类专栏：神奇的javascript 文章标签： javascript api

本文链接：https://blog.csdn.net/caoxinhui521/article/details/77619675

版权

神奇的javascript 专栏收录该内容

21 篇文章 0 订阅

订阅专栏

如果想让自己的页面不停的刷新，可以添加一个script

<script>
    setTimeout("self.location.reload()",1000);
</script>

显示页面的最后修改时间

<script>
    console.log(document.lastModified);
</script>

HTML DOM Option
Option 对象代表 HTML 表单中下拉列表中的一个选项。
在 HTML 表单中<\option> 标签每出现一次，一个 Option 对象就会被创建。

根据window.document.readyState的值判断文档是否加载完成。
readyState的值分为：
uninitialized：XML对象被产生，但文档尚未开始被加载
loading:加载程序进行中，但文档尚未开始解析
loaded：部分的文档已经开始加载且进行解析，但对象模型尚未生效。
interactive：仅对已加载的部分文件有效
completed：文件已完全加载。

客户端cookie的使用
getTime() 我们将取得从 1970/01/01 至今的毫秒数。
setTime() 方法以毫秒设置 Date 对象。
document.cookie（访问页面cookie） = cname+”=”+cvalue+”; “+expires;
expires是过期时间。
toGMTString()函数的返回值为String类型,返回一个表示该Date对象的字符串,该字符串基于GMT格式。

表格属性

inserRow()和insertCell()方法

inserRow()这个函数将新行添加到index的那一行前，比如insertRow(0),是将新行添加到第一行之前。默认的insertRow()函数相当于 insertRow(-1)，将新行添加到表的最后。
objTable.insertRow (objTable.rows.length).就是为表格objTable在最后新增一行。

deleteRow()和deleteCell()方法
deleteRow(index)：index从0开始
删除指定位置的行和单元格。要传入的参数：Index是行在表格中的位置。

rows
所有行形成的数组。
cells
所有单元格形成的数组。
rowIndex
返回该行在表中的位置。
cellIndex
返回单元格的位置
innerHTML
设置或返回单元格的HTML。
caption：指向元素（如果存在）；
tBodies：元素的集合；
tFoot：指向元素（如果存在）；
tHead：指向元素（如果存在）；
rows：表格中所有行的集合；
createTHead()：创建元素并将其放入表格；
createTFoot()：创建元素并将其放入表格；
createCaption()：创建元素并将其放入表格；
deleteTHead()：删除元素；
deleteTFoot()：删除元素；
deleteCaption()：删除元素；
deleteRow(position)：删除指定位置上的行；
insertRow(position)：在rows集合中指定的位置上插入一新行。
元素的方法如下：
rows：中所有行的集合；
deleteRow(position)：删除指定位置上的行；
insertRow(position)：在rows集合中指定的位置上插入一新行。
元素的方法如下：
cells：元素中所有的单元格的集合；
deleteCell(position)：删除给定位置上的单元格；
insertCell(position)：在Cells集合的给定位置上插入一个新的单元格。

DOM节点层次

文档节点是每个文档的根节点。html称为文档元素。
节点的具体信息可以用nodeName和nodeValue这两个属性，nodeName中保存的始终是元素的标签名。每个节点都有childNodes属性，其中保存着一个NodeList对象。可以通过两种方法访问保存在NodeList中的节点：

var child=someNode.childNodes[0];
var child=someNode.childNodes.items(1);

对arguments对象使用Array.prototype.slice()方法可以转换为数组。
Node

parentNode
previousSibling
nextSibling
firstChild
lastChild
hasChildNodes
ownerDocument
appendChild
insertBefore(newNode,someNode)
replaceChild
removeChild
cloneNode(true/false)
normalize()

Document
Document类型表示文档，子节点documentElement属性，始终指向HTML页面的<html>元素。
document.body
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)
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.οnclick=”func()” //鼠标指针单击对象是触发
document.body.οnmοuseοver=”func()” //鼠标指针移到对象时触发
document.body.οnmοuseοut=”func()” //鼠标指针移出对象时触发
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) //打开新的网页

document.images //对应页面上的img标签
document.images.length //对应页面上img标签的个数
document.images[0] //第1个img标签
document.images[i] //第i-1个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