一些让人很无语的冷笑话。。。
作者:岸上的鱼 日期:2009-01-19
给pjblog所有图片添加渐隐效果
作者:岸上的鱼 日期:2009-01-11
今天晚上想为我的blog的所有图片添加鼠标移进移出渐隐效果
耗费了大量的脑细胞,终于在睡觉之前实现了,MARK一下。
在common/common.js文件的第56行加入:
if(document.images[i].width>100 || document.images[i].height>100){
document.images[i].style.filter="alpha(opacity=55)";
if(window.addEventListener){
document.images[i].addEventListener('onmouseout', newfunc(document.images[i],50,10,5), false);
document.images[i].addEventListener('onmouseover', newfunc(document.images[i],100,10,5), false);
} else {
document.images[i].attachEvent('onmouseout',newfunc(document.images[i],50,10,5));
document.images[i].attachEvent('onmouseover',newfunc(document.images[i],100,10,5));
}
}
加入两个函数:
js动态添加属性和事件
作者:岸上的鱼 日期:2009-01-11
var obj = document.getElementById("obj");
obj.setAttribute("onclick", "javascript:alert('测试');");
这里利用 setAttribute 指定 onclick 属性,但是:用 setAttribute 设置 style、onclick、onmouseover 这些属性在 IE 中是行不通的。但是某些属性可以,以下是通过测试的一个例子:
方法二、用 attachEvent 和 addEventListener
IE支持attachEvent
function Foo()
alert("测试");
}
也可写在一起
obj.attachEvent("onclick", function(){alert("测试");});
其它浏览器支持 addEventListener
obj.addEventListener("click", Foo, false);
function Foo()
{
alert("测试");
}
同样也可写在一起
obj.addEventListener("click", function(){alert("测试");}, false);
注意 attachEvent 的事件带 on,如 onclick,而 addEventListener 不带 on,如 click。
顺便说一下 addEventListener 的第三个参数(虽然很少用) useCapture - 如果为 true,则 useCapture 指示用户希望启动捕获。启动捕获后,所有指定类型的事件将在被指派到树中其下面的任何 EventTargets 之前指派给已注册的 EventListener。正在通过树向上 bubbling 的事件将不触发指定的使用捕获的 EventListener。
综合应用
if(window.addEventListener){
obj.addEventListener('click', alert('test1'), false);
obj.addEventListener('click', alert('test2'), false);
} else {
obj.attachEvent('onclick', function(){alert('test3');});
obj.attachEvent('onclick', function(){alert('test4’);});
}
方法三、事件 = 函数
例:obj.onclick = Foo;
这在多个浏览器中均支持,这是属于旧的规范(方法二属于 DOM2 的规范),不过由于使用方便,用的场合也比较多。
<input type=checkbox value=1>1
<script language=”javascript”>
var arr = document.getElementsByTagName("input"); //取得所有input,返回就是数组.
alert(arr[0].value); //取第一个input的值.
</script>
<head>
<title>test</title>
</head>
<body>
<style id="abc-style">
.abc {display: none}
</style>
<h1 class='abc'>test</h1>
<script>
function toggle() {
var style = document.getElementById('abc-style');
style.disabled = !style.disabled;
}
</script>
<P onclick="toggle()">click me </p>
</html>
延伸思考:
比如说,你想得到所有class属性是"abc"的tr,用这个就可以了:
代码:
alltr = document.evaluate("//tr[@class='abc']", document, null, XPathResult.UNORDERED_NODE_SNAPSHOT_TYPE, null);
for (var i = 0; i < alltr.snapshotLength; i++) {
tr = alltr.snapshotItem(i);
// do something with tr
}
attachEvent传递参数
作者:岸上的鱼 日期:2009-01-11
两种方法
方法一:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>新建网页 1</title>
</head>
<body>
<a href="#" id="mylink">这是连接</a>
<script type="text/javascript">
function AttachEvent(type, target, handler, owner)
{
var eventHandler = handler;
if(owner)
{
// 在这里重新定义一个处理函数
eventHander = function(e)
{
handler.call(owner, e);
}
}
if(window.document.all)
target.attachEvent("on" + type, eventHander );
else
target.addEventListener(type, eventHander, false);
}
function MyLink_Click(e)
{
alert(this.name);
var target = e.srcElement || e.target;
alert(target.href);
}