用户点击某个链接时弹出一个新窗口
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>

第五章 javascript编程可养成的好习惯的更多相关文章

  1. 第五章 JavaScript对象及初识面向对象

    第五章   JavaScript对象及初识面向对象 一.对象 在JavaScript中,所有事物都是对象,如字符串.数值.数组.函数等. 在JavaScript对象分为内置对象和自定义对象,要处理一些 ...

  2. 学习笔记 第十五章 JavaScript基础

    第15章   JavaScript基础 [学习重点] 了解JavaScript基础知识 熟悉常量和变量 能够使用表达式和运算符 正确使用语句 能够掌握数据类型和转换的基本方法 正确使用函数.对象.数组 ...

  3. 第五章JavaScript

    创建数组://1.字面量方式创建 (推荐大家使用这种方式创建数组 简单粗暴) var colors = ['red','color','yellow'];console.log(colors) //空 ...

  4. #《Essential C++》读书笔记# 第五章 面向对象编程风格

    基础知识 继承机制定义了父子(parent/child)关系.父类(parent)定义了所有子类(children)共通的共有接口(public interface)和私有实现(private imp ...

  5. WindowsPE 第五章 导出表编程-1（枚举导出表）

    导出表编程-1-枚举导出表 开始前先回忆一下导出表: 1.枚举dll函数的导出函数名字: 思路: (1)加载dll到内存里. (2)获取PE头,逐步找到可选头部. (3)然后找到里面的第一个结构(导出 ...

  6. 实践javascript美术馆的小案例，学习到的东西还是蛮多的，包括javascript编程中的预留退路、分离javascript、以及实现向后兼容等

    javascript美术馆(改进2) 一.javascript编程过程中的好习惯 1.实现预留退路 js被禁掉,图片也可以显示出来,href属性带有图片路径 <script src=" ...

  7. [书籍翻译] 《JavaScript并发编程》第五章 使用Web Workers

    本文是我翻译<JavaScript Concurrency>书籍的第五章 使用Web Workers,该书主要以Promises.Generator.Web workers等技术来讲解Ja ...

  8. JavaScript DOM编程艺术-学习笔记（第五章、第六章）

    第五章: 1.题外话:首先大声疾呼,"js无罪",有罪的是滥用js的那些人.js的father 布兰登-艾克,当初为了应付工作,10天就赶出了这个js,事后还说人家js是c语言和s ...

  9. [书籍翻译] 《JavaScript并发编程》 第二章 JavaScript运行模型

    本文是我翻译<JavaScript Concurrency>书籍的第二章 JavaScript运行模型,该书主要以Promises.Generator.Web workers等技术来讲解J ...

随机推荐

  1. 求组合数 C(n,m)

    下面内容转自: http://blog.csdn.net/zengaming/article/details/63681754 一.求解C(n, m) 公式一: 公式二: 公式二可以这么理解,从n个物 ...

  2. 洛谷P3694 邦邦的大合唱站队／签到题

    P3694 邦邦的大合唱站队/签到题 题目背景 BanG Dream!里的所有偶像乐队要一起大合唱,不过在排队上出了一些问题. 题目描述 N个偶像排成一列,他们来自M个不同的乐队.每个团队至少有一个偶 ...

  3. [Xcode 实际操作]三、视图控制器-(8)在Storyboard中设置初始化视图控制器

    目录:[Swift]Xcode实际操作 本文将演示如何设置故事板的初始视图控制器. 打开自动生成的默认故事板[Main.storyboard] 在打开的故事板中,系统已经生成了一个空白的视图控制器. ...

  4. 帝都Day4(2)——数据结构

    黄姓dalao is coming! 一.栈: 基本常识略. 例题:铁轨 模拟,O(n), Usaco2006 Nov 题目略 做法:单调栈(续命栈?) n//数量 a[]//奶牛 for(int i ...

  5. Effective Java第一节

    第1条:考虑用静态工厂方法代替构造器 首先清楚什么是静态工厂方法? 静态工厂方法说白了就是在创建对象的时候,不是自己使用new关键字创建的,而是使用静态方法来对外提供自身的实例的方法. 比如: Fra ...

  6. 问题 Can't load AMD 64-bit .dll on a IA 32-bit platform

    问题简要描述: java.lang.UnsatisfiedLinkError: F:\Tools\tomcat6045\tomcat6.0.45_x64\apache-tomcat-6.0.45\bi ...

  7. web综合案例02

    web综合案例02 web综合案例02 web综合案例02 ... ... 内容待添加

  8. TFS如何强制撤销别人的机器签出的文件

    原文:http://blog.csdn.net/jxian2009/article/details/50331955 用过TFS的都知道,没有比同事离职了,剩下一堆签出的文件更蛋疼的. 试过各种方法, ...

  9. 线段树模板（单点更新，区间更新，RMQ）

    Bryce1010模板 1.单点更新 说明 单点更新,区间求和(你问我单点求和??你就不会把区间长度设为0啊?) • sum[]为线段树,需要开辟四倍的元素数量的空间. • build()为建树操作 ...

  10. Unity Destroy和DestroyImmediate

    Destroy(Object obj, float t = 0.0F); 删除一个游戏对象,组件或者资源. 物体obj现在被销毁或在指定了t时间过后销毁.如果obj是组件,它将从GameObject销 ...