美文网首页
前端小技巧归类 - 会持续补充

前端小技巧归类 - 会持续补充

作者: 鹿简luz | 来源:发表于2021-10-27 10:35 被阅读0次
我是勤劳的代码搬运工

复制

方法:
            copyToClipboard(text){
                return navigator.clipboard.writeText(text);
            },
调用:
            this.copyToClipboard("Hello world");

检查日期是否合法

方法:
const isDateValid = (...val) => !Number.isNaN(new Date(...val).valueOf());
调用:
isDateValid("December 17, 1995 03:24:00");
// Result: true

计算两个日期之间相差多少天

方法:
const dayDif = (date1, date2) => Math.ceil(Math.abs(date1.getTime() - date2.getTime()) / 86400000)
调用:
dayDif(new Date("2020-10-21"), new Date("2021-10-22"))
// Result: 366

查找日期位于一年中的第几天

方法:
const dayOfYear = (date) =>
    Math.floor((date - new Date(date.getFullYear(), 0, 0)) / 1000 / 60 / 60 / 24);
调用:
dayOfYear(new Date());
// Result: 272

获取路径查询参数

const getParameters = (URL) => {
  URL = JSON.parse(
    '{"' +
      decodeURI(URL.split("?")[1])
        .replace(/"/g, '\\"')
        .replace(/&/g, '","')
        .replace(/=/g, '":"') +
      '"}'
  );
  return JSON.stringify(URL);
};

调用:
getParameters(window.location);
// Result: { search : "easy", page : 3 }

数字取整

let floatNum = 100.5;
let intNum = ~~floatNum;

console.log(intNum); // 100

H5语音合成

<!DOCTYPE html>
<input id="btn1" type="button" value="点我" onclick="test();" />
<script>
 function test() {
   const sos = `阿尤!不错哦`;
   const synth = window.speechSynthesis;
   let msg = new SpeechSynthesisUtterance(sos);
   synth.speak(msg)
 }
</script>

解决苹果手机打开静音键情况下,语音播放也静音问题

// #ifdef MP-WEIXIN
      wx.setInnerAudioOption({
        obeyMuteSwitch: false,
      });
    // #endif

相关文章

  • 前端小技巧归类 - 会持续补充

    我是勤劳的代码搬运工 复制 检查日期是否合法 计算两个日期之间相差多少天 查找日期位于一年中的第几天 获取路径查询...

  • 前端开发小技巧(随时补充)

    段落限制行数 text-overflow: -o-ellipsis-lastline;overflow: hidd...

  • 云公司 - jf项目 前端使用手册

    前端使用手册 前言 该文档的目的,是想要前端开发人员可以快速上手整个项目的开发。(会持续补充) 项目的基本目录结构...

  • 前端小技巧整理(持续更新)

    元素筛选 input复选框是否选中 css样式 设置宽高比 或者(可能存在兼容性) flex布局 写在父元素上,子...

  • 数组精简技巧(持续补充...)

    1. 删除数组的重复项 2. 替换数组中的特定值 3. Array.from 达到 .map 的效果 4. 置空数...

  • Flutter开发小技巧

    这篇文章会持续更新,记录开发中遇到的小技巧 1.断点调试小技巧 方式一: Android studio 小虫子de...

  • Python基本数据类型

    Python补充02 Python小技巧 在这里列举一些我使用Python时积累的小技巧。这些技巧是我在使用Pyt...

  • 前端小技巧

    1.让图文不可复制 这点应该大家 都很熟悉了, 某些时候【你懂的】为了快捷搜索答案,可是打死也不让你复制 -web...

  • 前端小技巧

    1.版权置底 2.图标变小手 3.页面跳转 4.设置全局变量

  • 前端小技巧

    作为前端新手,总结了一下自己在做项目中,遇到了问题,在这里记录一下解决办法。 计算文字的高度,展开收起 在工作中经...

网友评论

      本文标题:前端小技巧归类 - 会持续补充

      本文链接:https://www.haomeiwen.com/subject/hfnualtx.html