日常開發中，我們經常會用到很多通用的 JS 代碼，比如：復制內容、從 URL 中獲取指定參數等，這些代碼通常有固定實現，即：代碼片段。所以，為了方便大家的開發，今天咱們就來看看常用的 7 種代碼片段。yCh28資訊網——每日最新資訊28at.com

yCh28資訊網——每日最新資訊28at.com

1.將內容復制到剪貼板

通過按鈕，將指定 dom 中的內容復制到用戶的剪貼板yCh28資訊網——每日最新資訊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的搜索參數

這應該是一個非常常見的操作，之前經常會使用 正則來完成，現在有了更簡單的方式：yCh28資訊網——每日最新資訊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}")    }  }}

yCh28資訊網——每日最新資訊28at.com

本文鏈接：http://www.tebozhan.com/showinfo-26-91166-0.html簡化你的工作，七種常用的 JS 代碼片段

聲明：本網頁內容旨在傳播知識，若有侵權等問題請及時與本網聯系，我們將在第一時間刪除處理。郵件：2376512515@qq.com

上一篇： Python 角色權限隔離，你完全相信裝飾器

下一篇： 六個Python開發者很少用到但功能強大的模塊