文档章节

A标签执行JS脚本

Seabiscuit彡
 Seabiscuit彡
发布于 2014/11/19 17:57
字数 566
阅读 40
收藏 0

前言

A标签是html中常用的标签,它与button按钮是实现页面跳转的两种最常用的方式,经常在开发中我们更喜欢使用A标签,它们两者可以相互替换,但他们在执行js脚本时有着细微的区别。

使用A标签执行JS脚本的几种方式

1、href="javascript:js_method();"
这是我们最常用的方法,但是这种方法在传递this等参数的时候很容易出问题,而且javascript:协议作为a的href属性的时候不仅会导致不必 要的触发window.onbeforeunload事件,在IE里面更会使gif动画图片停止播放。W3C标准不推荐在href里面执行 javascript语句。

2、href="javascript:void(0);" onclick="js_method()"
这种方法是很多网站最常用的方法,也是最周全的方法,onclick方法负责执行js函数,而void是一个操作符,void(0)返回undefined,地址不发生跳转。而且这种方法不会像第一种方法一样直接将js方法暴露在浏览器的状态栏,推荐使用此方法。

3、href="javascript:;" onclick="js_method()"
这种方法跟跟第2种类似,区别只是执行了一条空的js代码。Href与onclick区别是每个href里的javascript方法都用try、catch包围。

4、href="#" onclick="js_method()"
这种方法也是网上很常见的代码,#是标签内置的一个方法,代表top的作用。所以用这种方法点击后网页后返回到页面的最顶端。

5、href="#" onclick="js_method();return false;"
这种方法点击执行了js函数后return false,页面不发生跳转,执行后还是在页面的当前位置。
综合上述,在a中调用js函数最适当的方法推荐使用后几种,注意第四种会返回页面最顶端,当有这种需求时可以使用。


本文转载自:http://blog.csdn.net/bbirdsky/article/details/8435503

上一篇: SQL模糊查询
Seabiscuit彡
粉丝 1
博文 15
码字总数 0
作品 0
武汉
程序员
私信 提问
JavaScript基础(一)概述

JavaScript 概述 JS作用 验证表单(以前的网速慢) 页面特效(PC端的网页效果) 移动端(移动web和app) 异步和服务器交互(AJAX) 服务端开发(nodejs) 语言类型 js是一种脚本语言,不仅是...

fengdaoting
2018/05/03
0
0
异步加载script,提高前端性能(defer和async属性的区别)

一、异步加载script的好处 为了加快首屏响应速度,前端会采用代码切割、按需加载等方式优化性能。异步加载script也是一种前端优化的手段。 就好比如果我的页面其中一个功能需要打开地图,但是地...

xiaobe
2018/08/22
0
0
网页性能优化之异步加载js文件

一个网页的有很多地方可以进行性能优化,比较常见的一种方式就是异步加载js脚本文件。在谈异步加载之前,先来看看浏览器加载js文件的原理。 浏览器加载 JavaScript 脚本,主要通过元素完成。...

酥风
2018/10/23
0
0
细谈在HTML中使用JavaScript

细谈在HTML中使用JavaScript 前言 JavaScript是浏览器的内置脚本语言。当网页中嵌入了JavaScript脚本,浏览器加载网页时,就会执行脚本,从而操作浏览器,实现各种动态效果 JavaScript代码嵌...

幸运券发放
2018/05/25
0
0
高性能Javascript--脚本的无阻塞加载策略

Javascript在浏览器中的性能,可以说是前端开发者所要面对的最重要的可用性问题。 在Yahoo的Yslow23条规则当中,其中一条是将JS放在底部 。原因是,事实上,大多数浏览器使用单进程处理UI和更...

Junn
2014/10/10
0
2

没有更多内容

加载失败,请刷新页面

加载更多

Cesium中级4 - 空间数据可视化(二)

Cesium中文网:http://cesiumcn.org/ | 国内快速访问:http://cesium.coinidea.com/ Viewer中的Entity功能 让我们看看Viewer为操作entities提供出来的功能函数。 选中和描述 点击Viewer中的e...

Cesium中文网
15分钟前
1
0
Linux-CentOS7 安装VMware Workstation

Linux-CentOS7 安装VMware Workstation 太极之道关注0人评论1605人阅读2018-10-17 14:36:22 Linux-CentOS7 安装VMware Workstation 12 1、下载VMware 衔接地址 http://www.vmware.com/produc......

linjin200
17分钟前
1
0
centos7.5 部署flask+nginx+uwsgi+python3

centos7.5 部署flask+nginx+uwsgi+python3 ## uwsgi [uwsgi] master = true max-requests = 6000 processes = 6 threads = 6 chmod-socket = 664 thunder-lock = true buffer-size = 32768 #......

丁典
21分钟前
2
0
BigData NoSQL —— ApsaraDB HBase数据存储与分析平台概览

一、引言 时间到了2019年,数据库也发展到了一个新的拐点,有三个明显的趋势: 越来越多的数据库会做云原生(CloudNative),会不断利用新的硬件及云本身的优势打造CloudNative数据库,国内以阿...

阿里云官方博客
26分钟前
1
0
好代码是什么样的?

简评: 好代码是什么样的?相信不同的人会有不同的看法,正如「一千个读者,就有一千个哈姆雷特」,关键在于你有没有自己的标准。 这篇文章是我个人很喜欢的一家公司 - Atomic Spin 的 blog...

极光推送
26分钟前
3
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部