记录我的旅程2之JavaScript Dom学习笔记

下面我们接着上一篇继续我们的Dom征程，在我的学习中，我感觉越学Dom越感觉非常的有意思，期待我们能够共同学习。下面我们学习window对象的属性，这个博客我就专门针对我这段时间学习的window对象的属性做个笔记。

window对象的属性1

(1) window.location.href=’http://www.baidu.com’,重新导航到新的地址，和navigate方法效果一样，window.location.reload()刷新页面。

(2) window.event是非常重要的属性，用来获取发生事件时的信息，事件不局限于window对象的事件，所有元素的事件都可以通过event属性获取相关信息，类似于Winform中的e（EventArg）。

1) altkey属性，bool类型，表示发生事件时alt键是否被按下，类似的还有Ctrkey,Shiftkey属性，例如：

2) clientX,clientY发生事件时鼠标在客户区的坐标，screenX,ScreenY发生事件时鼠标在屏幕上的坐标，offsetX,offsetY发生事件时，鼠标相当于事件源(如点击按钮时触发onclick)的坐标。

3) returnValue属性，如果将returnValue设置为false，就会取消默认事件的处理，在超链接的onclick里面禁止访问href的页面，在表单校验的时候禁止提交表单到服务器。

例1 <a href="http://www.baidu.com" onclick="alert('禁止访问');window.event.returnValue=false;">百度</a>

例2 <form action="f1f2.htm">

</form>

4) srcElement 获得事件的源对象

5) keyCode 发生事件时的按键值

6) button 发生时间时鼠标按键，1为左键，2为右键，3为左右键同时按。

注释：禁止Button控件上面内容的复制

(3) 例子：定时器走马灯重写，完美的方案

<title>这是一片文章的信息是</title>

function scroller() {

var title = document.title;

var lastCh = title.charAt(0); //容易错

var leftStr = title.substring(1, title.length);

document.title = leftStr + lastCh;

}

</script>

window对象的属性2

(1) screen对象，屏幕的信息

alert("分辨率：" + screen.width + "*" + screen.height);

if (screen.width < 1037 || screen.height < 800) {

alert("分辨率太低");

}

</script>

(2) clipboardData对象，对黏贴板的操作。clearData(“Text”)清空黏贴板，getData(“Text”)读取黏贴板的值，返回值为黏贴板中的内容，setData(“Text”,val)设置黏贴板的值。

(3) 当复制的body的oncopy方法被触发，直接return=false就是禁止复制

(4) 很多元素也有oncopy,onpaste事件。

手机号码<input type="text" /><br />

确认手机号码：<input type="text" onpaste="alert('请勿黏贴');return false;" /><br />

function modifyclipboard() {

clipboardData.setData('Text', clipboardData.getData('Text') + '本文来自博客园——>Kencery' + location.href);

}

</script>

注释：oncopy=”setTimeout(‘modifyclipboard()’,100)”。用户复制动作发生0.1秒以后再去改黏贴板中的内容，100ms是一个经常取值，写1000,10,50,20…….都不能直接在oncopy里面修改黏贴板。

不能直接在oncopy中执行对黏贴板的操作，因此设定定时器，0.1秒以后执行，这样就不在copy的执行调用占用了。

function modifyclipboard1() {

var txt = clipboardData.getData('Text');

txt = txt + ",本文来自博客园——>Kencery：" + location.href;

clipboardData.setData('Text', txt);

}

毒蛇钉刺发生的说多少次风送断肠声生产方式测试说的

场发射才说的才是才说的cvs才说的长vdsc是调查vs<br />

</body>

window对象的属性3

(1) history操作历史记录

1) window.history.back(1) 后退，window.history.forward() 前进。我们的代码也可以用window.history.go(-1),window.history.go(1) 前进。

(2) 例如：建立两个页面

1) <a href="f1f2.htm">进入第二页</a>

2) <a href="javascript:window.history.back()">后退</a>

至此，我的这篇博客笔记也完成了，下篇我们将介绍document属性。

posted @ 2012-06-09 12:29 Kencery 阅读(556) 评论(0) 编辑收藏举报

刷新页面返回顶部

怪才(Kencery)

菜鸟的里程中只有奋斗，别无其他

记录我的旅程2之JavaScript Dom学习笔记

公告