A标签执行JS脚本
前言
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函数最适当的方法推荐使用后几种,注意第四种会返回页面最顶端,当有这种需求时可以使用。
A标签执行JS脚本的更多相关文章
- AngularJs中,如何在render完成之后,执行Js脚本
AngularJs是Google开源的前端JS框架.使用AngularJs, 我们能够容易地.健壮的开发出类似于Gmail一样的单页Web应用.AngularJs这个新兴的MVC前端框架,具有以下特点 ...
- 异步执行js脚本——防止阻塞
JS允许我们修改页面中的所有方面:内容,样式和用户进行交互时的行为. 但是js同样可以阻塞DOM树的形成并且延迟页面的渲染. 让你的js变成异步执行,并且减少不必要的js文件从而提高性能. JavaS ...
- 在java代码中执行js脚本,实现计算出字符串“(1+2)*(1+3)”的结果
今天在公司项目中,发现一个计算运费的妙招.由于运费规则各种各样,因此写一个公式存到数据库.下次需要计算运费时,直接取出这个公式,把公式的未知变量给替换掉,然后计算出结果就是ok了. 一 ...
- Angular在render完成之后,执行Js脚本
AngularJs中,如何在render完成之后,执行Js脚本 app.directive('onFinishRenderFilters', function ($timeout) { return ...
- js 点击超链接,执行js脚本,而不进行url跳转
<!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml"><head><meta ...
- 自动化测试中执行JS脚本方法封装
执行JS脚本方法封装: class JavaScript(Base): def execute_javascript(self, js): """执行 JavaScrip ...
- selenium webdriver学习(三)------------执行js脚本
selenium webdriver学习(三)------------执行js脚本 博客分类: Selenium-webdriver 在用selenium 1.X的时候常常会用到getEval() ...
- Selenium执行js脚本
如何使用Selenium来执行Javascript脚本呢 Selenium中提供了一个方法:execute_script 来执行js脚本 return 可以返回js的返回结果 execute_scri ...
- Java8中执行js脚本
代码中除了callJSFunctionFromFile函数,其他均转载于文章JDK1.8中如何用ScriptEngine动态执行JS import jdk.nashorn.api.scripting. ...
随机推荐
- Where does Windows store MSI files for uninstallation?
Original link: Where does Windows store MSI files for uninstallation? Following content are only use ...
- OpenJudge 2739 计算对数
1.链接地址: http://bailian.openjudge.cn/practice/2739/ 2.题目: 总时间限制: 1000ms 内存限制: 65536kB 描述 给定两个正整数a和b.可 ...
- 建造者模式(Builder Pattern)
建造者模式:使用多个简单对象一步步构建成一个复杂的对象. 有时候,我们会创建一个“复杂”的对象,这个对象的由很多子对象构成,由于需求的变化,这个对象的各个部分经常面临剧烈的变化. 继续工厂模式的披萨店 ...
- MySQL复制(三) --- 高可用性和复制
实现高可用性的原则很简单: 冗余(Redundancy):如果一个组件出现故障,必须有一个备用组件.这个备用组件可以是standing by的,也可以是当前系统部署中的一部分. 应急计划(Contig ...
- ajax、json一些整理(2)
<script type="text/javascript"> $(document).ready(function(){ $("#btn").cl ...
- 图片裁切插件jCrop的使用心得(二)
上一篇简单的介绍了一下开发的背景以及一些学习资料,下面开始介绍如何上手. 一.下载jCrop http://deepliquid.com/content/Jcrop_Download.html 直接去 ...
- webApi实现增删改查操作
1.WebApi是什么 ASP.NET Web API 是一种框架,用于轻松构建可以由多种客户端(包括浏览器和移动设备)访问的 HTTP 服务.ASP.NET Web API 是一种用于在 .NET ...
- Yii框架下使用redis做缓存,读写分离
Yii框架中内置好几个缓存类,其中有memcache的类,但是没有redis缓存类,由于项目中需要做主从架构,所以扩展了一下: /** * FileName:RedisCluster * 配置说明 * ...
- platform_driver_register()--如何match之后调用probe
int platform_driver_register(struct platform_driver *drv) { drv->driver.bus = &platform_bus_t ...
- 修改oracle数据库为归档模式
参考博客:http://blog.csdn.net/codesaint/article/details/1901030 Oracle分为非归档模式(NOARCHIVELOG) 和归档模式(ARCHI ...