第五章 javascript编程可养成的好习惯
用户点击某个链接时弹出一个新窗口
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编程可养成的好习惯的更多相关文章
- 第五章 JavaScript对象及初识面向对象
第五章 JavaScript对象及初识面向对象 一.对象 在JavaScript中,所有事物都是对象,如字符串.数值.数组.函数等. 在JavaScript对象分为内置对象和自定义对象,要处理一些 ...
- 学习笔记 第十五章 JavaScript基础
第15章 JavaScript基础 [学习重点] 了解JavaScript基础知识 熟悉常量和变量 能够使用表达式和运算符 正确使用语句 能够掌握数据类型和转换的基本方法 正确使用函数.对象.数组 ...
- 第五章JavaScript
创建数组://1.字面量方式创建 (推荐大家使用这种方式创建数组 简单粗暴) var colors = ['red','color','yellow'];console.log(colors) //空 ...
- #《Essential C++》读书笔记# 第五章 面向对象编程风格
基础知识 继承机制定义了父子(parent/child)关系.父类(parent)定义了所有子类(children)共通的共有接口(public interface)和私有实现(private imp ...
- WindowsPE 第五章 导出表编程-1(枚举导出表)
导出表编程-1-枚举导出表 开始前先回忆一下导出表: 1.枚举dll函数的导出函数名字: 思路: (1)加载dll到内存里. (2)获取PE头,逐步找到可选头部. (3)然后找到里面的第一个结构(导出 ...
- 实践javascript美术馆的小案例,学习到的东西还是蛮多的,包括javascript编程中的预留退路、分离javascript、以及实现向后兼容等
javascript美术馆(改进2) 一.javascript编程过程中的好习惯 1.实现预留退路 js被禁掉,图片也可以显示出来,href属性带有图片路径 <script src=" ...
- [书籍翻译] 《JavaScript并发编程》第五章 使用Web Workers
本文是我翻译<JavaScript Concurrency>书籍的第五章 使用Web Workers,该书主要以Promises.Generator.Web workers等技术来讲解Ja ...
- JavaScript DOM编程艺术-学习笔记(第五章、第六章)
第五章: 1.题外话:首先大声疾呼,"js无罪",有罪的是滥用js的那些人.js的father 布兰登-艾克,当初为了应付工作,10天就赶出了这个js,事后还说人家js是c语言和s ...
- [书籍翻译] 《JavaScript并发编程》 第二章 JavaScript运行模型
本文是我翻译<JavaScript Concurrency>书籍的第二章 JavaScript运行模型,该书主要以Promises.Generator.Web workers等技术来讲解J ...
随机推荐
- luogu4168蒲公英(区间众数)
luogu4168蒲公英(区间众数) 给定n个数,m个区间询问,问每个询问中的众数是什么. 题面很漂亮,大家可以去看一下. 对于区间众数,由于区间的答案不能由子区间简单的找出来,所以似乎不能用树形结构 ...
- Java Web中相对路径与绝对路径的分析
一.相对路径与绝对路径 1.相对路径: 相对路径指的是相对于当前文件所在目录的路径! 相对路径易出问题: 当在页面间相互跳转时不会产生问题: 当从Servlet中转发到指定页面时,服务器会相对于当前S ...
- Python的自增运算与Python变量的浅析
一.关于Python的自增运算 学了C/C++后再学习Python,不自觉地就打出了自增运算符++,但是发现Python解释器不认识,查了下资料,发现Python中没有这个运算符.这里暂时不探讨自增运 ...
- Sqlyog问题
Sqlyog没有架构设计器的解决方法 更换注册码即可
- UIScrollView嵌套滑动手势冲突的简易实现
明确需求 现在有较多的商城类app有如下需求,界面上带有headerView,并且有一个barView可悬停,最下方为多个可左右滑动的tableView,具体可参考下图 另类实现 在网上关于此类需求的 ...
- 解决Spring JdbcTemplate调用queryForObject()方法结果集为空时报异常
JdbcTemplate用的时候发现一个问题:调用queryForObject()方法,如果没有查到东西则会抛一个异常:org.springframework.dao.EmptyResultDataA ...
- 《从0到1学习Flink》—— Flink Data transformation(转换)
前言 在第一篇介绍 Flink 的文章 <<从0到1学习Flink>-- Apache Flink 介绍> 中就说过 Flink 程序的结构 Flink 应用程序结构就是如上图 ...
- java 核心技术 读后总结
总结 1.少用八进制,以及二进制. 那么就是直接用16进制或10进制吗?额,想当年有这样搞过,后面就uuid了. 2.>>>用0填充高位>>用符号位填充高位<< ...
- c#写word文档基础操作(自己控制样式)
下面一个函数,建立一个Word 文档,添加页眉.页脚,在内容中两个不同字体的Hello!!! 来自 <http://bbs.csdn.net/topics/340041961> pub ...
- 禁止Asp.Net WebService 的Test页面功能
只需要Web.Config里面添加: <system.web> <webServices> <protocols> <remove name="Ht ...