你不知道的js
1、<a>标签
(1)href属性包含超链接或超链接指向的URL或URL片段,URL 片段是哈希标记(#)前面的名称,哈希标记指定当前文档中的内部目标位置(HTML 元素的 ID)。URL 不限于基于 Web(HTTP)的文档,也可以使用浏览器支持的任何协议。例如,在大多数浏览器中正常工作的file:、ftp:和mailto:。
(2)可以使用 href="#top" 或者 href="#" 链接返回到页面顶部(HTML5)
(3)创建一个可点击的图片
<a href="https://developer.mozilla.org/en-US/">
<img src="https://mdn.mozillademos.org/files/6851/mdn_logo.png"
alt="MDN logo" />
</a>
(4)创建一个email链接
<a href="mailto:nowhere@mozilla.org">Send email to nowhere</a>
点击将用户的电子邮件程序打开,让他们发送新邮件
(5)创建电话链接
<a href="tel:+491570156">+49 157 0156</a>
(6)使用download属性将<canvas>保存为PNG格式
如果你想允许用户下载一个HTML画布,你可以创建一个下载属性和画布数据作为文件URL链接图像
var link = document.createElement('a');
link.innerHTML = 'download image';
link.addEventListener('click', function(ev) {
link.href = canvas.toDataURL();
link.download = "mypainting.png";
}, false);
document.body.appendChild(link);
(7)最好不要滥用<a href="javascript:;"></a>,使用<button></button>代替,<a>最好只用于正常的URL导航
2、Blob
Blob 对象表示一个不可变、原始数据的类文件对象
Blob()构造函数允许用其它对象创建 Blob 对象。比如,用字符串构建一个 blob:
var debug = {hello: "world"};
var blob = new Blob([JSON.stringify(debug, null, 2)],
{type : 'application/json'});
使用 Blob 创建一个指向类型化数组的URL
var url = URL.createObjectURL(blob);
// 会产生一个类似blob:d3958f5c-0777-0845-9dcf-2cb28783acaf 这样的URL字符串
// 你可以像使用一个普通URL那样使用它,比如用在img.src上。
3、html元素的id里如果包含斜杠(/),用querySelector()等选择器时会报错,所以要对斜杠进行转义,key.replace('/', '\\/')
你不知道的js的更多相关文章
- 翻译连载 | 第 9 章:递归(下)-《JavaScript轻量级函数式编程》 |《你不知道的JS》姊妹篇
原文地址:Functional-Light-JS 原文作者:Kyle Simpson-<You-Dont-Know-JS>作者 关于译者:这是一个流淌着沪江血液的纯粹工程:认真,是 HTM ...
- 翻译连载 | 第 10 章:异步的函数式(上)-《JavaScript轻量级函数式编程》 |《你不知道的JS》姊妹篇
原文地址:Functional-Light-JS 原文作者:Kyle Simpson-<You-Dont-Know-JS>作者 关于译者:这是一个流淌着沪江血液的纯粹工程:认真,是 HTM ...
- 翻译连载 | 第 10 章:异步的函数式(下)-《JavaScript轻量级函数式编程》 |《你不知道的JS》姊妹篇
原文地址:Functional-Light-JS 原文作者:Kyle Simpson-<You-Dont-Know-JS>作者 关于译者:这是一个流淌着沪江血液的纯粹工程:认真,是 HTM ...
- 翻译连载 | 第 11 章:融会贯通 -《JavaScript轻量级函数式编程》 |《你不知道的JS》姊妹篇
原文地址:Functional-Light-JS 原文作者:Kyle Simpson-<You-Dont-Know-JS>作者 关于译者:这是一个流淌着沪江血液的纯粹工程:认真,是 HTM ...
- 翻译连载 | 附录 A:Transducing(上)-《JavaScript轻量级函数式编程》 |《你不知道的JS》姊妹篇
原文地址:Functional-Light-JS 原文作者:Kyle Simpson-<You-Dont-Know-JS>作者 关于译者:这是一个流淌着沪江血液的纯粹工程:认真,是 HTM ...
- 翻译连载 | 附录 A:Transducing(下)-《JavaScript轻量级函数式编程》 |《你不知道的JS》姊妹篇
原文地址:Functional-Light-JS 原文作者:Kyle Simpson-<You-Dont-Know-JS>作者 关于译者:这是一个流淌着沪江血液的纯粹工程:认真,是 HTM ...
- 翻译连载 | 附录 B: 谦虚的 Monad-《JavaScript轻量级函数式编程》 |《你不知道的JS》姊妹篇
原文地址:Functional-Light-JS 原文作者:Kyle Simpson-<You-Dont-Know-JS>作者 关于译者:这是一个流淌着沪江血液的纯粹工程:认真,是 HTM ...
- 翻译连载 | 附录 C:函数式编程函数库-《JavaScript轻量级函数式编程》 |《你不知道的JS》姊妹篇
原文地址:Functional-Light-JS 原文作者:Kyle Simpson-<You-Dont-Know-JS>作者 关于译者:这是一个流淌着沪江血液的纯粹工程:认真,是 HTM ...
- 你不知道的JS之 this 和对象原型(一)this 是什么
原文:你不知道的js系列 JavaScript 的 this 机制并没有那么复杂 为什么会有 this? 在如何使用 this 之前,我们要搞清楚一个问题,为什么要使用 this. 下面的代码尝试去 ...
- 你不知道的JS之作用域和闭包 附录
原文:你不知道的js系列 A 动态作用域 动态作用域 是和 JavaScript中的词法作用域 对立的概念. 动态作用域和 JavaScript 中的另外一个机制 (this)很相似. 词法作用域是 ...
随机推荐
- 转载:gc的概念,如果A和B对象循环引用,是否可以被GC?
原文:https://www.cnblogs.com/zhchoutai/p/6784929.html ①首先说一下,GC里边在JVM其中是使用的ROOT算法,ROOT算法,什么称作为ROOT呢,就是 ...
- 转载:《RESTful API 设计指南》 阮一峰
原文:http://www.ruanyifeng.com/blog/2014/05/restful_api 网络应用程序,分为前端和后端两个部分.当前的发展趋势,就是前端设备层出不穷(手机.平板.桌面 ...
- Ex 6_12 凸多边形的最优三角剖分..._第六次作业
假设顶点的总数为n,从0到n-1. 从序号为0的顶点开始以逆时针方向排序,对于 令子问题A[i,j]为包含顶点i,i+1, . . . j的凸多边形的最小三角剖分代价,dist(i,j)为顶点i到顶点 ...
- 输入年月日判断是当年第几天(if判断)
- java多线程快速入门(十三)
死锁产生的原因(必须有两个线程.必须有多个锁.锁之间必须有引用的过程) package com.cppdy; class MyThread9 implements Runnable { private ...
- BN(Batch Normalization)
Batch Nornalization Question? 1.是什么? 2.有什么用? 3.怎么用? paper:<Batch Normalization: Accelerating Deep ...
- 性能测试十五:liunx下搭建(tomcat+项目+jmete命令行)
单机 准备工作: 1.压力机安装并配置好JDK,输入java和javac验证环境变量 2.上传jmeter到liunx下: 准备好jmeter的压缩包 在第三方工具中对linux文件上传下载(需先装好 ...
- python接口自动化测试四:代码发送HTTPS请求
HTTPS: get: url = 'https://www.juhe.cn/docs/api/id/39' r = requests.get(url) # ...
- 腾讯浏览服务X5内核集成
腾讯浏览服务X5内核集成https://www.jianshu.com/p/8a7224ff371a TBS 腾讯浏览器服务接入文档https://x5.tencent.com/tbs/guide/s ...
- Springboot实现热部署
所谓的热部署:比如项目的热部署,就是在应用程序在不停止的情况下,实现新的部署 而Springboot在我们每次修改完代码之后,可能只是修改下打印的信息,就得重新启动App类,这样太浪费时间,有没有一种 ...