JavaScript操作BOM

window常用的属性

名称说明
history有关客户访问过的URL的信息
location有关当前URL的信息
screen只读属性,包括有关客户端显示屏幕的信息

window常用的方法

名称说明
prompt()显示可提示用户输入的对话框
alert()显示一个带有提示信息和一个“确定”按钮的警示对话框
confirm()显示一个带有提示信息、“确定”、“取消”按钮的对话框
close()

关闭浏览器窗口

open()打开一个新的浏览器窗口,加载给定URL所指定的文档
setTimeout()在指定的毫秒数后调用函数或计算表达式
setInterval()按照指定的周期(以毫秒计)来调用函数或表达式

示例 1:

//跳转到相应网页
window,location = "http://www.bdqn.cn";
//根据返回值做相应的操作
var bool = window.confirm("是否删除");
//关闭窗口
window.close();

open()语法:window.open("url","窗体名称","窗体特征");

窗体特征的属性

名称说明
height、width窗口文档显示区的高度、宽度,以像素计
left、top窗口的 x坐标、y坐标,以像素计
tooIbar = yes | no | 1 | 0是否显示浏览器的工具栏,默认是yes
scrIIbars = yes | no | 1 | 0是否显示滚动条,默认是yes
location = yes | no | 1 | 0是否显示地址栏,默认是yes
status = yes | no | 1 | 0是否添加状态栏,默认是yes
resizable = yes | no | 1 | 0窗体是否可调节尺寸,默认是yes
menuble = yes | no | 1 | 0是否显示菜单栏,默认是yes
titlebar = yes | no | 1 | 0是否显示标题栏,默认是yes
fullscreen = yes | no | 1 | 0

是否使用全屏模式使用浏览器,默认是no

history对象与location对象

history对象的方法

名称说明
back()加载history对象列表中的前一个URL(相当浏览器中的后退按钮)
forward()加载history对象列表中的后一个URL(相当浏览器中的前进按钮)
go()加载history对象列表中某一个具体URL(相当于运行浏览器历史列表中的URL)

history.go(1);//表示前进
history.go(-1);//表示后退

location对象的属性和方法

名称(属性)描述
host设置或返回主机名和当前URL的端口号
hostname设置或返回当前URL的主机名
href设置或返回完整的URL
名称(方法)描述
reload()重新加载当前文档
replace()用新的文档替代当前文档

示例 2:

<a href="javascript:location.href =' https://www.baidu.com/'">百度链接</a>

document对象

document对象的常用属性

名称描述
referrer返回载入当前文档的URL
URL返回当前文档的URL
var url = document.referrer;
//根据url的值可用来判断用户是从那个地址进来的

document对象的常用方法

名称描述
getElementById()返回对拥有指定id的第一个对象的引用
getElementsByName()返回带有指定名称的对象的集合
getElementsByTagName()返回带有指定标签名的对象的集合
write()向文档写文本,HTML表达式或JavaScript代码

getElementById()方法一般用于访问 div、图片、表单元素、网页标签等,但要求访问对象的id是唯一

getElementsByName()方法与getElementById()方法相似,但它访问的是具有name属性的元素,由于一个文档中的name属性可能不唯一,因此getElementsByName()方法一般用于访问一组相同anme属性的元素

getElementsByTagName()方法是按标签来访问页面元素的,一般用于访问一组相同的元素。如一组<input>

document对象方法简单使用:

<h1 id = "h1_value">文本</h1>

<input name="text" value="chun" type="text">
<input name="text" value="xia" type="text">
<input name="text" value="qiu" type="text">
<input name="text" value="dong" type="text">
<input name="btn" type="button" value="更改" onclick="show()">
<script>
function show() {
    var str = "";
    var array = document.getElementsByTagName("input");
    for(var i = 0;i<array.length;i++){
        str += array[i].value;
    }
    document.getElementById("h1_value").innerHTML=str;
}
</script>

Date对象

语法:var 名称 = new Date(参数);

参数是字符串格式    "MM  DD,  YYYY,  hh:mm:ss"

如:

var today = new Date("July 15,2013,16:34:28");

Date对象的常用方法

方法说明
getDate()返回Date对象的一个月中的每一天,其值1-31
getDay()返回Date对象的星期中的每一天,其值0-6
getHours()返回Date对象的小时数,其值0-23
getMinutes()返回Date对象的分钟数,其值0-59
getSeconds()返回Date对象的秒数,其值0-59
getMonth()返回Date对象的月数。其值0-11
getFullYear()返回Date对象的年份,其值为四位数
getTime()返回自某一时刻(1970/1/1)以来的毫秒数

Math对象的常用方法

方法说明示例
ceil()对数进行上舍入

Math.ceil(25.5);返回26

Math.ceil(-25.5);返回-25

floor()对数进行下舍入

Math.floor(25.5);返回25

Math.floor(-25.5);返回-26

round()把数四舍五入为最接近的数

Math.round(25.5);返回26

Math.round(-25.5);返回-26

random()返回0-1中的随机数Math.random();

//返回1-100的数
var iNum = Math.floor(Math.random()*100+1);
//返回2-99的数
var iNum1 = Math.floor(Math.random()*98+2);

常用的定时函数

setTimeout()  用于在指定的毫秒后调用函数或计算表达式。

语法:setTimeout("函数名称",毫秒数);

只执行一次


setInterval()  可按照指定的周期(以毫秒计)来调用函数或计算表达式

语法:setInterval("函数名称",毫秒数);

按周期执行


clearTimeout()和clearInterval()

 clearTimeout()函数用来清除由setTimeout()函数设置的定时器

语法:clearTimeout(setTimeout()返回的id值);


clearInterval()函数用来清除由setTimeout()函数设置的定时器

语法:clearInterval(setTimeout()返回的id值);



阅读更多
上一篇JavaScript基础
下一篇JavaScript对象及初识面向对象
想对作者说点什么? 我来说一句

没有更多推荐了,返回首页

关闭
关闭