重学前端
程劭非（winter）
前手机淘宝前端负责人
立即订阅
32956 人已学习
课程目录
已完结 58 讲
0/4登录后，你可以任选4讲全文学习。
开篇词+学习路线+架构图 (3讲)
开篇词 | 从今天起，重新理解前端
免费
明确你的前端学习路线与方法
列一份前端知识架构图
模块一：JavaScript (15讲)
JavaScript类型：关于类型，有哪些你不知道的细节？
JavaScript对象：面向对象还是基于对象？
JavaScript对象：我们真的需要模拟类吗？
JavaScript对象：你知道全部的对象分类吗？
JavaScript执行（一）：Promise里的代码为什么比setTimeout先执行？
JavaScript执行（二）：闭包和执行上下文到底是怎么回事？
JavaScript执行（三）：你知道现在有多少种函数吗？
JavaScript执行（四）：try里面放return，finally还会执行吗？
JavaScript词法：为什么12.toString会报错？
（小实验）理解编译原理：一个四则运算的解释器
JavaScript语法（预备篇）：到底要不要写分号呢？
JavaScript语法（一）：在script标签写export为什么会抛错？
JavaScript语法（二）：你知道哪些JavaScript语句？
JavaScript语法（三）：什么是表达式语句？
JavaScript语法（四）：新加入的**运算符，哪里有些不一样呢？
模块二：HTML和CSS (16讲)
HTML语义：div和span不是够用了吗？
HTML语义：如何运用语义类标签来呈现Wiki网页？
CSS语法：除了属性和选择器，你还需要知道这些带@的规则
HTML元信息类标签：你知道head里一共能写哪几种标签吗？
CSS 选择器：如何选中svg里的a元素？
CSS选择器：伪元素是怎么回事儿？
HTML链接：除了a标签，还有哪些标签叫链接？
CSS排版：从毕升开始，我们就开始用正常流了
HTML替换型元素：为什么link一个CSS要用href，而引入js要用src呢？
HTML小实验：用代码分析HTML标准
CSS Flex排版：为什么垂直居中这么难？
CSS动画与交互：为什么动画要用贝塞尔曲线这么奇怪的东西？
HTML语言：DTD到底是什么？
CSS渲染：CSS是如何绘制颜色的？
CSS小实验：动手做，用代码挖掘CSS属性
HTML·ARIA：可访问性是只给盲人用的特性么？
模块三：浏览器实现原理与API (9讲)
浏览器：一个浏览器是如何工作的？（阶段一）
浏览器：一个浏览器是如何工作的？（阶段二）
浏览器：一个浏览器是如何工作的（阶段三）
浏览器：一个浏览器是如何工作的？（阶段四）
浏览器：一个浏览器是如何工作的？（阶段五）
浏览器DOM：你知道HTML的节点有哪几种吗？
浏览器CSSOM：如何获取一个元素的准确位置
浏览器事件：为什么会有捕获过程和冒泡过程？
浏览器API（小实验）：动手整理全部API
模块四：前端综合应用 (5讲)
性能：前端的性能到底对业务数据有多大的影响？
工具链：什么样的工具链才能提升团队效率？
持续集成：几十个前端一起工作，如何保证工作质量？
搭建系统：大量的低价值需求应该如何应对？
前端架构：前端架构有哪些核心问题？
特别加餐 (9讲)
新年彩蛋 | 2019，有哪些前端技术值得关注？
用户故事 | 那些你与“重学前端”的不解之缘
期中答疑 | name(){}与name: function() {}，两种写法有什么区别吗？
答疑加餐 | 学了这么多前端的“小众”知识，到底对我有什么帮助？
加餐 | 前端与图形学
加餐 | 前端交互基础设施的建设
期末答疑（一）：前端代码单元测试怎么做？
期末答疑（二）：前端架构中，每个逻辑页面如何可以做到独立发布呢？
加餐 | 一个前端工程师到底需要掌握哪些技能？
尾声 (1讲)
尾声 | 长风破浪会有时，直挂云帆济沧海
重学前端
登录|注册

HTML链接：除了a标签，还有哪些标签叫链接？

winter 2019-03-12
你好，我是 winter。
在前面的课程中，我讲到了 HTML 的语义和元信息标签，今天这一课，我们来讲另一类 HTML 元素：链接。
链接这种元素可以说是占据了整个互联网。也正是因为无处不在的超链接，才让我们的万维网如此繁荣。没有了超链接的 HTML，最多可以称为富文本，没法称作超文本（hyper text）。
我想，作为互联网从业者，我们一定对链接都非常熟悉了。链接能够帮助我们从一个网页跳转到另一个网页。
不过，除了肉眼可见的这些链接，其实 HTML 里面还规定了一些不可见链接的类型，这节课，我就来给你介绍链接家族的全员，让你对它们有一个完整的认识。
链接是 HTML 中的一种机制，它是 HTML 文档和其它文档或者资源的连接关系，在 HTML 中，链接有两种类型。一种是超链接型标签，一种是外部资源链接。
链接的家族中有 a 标签、area 标签和 link 标签。今天，我会逐一对它们进行介绍。

link 标签

