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. ...
随机推荐
- js闭包的使用例子
网上关于闭包的介绍太多,这就导致了泛滥,对于新手来说,网上好多讲解就说了闭包是啥,还都是用下面这种例子: 我的天啊,我们都看了不知道多少遍了,看完有啥用?在什么场合下用啊? 于是我翻阅各种资料,自己总 ...
- 实习笔记-3:ef实体操作错误篇
学习笔记 1.json序列化ef实体是报错:“序列化类型为“System.Data.Entity.DynamicProxies.XXXX.... 对象时检测到循环引用.” 公司里用ef来生成实体.但是 ...
- SQL技巧之分类汇总
数据表结构username type numaaaa 玉米 1212aaaa 玉米 212bbb 小麦 2323bbb .... 只有两种产品 玉米和小麦,玉米价格1.5,小麦价格 ...
- C# Form窗体子窗口关闭时刷新父窗体中的datagridview
解决该问题可以用委托,但是还有更简单方便的两种方法: 方法一:将主窗体实例保存到子窗体 show form2的时候设置一下 owner为form1 Form2 f2 = new Form2(); / ...
- [PHP]htmlentities() 函数
定义和用法 htmlentities() 函数把字符转换为 HTML 实体. 语法 htmlentities(string,quotestyle,character-set) 参数 描述 string ...
- #Leet Code# Gray Code
描述: 要求相邻数2进制差一位 先获得n-1的列表表示小于 2^(n-1) 的符合要求的列表,加上最高位的加成 2^(n-1) 就是大于等于 2^(n-1) 的符合要求的列表,后者翻转一下就能够与前者 ...
- Open CASCADE 基础类(Foundation Classes)
1 介绍(Introduction) 1 如何使用Open CASCADE技术(OCCT)基础类. This manual explains how to use Open CASCADE Techn ...
- VM 启动时报错:Failed to lock the file
http://www.cnblogs.com/kristain/articles/2491966.html Reason: Failed to lock the fileGoogle 了一下, 在網路 ...
- Sublime Text 3插件之Emmet:HTML/CSS代码快速编写神器
一.快速编写HTML代码 1. 初始化 HTML文档需要包含一些固定的标签,比如<html>.<head>.<body>等,现在你只需要1秒钟就可以输入这些标签. ...
- LCA——倍增求解
LCA,即最近公共祖先,用于解决树上两点的最近公共祖先问题. ; lca(1,2)=3;(原谅我的绘画水平) LCA的求解有三种算法(我知道的)——tarjan,倍增,线段树(我只会两种),NOIp之 ...