当前位置:首页 > 科技  > 软件

简化你的工作,七种常用的 JS 代码片段

来源: 责编: 时间:2024-05-28 09:10:38 84观看
导读日常开发中,我们经常会用到很多通用的 JS 代码,比如:复制内容、从 URL 中获取指定参数等,这些代码通常有固定实现,即:代码片段。所以,为了方便大家的开发,今天咱们就来看看常用的 7 种代码片段。1.将内容复制到剪贴板通过按钮

日常开发中,我们经常会用到很多通用的 JS 代码,比如:复制内容、从 URL 中获取指定参数等,这些代码通常有固定实现,即:代码片段。所以,为了方便大家的开发,今天咱们就来看看常用的 7 种代码片段。CPe28资讯网——每日最新资讯28at.com

CPe28资讯网——每日最新资讯28at.com

1.将内容复制到剪贴板

通过按钮,将指定 dom 中的内容复制到用户的剪贴板CPe28资讯网——每日最新资讯28at.com

const copyToClipboard = (content) => {  const textarea = document.createElement("textarea")    textarea.value = content  document.body.appendChild(textarea)  textarea.select()  document.execCommand("Copy")  textarea.remove()}

2.使用URLSearchParams获取URL的搜索参数

这应该是一个非常常见的操作,之前经常会使用 正则来完成,现在有了更简单的方式:CPe28资讯网——每日最新资讯28at.com

const getQueryByName = (name) => {  const query = new URLSearchParams(location.search)  return decodeURIComponent(query.get(name))}// url: https://sunday.com/?name=fatfish&age=100const name = getQueryByName('name') // fatfishconst age = getQueryByName('age') // 100const gender = getQueryByName('gender') // null

3.平滑滚动至页面顶部

const scrollToTop = () => {  const c = document.documentElement.scrollTop || document.body.scrollTop    if (c > 0) {    window.requestAnimationFrame(scrollToTop)    window.scrollTo(0, c - c / 8)  }}

4.获取当前页面滚动距离

const getScrollPosition = (el = window) => ({  x: el.pageXOffset !== undefined ? el.pageXOffset : el.scrollLeft,  y: el.pageYOffset !== undefined ? el.pageYOffset : el.scrollTop,})getScrollPosition() // { x: 0, y: 215 }

5.判断当前设备是Andoird还是iOS

function getOSType() {  let u = navigator.userAgent,    app = navigator.appVersion  let isAndroid = u.indexOf("Android") > -1 || u.indexOf("Linux") > -1  let isIOS = !!u.match(//(i[^]+( U)? CPU.+Mac OS X/)    if (isIOS) {    return 0  } else if (isAndroid) {    return 1  } else {    return 2  }}getOSType() // 0

6.格式化货币

const formatMoney = (money) => {  return money.toLocaleString()}formatMoney(123456789) // '123,456,789'formatMoney(123456789.123) // '123,456,789.123'formatMoney(123) // '123'

7.进入和退出全屏

// 进入全屏function fullScreen() {  let el = document.documentElement  let rfs = el.requestFullScreen || el.webkitRequestFullScreen || el.mozRequestFullScreen || el.msRequestFullScreen  //typeof rfs != "undefined" && rfs  if (rfs) {    rfs.call(el)  } else if (typeof window.ActiveXObject !== "undefined") {    let wscript = new ActiveXObject("WScript.Shell")    if (wscript != null) {      wscript.SendKeys("{F11}")    }  }}// 退出全屏function exitScreen() {  let el = document  let cfs = el.cancelFullScreen || el.webkitCancelFullScreen || el.mozCancelFullScreen || el.exitFullScreen  //typeof cfs != "undefined" && cfs  if (cfs) {    cfs.call(el)  } else if (typeof window.ActiveXObject !== "undefined") {    let wscript = new ActiveXObject("WScript.Shell")    if (wscript != null) {      wscript.SendKeys("{F11}")    }  }}


CPe28资讯网——每日最新资讯28at.com

本文链接:http://www.28at.com/showinfo-26-91166-0.html简化你的工作,七种常用的 JS 代码片段

声明:本网页内容旨在传播知识,若有侵权等问题请及时与本网联系,我们将在第一时间删除处理。邮件:2376512515@qq.com

上一篇: Python 角色权限隔离,你完全相信装饰器

下一篇: 六个Python开发者很少用到但功能强大的模块

标签:
  • 热门焦点
Top