整合营销服务商
电脑端+手机端+微信端=数据同步管理
免费咨询热线：
电脑端+手机端+微信端=数据同步管理
免费咨询热线：
Base 对象
Base 对象代表 HTML 的 base 元素。
base 元素适用页面中于指定的默认地址或者所有链接的目标地址。
在 HTML 文档中 <base> 每出现一次，Base 对象就会被创建。
Base 对象属性
W3C： W3C 标准。
| 属性 | 描述 | W3C |
|---|---|---|
| href | 设置或返回针对页面中所有链接的基准 URL。 | Yes |
| target | 设置或返回针对页面中所有链接的默认目标框架。 | Yes |
标准属性和事件
Base 对象同样支持标准的 属性 和 事件。
如您还有不明白的可以在下面与我留言或是与我探讨QQ群308855039，我们一起飞！
果你是一个前端工程师，图片的处理你是肯定要会的，关于图片的Base64编码，你可能有点陌生，但是这是一个前端工程师应该要掌握的知识点，今天我们就一起来看一下吧。
Base64
Base64编码
那么什么是Base64编码呢？
Base64编码是一种图片处理格式，通过特定的算法将图片编码成一长串字符串，在页面上显示的时候，可以用该字符串来代替图片的url属性。
我们可以来看一下实际的效果
Base64编码效果
在上图中，我们可以看出img的src属性开头是data:image/png;base64，这种开头表示的就是Base64编码后的图片格式，鼠标放在src属性上，可以看出实际的图片。
图片采用Base64编码后的字符串非常长，这里截取一部分来看下效果
Base64编码的部分字符串
真实的全部字符串会比这长的多，可能达到几十KB
当然，Base64编码并不只是用在图片处理上，还可以用在URL转换上，比如说我们常见的迅雷以thunder开头的专用地址，就是通过Base64加密处理过后的URL地址，如下图所示
Base64处理后的URL
为何使用Base64编码
存在及必然，那么我们为什么要使用Base64编码呢？
1.其中很重要的一点就是，使用Base64编码可以减少网络请求。
我们都知道，网页上的图片资源如果采用http形式的url的话都会额外发送一次请求，网页发送的http请求次数越多，会造成页面加载速度越慢。而采用Base64格式的编码，将图片转化为字符串后，图片文件会随着html元素一并加载，这样就可以减少http请求的次数，对于网页优化是一种比较好的手段。
2.采用Base64编码的图片是随着页面一起加载的，不会造成跨域请求的问题。
3.不会造成清理图片缓存的问题
Base64编码劣势
Base64编码既有优势也有劣势，上述已经说了Base64编码的优势，接下来看看劣势。
1.当我们将一个只有几KB的图片转化为Base64格式编码，生成的字符串往往会大于几KB，如果将其写在一个css文件中，这样一个css文件的大小会剧增，造成代码可读性差不说，还会造成请求传输的数据量递增。
2.如果我们将Base64位的编码的图片存入数据库中，会造成数据库数据量的增大，这样的效果还不如将图片存至图片服务器，而只在数据库中存入url字段。
3.对于IE8以下的浏览器，不支持data url格式，IE8开始支持data url，却对大小作出了限制，在使用时不是很方便。
如何使用
分析了Base64编码的优劣，那么我们该如何正确的使用Base64编码呢？这里总结出使用Base64编码的几个地方。
对于极小或者极简单的图片，例如只有几像素的图片
不用考虑跨域问题
不想页面的图片缓存
总结
关于Base64编码的图片，有其优势，也有劣势，需要我们自己总结，
今天的内容，了解了吗？
例
规定页面上所有链接的默认 URL 和默认目标：
<head><basehref="http://www.runoob.com/images/"target="_blank"></head><body><imgsrc="logo.png"width="24"height="39"alt="Stickman"><ahref="http://www.runoob.com">runoob.com</a></body>
浏览器支持
所有主流浏览器都支持 <base> 标签。
标签定义及使用说明
<base> 标签为页面上的所有的相对链接规定默认 URL 或默认目标。
在一个文档中，最多能使用一个 <base> 元素。<base> 标签必须位于 <head> 元素内部。
提示和注释
提示：请把 <base> 标签排在 <head> 元素中第一个元素的位置，这样 head 区域中其他元素就可以使用 <base> 元素中的信息了。
注释：如果使用了 <base> 标签，则必须具备 href 属性或者 target 属性或者两个属性都具备。
HTML 4.01 与 HTML5之间的差异
无。
HTML 与 XHTML 之间的差异
在 HTML 中，<base> 标签没有结束标签。
在 XHTML 中，<base> 标签必须被正确地关闭。
属性
| 属性 | 值 | 描述 |
|---|---|---|
| href | URL | 规定页面中所有相对链接的基准 URL。 |
| target | _blank_parent_self_topframename | 规定页面中所有的超链接和表单在何处打开。该属性会被每个链接中的 target 属性覆盖。 |
全局属性
<base> 标签支持 HTML 的全局属性。
事件属性
<base> 标签不支持任何的事件属性。
相关文章
HTML DOM 参考手册： Base 对象
如您还有不明白的可以在下面与我留言或是与我探讨QQ群308855039，我们一起飞！
*请认真填写需求信息，我们会在24小时内与您取得联系。
