js 30Dom应用

1.open() 方法用于打开一个新的浏览器窗口或查找一个已命名的窗口。

给open传网址 如果是外站就加个http  <input type="button" value="打开窗口"  onclick="window.open('http://wwww.baidu.com/')" >
close关闭窗口
document.write() 如果把它放在事件里面 他执行时会把页面所有信息清空 然后再把信息写进去 源码也会变成信息内容
<input type="button" value="write" onclick="document.write(abc)" /> 点击按钮之后页面信息清空就剩一个abc 源码由之前的html内容变成abc

window.open('about:blank');//按下按钮 出现新的窗口是个空白页

document. 全称window.document window可以省略

window.open(URL,name,specs,replace)
URL 可选。打开指定的页面的URL。如果没有指定URL,打开一个新的空白窗口
name 可选。指定target属性或窗口的名称。支持以下值:
_blank URL加载到一个新的窗口。这是默认
_parent URL加载到父框架
_self URL替换当前页面(直接在本页面刷新加载新内容)
_top URL替换任何可加载的框架集
name 窗口名称

close:关闭窗口 <input type="button" value="关闭" onclick="window.close()" />当前窗口关闭
但是火狐不支持脚本关闭非脚本打开的窗口 不能关闭由一个用户打开的窗口 只能open close一起用
所以改成<input type="button" value="打开" onclick="window.open('30close.html');" />
(30close文件里)<input type="button" value="关闭" onclick="window.close()" />

userAgent
<script>
alert(window.navigator.userAgent);//userAgent 当前的浏览器版本信息
alert(window.location);//读取当前页面的地址 location还可以被赋值
</script>
<input type="button" value="aaa" onclick="window.location='http://baidu.com/';">//跟open()差不多

可视区 clientHeight 大小可变
红线 可视区和页面顶部有一定距离 距离取决于滚动条 滚动条滚了多远距离就多大:scrollTop
IE和火狐下兼容 alert(document.documentElement.scrollTop);//滚动条越往下滚动 数值越大
alert(document.body.scrollTop);//在Chrome下可行
//所以出来了它:
var scrollTop=document.documentElement.scrollTop||document.body.scrollTop;

js 30Dom应用

<style>
#div1{ width:200px; height:150px; background:red; position:fixed; right:0;bottom:0;}
body{ height:2000px;}/*不管页面怎么滚动 div始终处在右下角这个位置*/
</style>
</head>
<body >
<div id="div1"></div>
</body>IE6不支持 固定定位
换成:
<script>
window.onscroll=window.onrsize=function (){
var scrollTop=document.documentElement.scrollTop||document.body.scrollTop;
var oDiv=document.getElementById('div1');
oDiv.style.top=document.documentElement.clientHeight-oDiv.offsetHeight+scrollTop+'px';
/*会发现div有一点抖动 因为一直在滚动 每滚动一下就重新定位一次
并且这个事件是onscroll当滚动时才会触发 但是当你单单扯动网页的边框让他变长变短div的位置是不变的 也自然就不是始终处在右下角了
onresize:当窗口改变大小时发生
处理抖动问题 userAgent>IE6 fixed
IE6 运动
*/
}
</script>

js 30Dom应用

系统对话框:
警告框:alert(“内容”),没有返回值
选择框:confirm(“提问的内容”),返回boolean
输入框:prompt(),返回字符串或null
window对象常用事件
onload
onscroll
onresize
例子:回到顶部按钮、侧边栏广告
              闪烁问题

confirm
<script>
//confirm('你是否要删除');//弹出个对话框 和alert还不太一样 因为他的选项有2个 确定or取消
//有返回值
var def=confirm('你是否要删除');
alert(def);//按确定 弹出true 否则false;
</script> prompt
<script>
// prompt('请输入你的名字','blue');//弹出个emm话题框 第二个参数blue是设置的默认值 也有返回值
var res=prompt('请输入你的名字','blue');
alert(res);//点击确定之后框的内容就变成了你输入的内容 点击取消变成了nnull
</script>
上一篇:201521123001《Java程序设计》第4周学习总结


下一篇:Ubuntu16.04搭建OpenVPN