提到链接，我们都知道 a 标签可以成为超链接，但是我们今天的内容，要从一个大家不太熟悉的标签开始，也就是 link 标签。
我们已经介绍过元信息类标签。实际上，我们并没有介绍完全，有些 link 标签也是元信息类标签的一种。
我们已经讲过，HTML 标准并没有规定浏览器如何使用元信息，我们还讲到了元信息中有不少是被设计成“无需被浏览器识别，而是专门用于搜索引擎看的”。
取消
完成
0/1000字
划线
笔记
复制
© 版权归极客邦科技所有，未经许可不得传播售卖。 页面已增加防盗追踪，如有侵权极客邦将依法追究其法律责任。
该试读文章来自付费专栏《重学前端》，如需阅读全部文章，
请订阅文章所属专栏。
立即订阅
登录 后留言

精选留言(20)

  • 心雨
    有很多链接类型都没有用过,老师就这样点到为止我们也不知道能用来干什么,如果您能举例说平时哪些场景用哪些标签更好,这样就不会过目就忘,也容易理解记忆,在工作中也能有很大帮助,这样也能帮助我们买了课程的这些小伙伴省很多时间.
    2019-03-15
    41
  • cmyh
    老师您好，我有几点困惑，望您能指点迷津
    1.基本数据类型存放于栈空间中，对象存放于堆空间中，堆空间在内存里的存放是以链表的形式吗，物理地址不连续，但是逻辑地址是连续的？
    2.声明一个基本数据类型，存放于栈空间，但是使用的时候，又把它进行一次对象的转化，例如：var a="1"，实际操作的时候它又创建了一个String对象，那么这个基本数据类型a字符串_去哪了，它就没有用了吗？
    3.JavaScript中的null，是一个值还是一个地址，如果是值的话，那null是否有很多个，是地址的话，那说明null是指向一个唯一的一个地方？
    4.原型链中的prototype和__proto__，它们是指针吗，我认为它是指针，但是有前端小伙伴说它是一块连续的空间，每次声明一个变量都从object开始开辟一整套的空间，也就是说堆空间中可能会有很多的object
    5.最后一个问题是js垃圾回收机制标记清除算法中，它说从根节点出发进行可达节点遍历标记，那么这个根节点是从什么地方开始呢？是从全局的window或者global出发吗？如果null是一个唯一的空间，那么清除一个对象其实是把对象的值指向这块空间吗？
    2019-03-12
    19
  • 以勒
    link主要用来引入外部静态资源 和 记录标记页面的元信息帮助浏览器优化

    a 主要用在 页面内可见的 超链接

    area + map 用在 一张图片中部分区域需要做跳转时的情况。
    2019-03-12
    8
  • 阿成
    服了！
    我能说我之前听都没听说过area和map标签吗...
    真没想到小小链接竟然有这么多学问...
    且不说用不用得到，对整个知识体系有了一定的认识和了解。
    winter老师的课从来都是点到为止，而不是把所有东西都告诉我们。我们有了方向，就不怕迷路，自然胸有成竹。
    2019-03-12
    7
  • Semantha
    自从用了vue，项目中貌似没用过链接标签
    2019-03-14
    4
  • 王大可
    记得早年都是使用dreamweaver生成area和map代码，然后用在淘宝店铺上
    2019-03-12
    3
  • 王文银
    作为一个菜鸟，平时只用到了link
    链接样式和a标签跳转😂 😂 😂
    2019-03-12
    3
  • 子非鱼
    项目中使用了modulepreload，效果还是挺明显的
    2019-04-30
    2
  • Scorpio
    我好像只用过引入css标签，，。感觉自己菜到抠脚
    2019-03-12
    2
  • 乃乎
    加一个 manifest 吧
    2019-03-14
    1
  • 渴望做梦
    "opener 打开的网页可以使用 window.opener 来访问当前页面的 window 对象，这是 a 标签的默认行为。"
    老师，这句话没看明白， opener 是需要和 window.open 方法配合使用的，这个和 a 标签有什么关系呢？

    作者回复: 和a标签也能配合的

    2019-07-17
  • jacklovepdf
    把链接分为超链接类和外部资源类是作者自己的理解么，还是官方有这种分类呀，我没找到。
    2019-05-20
  • Geek_0bb537
    link预加载是开启单独一个线程加载的还是跟其它普通link一起排队一个一个加载
    2019-04-19
    1
  • Mr.杨
    area可以在项目太紧的情况下用，不过不推荐用
    2019-04-11
  • Sentry
    请问老师，页面资源的预加载是不是可以用link标签实现，还有其他的方式吗？
    2019-03-21
  • 田野的嘴好冰
    area没听说过，link方便搜索之类的也是第一次听说，还有a标签的rel 属性也是第一次看全
    2019-03-19
  • adrian-jser
    感谢作者。提神醒脑
    2019-03-19
  • F.
    老师， script 标签算不算半个链接标签呢
    2019-03-15
  • fape
    想起table时代用Dreamweaver可以在img上画热区能生成area，现在也就地图用这个标签了吧？
    使用link预加载感觉很有用，老师能结合实例多讲讲吗？
    2019-03-12
  • 有铭
    好多标签听都没停过，我感觉我只用到了html的一个子集
    2019-03-12
收起评论
20
下载
客户端
返回
顶部