javascript学习之BOM模型
来源:互联网 发布:淘宝则么设置运费 编辑:程序博客网 时间:2024/06/08 23:35
浏览器的对象模型如下图所示:
1.window对象
moveBy(dx , dy) 将窗口移动相应偏移量
moveTo(x,y) 将窗口移动到相应位置
resizeBy(dx , dy)将窗口相对目前变化
resizeTo(x , y)将窗口大小变为
screenLeft/screenRight窗口位置
应该尽量减少对于窗口的操作,因为不同的浏览器提供的方法会有所不同
window.open(载入页面的url,新窗口的名字,属性字符串,是否替换当前页面)
返回值为新建窗口的引用。
如果用已有框架的名字作为参数传入第二个,那么新页面就会被载入那个框架,否则就会新创建窗口
属性字符串表格如下:
使用起来可以如下所示:
“height=200,width=200”不过绝对不能有多余的空格
window.close()关闭当前窗口
js脚本可以关闭它自己打开的窗口,不过如果关闭js所属的窗口的话会询问用户
2.弹框
弹框的话有以下几种方式
1.alert(文本)用于提示用户
2.confirm
if(confirm("are you sure")) {
}else {
}
用户两选择
3.prompt输入文本框
var res = prompt("what is your name" , "jack");第一个是询问 第二个是默认的填入参数
if(res != null) {
}else{
}
3.状态栏
用于更改浏览器下方的状态栏的信息
window.defaultStatus = "aa";则状态栏上就会长期显示aa
window.status可以临时改变文本,比如当鼠标移到href上的额时候
<a href = "xxx.html" onmouseover="window.status = 'aaaa'">xxx</a>
不过频繁更改状态栏会造成业余的感觉 所以一般不会使用
4.时间控制
暂停,比如鼠标放到了某个按钮上,需要隔一会才会显示tip
var id = setTimeout(函数名称 , 毫秒数)
clearTimeout(id);
间隔重复执行
var id = setInterval(function , timenumber)
clearInterval(id);
5.历史控制
<a href = "javascript:window.history.go(-1)">Back to the previous page</a>
为了使意义更明确一些 可以使用 history.back() and history.forward();
window.history.length可以查看历史记录的条数
6.document控制
1.document对象有很多可用的属性 比如更改title:
document.title = "xxx";
再比如更改当前的url从而得到页面跳转
document.url = "xxx";
2.document对象有很多集合类属性
访问方法:(如下代码)
<body>
<p>welcome to my <a href = "aaa">home</a></p>
<img src = "ddd" align = "right" name = "img1"/>
<form method = "post" action = "xxx" name = "form1">
<input text = "input" name = "i1"/>
<input text = "submit" value = "subscribe"/>
</form>
</body>
在如上代码的基础上可以访问到图片和各种form,比如:
document.images["img1"].src就可以找到img1的src
document.forms["form1"]可以访问到form1
3.write方法
document.write("<script type=\"text/javascript\">"+"</scr" + "ipt>");用于输出js代码到网页上
ps:其中的</script>标签被分开是因为浏览器,每次都会默认此标签之间为完整的js内容,就算是</script>出现
在了js字符串中。
4.配合open的write方法
下例为打开一个空白页 写入代码 然后利用close之后进行显示 适合不用服务器交互的页面
var win = window.open("about:blank" , "newwindow" , "height=50,width=30")
win.document.open();
win.document.write("<html><head><title>NewWindow</title></head></html>");
win.document.close();
5.location属性
可以用来解析url
location.href = "xxx"可以载入
location.reload(true)从服务器重载页面
location.reload(false)从缓存重载页面
注意:reload调用之后,后面的代码可能之行也可能不执行,得看网络延迟和系统资源的情况,所以一般会放到最后一行
6.navigator对象
可以获取各种浏览器的信息,如appCodeName用来获取浏览器的代码名称 从而可以检测到浏览器是哪一个
7.screen对象
用来获取用户的屏幕信息,如:
availHeight可以使用的屏幕高度
availWidth可以使用的屏幕宽度
colorDepth色深
height屏幕高
width屏幕宽
- javascript学习之BOM模型
- JavaScript学习之 BOM(浏览器对象模型)
- Javascript学习笔记之BOM
- JavaScript学习笔记之BOM
- JavaScript之BOM(浏览器对象模型)
- JavaScript之 ------ 浏览器对象模型 (BOM)
- javascript之BOM浏览器对象模型引入
- javascript学习之 function类型 (29)——浏览器对象模型 Bom 简介
- JavaScript-BOM模型
- [学习笔记]JavaScript之BOM基础
- JavaScript学习4:BOM之window对象
- JavaScript学习5:BOM之location对象
- JavaScript高程学习笔记之BOM(8)
- JavaScript网页编程之------浏览器对象模型(BOM)
- JavaScript BOM浏览器对象模型
- javascript BOM 浏览器对象模型
- JavaScript:BOM(浏览器对象模型)
- 轻松学习JavaScript十五:JavaScript之BOM简介
- grails windows安装
- 自己对于DAO层的封装
- c#遍历一个文件夹下的所有文件包括子文件夹
- 图方便的后果
- windows环境下MySQL重启的命令行说明
- javascript学习之BOM模型
- 界面输入字符默认为16进制数,后台如何得到16进制数
- apache tomcat负载均衡
- CX51 用户手册----MODAB2 伪指令
- 简单的二叉树实现同学录,二叉树的建立,插入,查找,前序遍历。有个清除输入缓冲区的函数。
- wp清空listbox内容
- FrameBuffer
- c语言操作mysql
- MyBatis动态SQL完整版