肥宅钓鱼网
当前位置: 首页 钓鱼百科

前端开发常用代码(分享一些实用的JS代码片段)

时间:2023-07-04 作者: 小编 阅读量: 2 栏目名: 钓鱼百科

前端开发常用代码?我们一起去了解并探讨一下这个问题吧!

前端开发常用代码?作者:小明来源:IT技术分享社区Function getBrowser() {var UserAgent = navigator.userAgent.toLowerCase();var browserInfo = {};var browserArray = {IE: window.ActiveXObject || "ActiveXObject" in window, // IEChrome: UserAgent.indexOf('Chrome') > -1 && UserAgent.indexOf('safari') > -1, // Chrome浏览器Firefox: UserAgent.indexOf('firefox') > -1, // 火狐浏览器Opera: UserAgent.indexOf('opera') > -1, // Opera浏览器Safari: UserAgent.indexOf('safari') > -1 && UserAgent.indexOf('chrome') == -1, // safari浏览器Edge: UserAgent.indexOf('edge') > -1, // Edge浏览器QQBrowser: /qqbrowser/.test(UserAgent), // qq浏览器WeixinBrowser: /MicroMessenger/i.test(UserAgent) // 微信浏览器};// console.log(browserArray)for (var i in browserArray) {if (browserArray[i]) {var versions = '';if (i == 'IE') {versions = UserAgent.match(/(msie\s|trident.*rv:)([\w.] )/)[2];} else if (i == 'Chrome') {for (var mt in navigator.mimeTypes) { //检测是否是360浏览器(测试只有pc端的360才起作用) if (navigator.mimeTypes[mt]['type'] == 'application/360softmgrplugin') {i = '360'; }}versions = UserAgent.match(/chrome\/([\d.] )/)[1];} else if (i == 'Firefox') {versions = UserAgent.match(/firefox\/([\d.] )/)[1];} else if (i == 'Opera') {versions = UserAgent.match(/opera\/([\d.] )/)[1];} else if (i == 'Safari') {versions = UserAgent.match(/version\/([\d.] )/)[1];} else if (i == 'Edge') {versions = UserAgent.match(/edge\/([\d.] )/)[1];} else if (i == 'QQBrowser') {versions = UserAgent.match(/qqbrowser\/([\d.] )/)[1];}browserInfo.type = i;browserInfo.versions = parseInt(versions);}}return browserInfo; } ,下面我们就来说一说关于前端开发常用代码?我们一起去了解并探讨一下这个问题吧!

前端开发常用代码

作者:小明来源:IT技术分享社区

1、获取浏览器的版

Function getBrowser() {var UserAgent = navigator.userAgent.toLowerCase();var browserInfo = {};var browserArray = {IE: window.ActiveXObject || "ActiveXObject" in window, // IEChrome: UserAgent.indexOf('Chrome') > -1 && UserAgent.indexOf('safari') > -1, // Chrome浏览器Firefox: UserAgent.indexOf('firefox') > -1, // 火狐浏览器Opera: UserAgent.indexOf('opera') > -1, // Opera浏览器Safari: UserAgent.indexOf('safari') > -1 && UserAgent.indexOf('chrome') == -1, // safari浏览器Edge: UserAgent.indexOf('edge') > -1, // Edge浏览器QQBrowser: /qqbrowser/.test(UserAgent), // qq浏览器WeixinBrowser: /MicroMessenger/i.test(UserAgent) // 微信浏览器};// console.log(browserArray)for (var i in browserArray) {if (browserArray[i]) {var versions = '';if (i == 'IE') {versions = UserAgent.match(/(msie\s|trident.*rv:)([\w.] )/)[2];} else if (i == 'Chrome') {for (var mt in navigator.mimeTypes) { //检测是否是360浏览器(测试只有pc端的360才起作用) if (navigator.mimeTypes[mt]['type'] == 'application/360softmgrplugin') {i = '360'; }}versions = UserAgent.match(/chrome\/([\d.] )/)[1];} else if (i == 'Firefox') {versions = UserAgent.match(/firefox\/([\d.] )/)[1];} else if (i == 'Opera') {versions = UserAgent.match(/opera\/([\d.] )/)[1];} else if (i == 'Safari') {versions = UserAgent.match(/version\/([\d.] )/)[1];} else if (i == 'Edge') {versions = UserAgent.match(/edge\/([\d.] )/)[1];} else if (i == 'QQBrowser') {versions = UserAgent.match(/qqbrowser\/([\d.] )/)[1];}browserInfo.type = i;browserInfo.versions = parseInt(versions);}}return browserInfo; }

2、颜色RGB转十六进制

function colorRGBtoHex(color) {var rgb = color.split(',');var r = parseInt(rgb[0].split('(')[1]);var g = parseInt(rgb[1]);var b = parseInt(rgb[2].split(')')[0]);var hex = "#"((1 << 24)(r << 16)(g << 8)b).toString(16).slice(1);return hex; }

3、禁止右键菜单代码、禁止复制粘贴代码

< script type = "text/javascript" > //屏蔽右键菜单 document.oncontextmenu = function(event) {if (window.event) {event = window.event;}try {var the = event.srcElement;if (! ((the.tagName == "INPUT" && the.type.toLowerCase() == "text") || the.tagName == "TEXTAREA")) {return false;}return true;} catch(e) {return false;} } //屏蔽粘贴 document.onpaste = function(event) {if (window.event) {event = window.event;}try {var the = event.srcElement;if (! ((the.tagName == "INPUT" && the.type.toLowerCase() == "text") || the.tagName == "TEXTAREA")) {return false;}return true;} catch(e) {return false;} } //屏蔽复制 document.oncopy = function(event) {if (window.event) {event = window.event;}try {var the = event.srcElement;if (! ((the.tagName == "INPUT" && the.type.toLowerCase() == "text") || the.tagName == "TEXTAREA")) {return false;}return true;} catch(e) {return false;} } //屏蔽剪切 document.oncut = function(event) {if (window.event) {event = window.event;}try {var the = event.srcElement;if (! ((the.tagName == "INPUT" && the.type.toLowerCase() == "text") || the.tagName == "TEXTAREA")) {return false;}return true;} catch(e) {return false;} } //屏蔽选中 document.onselectstart = function(event) {if (window.event) {event = window.event;}try {var the = event.srcElement;if (! ((the.tagName == "INPUT" && the.type.toLowerCase() == "text") || the.tagName == "TEXTAREA")) {return false;}return true;} catch(e) {return false;} } < /script>/

4、检查日期是否合法

function CheckDateTime(str){ var reg = /^(\d )-(\d{1,2})-(\d{1,2}) (\d{1,2}):(\d{1,2}):(\d{1,2})$/; var r = str.match(reg); if(r==null)return false; r[2]=r[2]-1; var d= new Date(r[1], r[2],r[3], r[4],r[5], r[6]); if(d.getFullYear()!=r[1])return false; if(d.getMonth()!=r[2])return false; if(d.getDate()!=r[3])return false; if(d.getHours()!=r[4])return false; if(d.getMinutes()!=r[5])return false; if(d.getSeconds()!=r[6])return false; return true; }

5、英文字符串首字母大写

/*** 方法一:js字符串切割* @param {*} str*/ function firstToUpper1(str) {return str.trim().toLowerCase().replace(str[0], str[0].toUpperCase()); } /*** 方法二:js正则* @param {*} str*/ function firstToUpper2(str){return str.replace(/\b(\w)(\w*)/g, function($0, $1, $2) {return $1.toUpperCase()$2.toLowerCase();}); } /*** 方法三:js正则* @param {*} str*/ function firstToUpper3(str){return str.toLowerCase().replace(/( |^)[a-z]/g,(L)=>L.toUpperCase()); }

6、计算2个日期之间相差多少天

function getDays(strDateStart,strDateEnd){var strSeparator = "-"; //日期分隔符var oDate1;var oDate2;var iDays;oDate1= strDateStart.split(strSeparator);oDate2= strDateEnd.split(strSeparator);var strDateS = new Date(oDate1[0], oDate1[1]-1, oDate1[2]);var strDateE = new Date(oDate2[0], oDate2[1]-1, oDate2[2]);iDays = parseInt(Math.abs(strDateS - strDateE ) / 1000 / 60 / 60 /24)//把相差的毫秒数转换为天数return iDays ; }

7、生成随机十六进制颜色

function randomHexColor() { //随机生成十六进制颜色var hex = Math.floor(Math.random() * 16777216).toString(16); //生成ffffff以内16进制数while (hex.length < 6) { //while循环判断hex位数,少于6位前面加0凑够6位hex = '0'hex; }return '#'hex; //返回‘#'开头16进制颜色 }

8、数组去重

const removeDuplicates = (arr) => [...new Set(arr)];console.log(removeDuplicates([1, 2, 3, 3, 4, 4, 5, 5, 6])); // Result: [ 1, 2, 3, 4, 5, 6 ]

9、从 URL 获取查询参数

function getParameterByName(name, url) {if (!url) url = window.location.href;name = name.replace(/[\[\]]/g, "\\$&");var regex = new RegExp("[?&]"name"(=([^]*)|&|#|$)"),results = regex.exec(url);if (!results) return null;if (!results[2]) return '';return decodeURIComponent(results[2].replace(/\ /g, " ")); }

10、校验数字是奇数还是偶数

const isEven = num => num % 2 === 0;console.log(isEven(2));// Result: True

11、求数字的平均值

const average = (...args) => args.reduce((a, b) => ab) / args.length;average(1, 2, 3, 4); // Result: 2.5

12、回到顶部

function topFunction() {document.body.scrollTop = 0;document.documentElement.scrollTop = 0;}

13、翻转字符串

// reverse var name = "My city is WH";var resultStr = name.split('').reverse().join(''); console.log(resultStr);// HW si ytic yM// charAt var name = "My city is WuHan";var nameArr = name.split('');var resultStr = '';for (var i = nameArr.length-1; i >= 0; i--) {resultStr= name.charAt(i);}console.log(resultStr); // naHuW si ytic yM

14、校验数组是否为空

const isNotEmpty = arr => Array.isArray(arr) && arr.length > 0;isNotEmpty([1, 2, 3]); // Result: true

    推荐阅读
  • 艾尔登法环亚历山大支线任务玩法 艾尔登法环游戏时长

    游戏中游戏支线任务是与一些npc相关的剧情,触发后可以对话获得奖励,这里给大家带来了艾尔登法环亚历山大支线任务玩法,一起来看下吧。艾尔登法环亚历山大支线任务玩法宁姆格福中北部,东西交界的圣人桥。山崖边可以遇到战士壶铁拳亚历山大,这厮卡在了这里,请玩家帮忙脱困。关于艾尔登法环亚历山大支线任务玩法为大家分享完毕,完成这个支线后有举手欢呼的动作和锻造石可以收集,希望对大家游戏有帮助。

  • 怎么才能告别红血丝(告别红血丝告别)

    由于红血丝肌肤的护理是属于一个大工程,所以我们要非常有耐心,并重视它。

  • 怎么对付强势的婆媳矛盾(三招化解婆媳矛盾关系)

    婚后发现自己的想法简直天壤地别。作为儿媳,只能忍受。以婆婆最好保持。只有他们的爱,没有掺杂任何利益而言。俗话说,恋爱中的女人智商为零。婚后婆媳矛盾可以说层出不穷,夹在中间的老公,至关重要。不会偏袒每一方。最后我们两人互相道歉。遇事随机应变,然后作出合乎情理的判断和处理方法。当一个女人步入婚姻的殿堂之后,可以说是选择自己的后半生。婚姻质量的好坏不仅影响自己甚至是下一代。

  • 百香果蜂蜜泡水的正确方法(百香果蜂蜜怎么泡水)

    百香果蜂蜜泡水的正确方法准备两个百香果和200毫升的温开水,水温不要超过60度,果子选择果皮边皱巴的甜果,不然会影响口感。百香果中含有丰富的维C和胡萝卜素,有助于增加抵抗力,起到很好的美容作用,舒缓皮肤;果肉中还有很多纤维物质和果酸,帮助调理肠道,促进消化,有很好的瘦身功能。蜂蜜本身具有调养气血,美容养颜的功效,和富含维C的百香果混合在一起,是滋补养颜的佳品。

  • 双十一给孩子最好的礼物(给孩子最好的生日礼物是什么)

    给孩子最好的生日礼物是什么我们家可爱多刚好是11月底生日,每年都是生日还没到,亲友团们已经忙不迭奉上生日礼物了!每年的双十一,都是可爱多疯狂收礼的幸福时光接下来,晒一晒可爱多历年收到的花样礼物以及我个人认为比较适合送给孩子的礼。

  • 叶面肥打多了会怎么样(叶面肥打多了有害吗)

    回答叶面肥打多了会造成作物出现烧苗、叶片脱水和枯萎、肥害等现象,严重时会出现死亡现象。叶面肥一般在喷施时,以喷至叶片正、反两面散布肥液开始下滴为度,不能过多喷施。

  • 糖雪球怎么熬教程(自制冰糖雪球火候很重要)

    自制“冰糖雪球”火候很重要,只要掌握好火候,个个沾满糖霜!步骤8等到锅中的糖出现均匀的小气泡,就可以加入白醋然后把锅关火了,然后还要继续不停地搅拌,这时候锅边的糖会出现白霜,大家还可以放一点芝麻进去,这样吃起来会更香。

  • 快手小店隐藏起来怎么找到(快手怎么隐藏快手小店商品)

    快手是北京快手科技有限公司旗下的产品。快手的前身,叫“GIF快手”,诞生于2011年3月,最初是一款用来制作、分享GIF图片的手机应用。2012年11月,快手从纯粹的工具应用转型为短视频社区,用于用户记录和分享生产、生活的平台。

  • 喝啤酒会长胖吗(喝啤酒会让人发胖吗)

    啤酒会导致肥胖啤酒是小麦做成的,在身体内代谢会转变为淀粉,进一步转变为蛋白质和脂肪,这就会导致脂肪堆积你在喝酒的时候也会吃大量的食物,这个时候身体运动强度小,使身体没有办法消耗大量能量时就会引起肥胖,今天小编就来聊一聊关于喝啤酒会长胖吗?啤酒是小麦做成的,在身体内代谢会转变为淀粉,进一步转变为蛋白质和脂肪,这就会导致脂肪堆积。反而对于身体是有一定好处的,另外应该锻炼,避免肥胖的发生。

  • 木地板应该怎么清洁(木地板清洁的方法)

    木地板应该怎么清洁自制清洁剂;用40毫升白醋加10毫升肥皂水混入10滴柠檬精油,将自制清洁剂喷洒在木地板上,然后用半干的拖布清洁干净。用抛光霜;将抛光霜涂抹在纤维抹布上,顺着木质纹理,以打磨的手势进行拭擦,抛光霜有护理的作用。用清洁剂;木地板的缝隙容易堆积灰尘,这个死角平时最难清理,可以尝试在缝隙处喷上泡沫清洁剂,然后用小刷子清洁即可。用牙膏;用牙膏就能清除木地板上的笔印。