每日思考(2020/02/15)

Posted ericzlin

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了每日思考(2020/02/15)相关的知识,希望对你有一定的参考价值。

题目概览

  • 对target="_blank"的理解
  • 非标准的字体如何实现
  • 写个还剩下多少天过年的倒计时

题目解答

对target="_blank"的理解

  • 理解:在调用window下的open方法创建一个新窗口的同时,可以获得一个创建窗口的opener句柄,通过target="_blank"点开的窗口活着标签页,子窗口也能捕获opener句柄,通过这个句柄,子窗口可以访问到父窗口的一些属性,虽然很有限,但是却可以修改父窗口的页面地址,让父窗口显示指定的页面

  • 安全性问题防范

    • 如果需要限制window.opener的访问行为,我们只需要在原始页面每个使用了target="_blank"的链接中加上一个rel="noopener"属性
    • 但是,火狐并不支持这个属性值,火狐浏览器里需要写成rel="noreferrer",所以我们可以将两个属性值合并写成rel="noopener noreferrer"来完整覆盖。
    • nofollowhtml页面中a标签的属性值。这个标签的意义是告诉搜索引擎"不要追踪此网页上的链接或不要追踪此特定链接
    <a href="https://www.baidu.com" target="_blank" rel="noopener noreferrer nofollow">内容</a>

非标准的字体如何实现

  • 用图片代替
  • web fonts在线字库,如Google Webfonts,Typekit 等等
  • 注意:现在是知识付费时代,包括音乐、电影、书籍、软件等慢慢也开始收费,设计师的原创字体也开始要收费,所以要注意字体侵权问题,作为设计师和开发人员可以选择符合自己整体风格的免费字体,要在使用之前看清楚各方面条款和协议,达成共识。

写个还剩下多少天过年的倒计时

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"));

以上是关于每日思考(2020/02/15)的主要内容,如果未能解决你的问题,请参考以下文章

每日思考(2020/03/12)

一个类型思考了 8 年,依旧是最好的! | 每日趣闻

每日思考(2019/12/9)

每日思考(2019/12/29)

源哥每日一题第十五弹 poj 1190 关于深搜减枝以及对于阅读代码的思考

markdown 每日片段