第四十五天（2018-09-17）
- [html] 说说你对target="_blank"的理解？有啥安全性问题？如何防范？
- [css] 假如设计稿使用了非标准的字体，你该如何去实现它？
- [js] 写个还剩下多少天过年的倒计时
- [软技能] 你有遇到过字体侵权的事吗？如何解决？
题目一：
问题
在调用window下的open方法创建一个新窗口的同时，可以获得一个创建窗口的opener句柄，通过target="_blank"点开的窗口活着标签页，子窗口也能捕获opener句柄，通过这个句柄，子窗口可以访问到父窗口的一些属性，虽然很有限，但是却可以修改父窗口的页面地址，让父窗口显示指定的页面。
防范
如果需要限制window.opener的访问行为，我们只需要在原始页面每个使用了target="_blank"的链接中加上一个rel="noopener"属性。
但是，火狐并不支持这个属性值，火狐浏览器里需要写成rel="noreferrer"，所以我们可以将两个属性值合并写成rel="noopener noreferrer"来完整覆盖。
<a href="https://www.baidu.com" target="_blank" rel="noopener noreferrer nofollow">内容</a>
nofollow 是HTML页面中a标签的属性值。这个标签的意义是告诉搜索引擎"不要追踪此网页上的链接或不要追踪此特定链接"。
我理解的就是：
html是名词--表现
css是形容词--结构
javascript是动词--行为
以上这三个东西就形成了一个完整的网页，但是js改变时，可以会造成css和html的混乱，让这三个的界限不是那么清晰。
这个时候，web标准就出来了，web标准一般是将该三部分独立分开，使其更具有模块化。
W3C对web标准提出了规范化的要求，也就是在实际编程中的一些代码规范：包含如下几点
1.对于结构要求：（标签规范可以提高搜索引擎对页面的抓取效率，对SEO很有帮助）
标签字母要小写
标签要闭合
标签不允许随意嵌套
2.对于css和js来说
尽量使用外链css样式表和js脚本。是结构、表现和行为分为三块，符合规范。同时提高页面渲染速度，提高用户的体验。
样式尽量少用行间样式表，使结构与表现分离，标签的id和class等属性命名要做到见文知义，标签越少，加载越快，用户体验提高，代码维护简单，便于改版
这里顺便解释下什么是web标签语义化，即用正确的标签做正确的事情。
比如：
W3C组织意识到了之前HTML版本的不足，推出的HTML5进一步推进了Web语义化发展，采用了诸如footer、section等语义化标签，弥补了采用id="footer"或者class="footer"形式的不足，以更好的推动Web的发展。
题目二：
协商解决, 如果是重要信息, 如logo等, 使用图片, iconfont.
题目三：
const countDown = (range = "day") => {
const nowDate = new Date();
const currentYear = nowDate.getFullYear();
const nextYear = new Date(currentYear + 1, 1, 1);
const rangeBase = {
minute: 1000 * 60,
hour: 1000 * 60 * 60,
day: 1000 * 60 * 60 * 24,
week: 1000 * 60 * 60 * 24 * 7,
month: 1000 * 60 * 60 * 24 * 30
};
return Math.floor(
(nextYear.valueOf() - nowDate.valueOf()) /
(rangeBase[range] || rangeBase.day)
);
};
console.log(countDown("hour"));
console.log(countDown());
console.log(countDown("week"));
console.log(countDown("month"));
题目四：
起因：我们公司官网的某几个图中使用了**字体。
经过：刚开始产品可能没有什么知名度，所以一直相安无事。
突然有一天，公司收到了律师邮件，说是使用版权文字，限多少天内修改，否则就要付费，一个字每月还是每天来着，多少多少钱，反正挺贵的。
结果：把图片中文字改为标准黑体，结束了。
