记HTML5 <a> 标签的一个小坑
来源:互联网 发布:wave动作数据mmd 编辑:程序博客网 时间:2024/06/07 05:05
今天写了段简单的代码,点击<a>标签时却抛出了这个错误:Uncaught TypeError: download is not a function。代码如下:
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Test</title> <script> function download() { console.log(1); } </script></head><body> <a onclick="download()">下载</a></body></html>
<script>内明明已经定义了download函数,为什么还会报download is not a function的错误呢?
于是,按下面的步骤尝试排查问题:
- 把<a>标签换成别的标签,尝试了<button>标签,结果点击按钮后,download函数就可以正常执行了,说明download函数是存在的,问题还出在<a>上。
- 把<button>改回<a>,修改download函数名为download1,结果download1是可以正常执行的。再联系Uncaught TypeError: download is not a function,怀疑<a>标签onclick方法执行时,查找到的download并非外部定义的download函数,onclick执行时的上下文对象应该已经存在download的定义了,且这个定义是一个属性,而不是函数。
- 于是查了下w3c的文档,http://www.w3school.com.cn/tags/att_a_download.asp。 真相大白了,原来HTML 5 中的<a> 标签新增了一个download属性,规定被下载的超链接目标。所以,onclick执行时,download指向的是<a> 标签对象中的download属性,因此才会抛出上面的错误。
- 既然找到了问题的原因,除了避免使用download作为函数名外,很容易想到另外一个解决方案,通过window引用download函数:
<a onclick="window.download()">下载</a>
阅读全文
0 1
- 记HTML5 <a> 标签的一个小坑
- html5的a标签使用
- a标签改变图像的一个小应用
- html5标签的一些小总结
- HTML5 a标签的download属性
- HTML5 a标签的download属性
- HTML5 a标签的download属性
- HTML5小标签补充
- HTML5(a标签篇)
- mui下a标签href失效问题,以及a标签的其他小坑。
- 小强的HTML5移动开发之路(12)——从一个多媒体标签说起
- 小强的HTML5移动开发之路(12)——从一个多媒体标签说起
- HTML <a> 标签的小知识
- js中使用shiro标签的一个小坑
- HTML5 canvas标签的全屏、退出全屏,canvas中显示的缩放、移动,小坑盘点
- 一些html5,mysql,jacascript,jquery的小标签
- HTML5 <a> 标签及其相关
- HTML5 <a>标签download 属性
- python自然语言处理-广度优先搜索
- Docker实战:基于centos7镜像创建可以ssh链接的Docker容器
- HTTP与HTTPS的区别
- JSONObject 的使用
- jvm系列(七):jvm调优-工具篇
- 记HTML5 <a> 标签的一个小坑
- kettle设置数据库连接变量、js脚本设置变量、数据流合并、设置分支等
- mycat2.0配置文件 datasource.yml说明
- 作业
- Linux命令分析:tar
- android studio 常用快捷键
- 众里寻他千百度 哪家单位让你再见如初?这里上市公司、股份集团任你选 | 大数据周聘汇
- 马云要让“千亿达摩院”具备盈利能力,能做到吗?
- 【案例】中国银联、光大银行基于区块链的可信电子凭证系统