用户点击某个链接时弹出一个新窗口
javascript使用window对象的open()方法来创建新的浏览器窗口，这个方法有三个参数：
window.open(url,name,features)
url:新窗口地址，如果省略，则弹出空白窗口
name：新窗口的名字
features：新窗口的属性。
比如：
function open_url(url){
window.open(url,"new-window","width:320,height:480");
}
用 “javascript:” 伪协议来调用上面那个函数。（“javascript:” 伪协议让我们可以通过一个链接来调用javascript函数）
<body>
<a href="javascript:open_url(‘http://www.baidu.com‘);">百度</a>
<script type="text/javascript">
function open_url(url){
window.open(url,"new-window","width:320,height:480");
}
</script>
</body>
用onclick事件处理函数作为属性 嵌入<a>标签
<a href="#" onclick="open_url(‘http://www.baidu.com‘);return false;">百度2</a>
<script type="text/javascript">
function open_url(url){
window.open(url,"new-window","width:320,height:480");
}
</script>
上面两种方法没有预留退路，如果用户禁用浏览器的javascript1功能，这样的链接就没用处了。
预留退路就是说，虽然在遇到不支持js的浏览器或者用户禁用js这类障碍某些功能无法使用，但最基本的操作仍能顺利完成。
<!-- 预留退路的做法--> <a href="http://www.baidu.com" onclick="open_url(‘http://www.baidu.com‘); return false">百度3</a> <!--预留退路的简化版--> <a href="http://www.baidu.com" onclick="open_url(this.getAttribute(‘href‘); return false">百度4</a> <!--预留退路的最简化版--> <a href="http://www.baidu.com" onclick="open_url(this.href); return false">百度4</a> <!--由DOM提供的this.href属性-->
现在即使javascript已被禁用这个链接也是可用的。
行为和结构分离开：
<a href="http://www.baidu.com" class="link">百度5</a>
<script type="text/javascript">
function open_url(url){
window.open(url,"new-window","width:320,height:480");
}
window.onload = prepareLinks;
function prepareLinks(){
var links=document.getElementsByTagName(‘a‘);
for (var i=0; i<links.length; i++){
if (links[i].getAttribute(‘class‘) == ‘link‘){
links[i].onclick = function(){
open_url(this.getAttribute(‘href‘));
return false;
}
}
}
}
</script>
时间： 2024-10-13 09:38:49