<a download="" href="http://www.miracleart.cn/link/8b89afaf8e00e0a46ea4d76ac473b1a2">下載</a>

function download(url) {
  const link = document.createElement("a");
  link.download = "file name";
  link.href = url;
  document.body.appendChild(link);
  link.click();
  document.body.removeChild(link);
}

?? ??? Blob ? createObjectURL? ???? ???? ??? ?? ??? ??? ?? ????.

const data = JSON.stringify({ message: "Hello" });
const blob = new Blob([data], { type: "application/json" });
const url = window.URL.createObjectURL(blob);
download(url);
window.URL.revokeObjectURL(url);

9. ??? ??

??? ??? ?? ?? ?? ?????.

const memoize = (fn) =>
  (
    (cache = Object.create(null)) =>
    (arg) =>
      cache[arg] || (cache[arg] = fn(arg))
  )();
// 代碼示例 (此處省略)

10. ?? ? ???

CSS? ???? ?? ?? ?? ?? ???? ???? ????.

.truncate-single {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.truncate-multi {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}

11. ??? ? ?? ?? ??

?? ??? ?????? CSS ???? ?????.

li:nth-child(-n + 3) {
  text-decoration: underline;
}
// 代碼示例 (此處省略)

12. ???? ???

CSS? better-scroll? ?? ?? ?????? ???? ??? ?? ???? ???????.

// 代碼示例 (此處省略)

13. ??? ??-?? ??? ??

?? ??? ??? ???? ???? ?? 1? ??? ???.

// 代碼示例 (此處省略)

14. ??? ??

?? ?? ?? ?? ?? ?? ?? ?????.

const formatSeconds = (s) =>
  [parseInt(s / 60 / 60), parseInt((s / 60) % 60), parseInt(s % 60)].join(":").replace(/\b(\d)\b/g, "0");
const seconds = 3661;
console.log(formatSeconds(seconds));

15. UUID ??

? ??? ???? ?? ???? ?????.

const getUrlParams = (query) =>
  Array.from(new URLSearchParams(query)).reduce(
    (p, [k, v]) => Object.assign({}, p, { [k]: p[k] ? (Array.isArray(p[k]) ? p[k] : [p[k]]).concat(v) : v }),
    {}
  );
const query = "?a=1&b=2&a=3";
console.log(getUrlParams(query));

16. ?? ?? ? ?? ??? ??

??? ? ? ?? ???? ?????.

<a href="https://example.com" rel="noopener noreferrer" target="_blank">打開</a>