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

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

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

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

前端开发常用代码?作者:小明来源: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

    推荐阅读
  • 逍遥医生电视剧简介(关于电视剧逍遥医生简介)

    以下内容大家不妨参考一二希望能帮到您!逍遥医生电视剧简介WilliamRush医生是一个出诊医生,但是他不属于任何一家医院。他对病人极为挑剔,不达到他的要求他绝不上门。他要求病人必须支付数目不菲的现金酬劳,而且他看完病就举办花天酒地的聚会。他声称自己对这些「不干净」的客户从不做出评价,但他无法对那些丑恶的现象做到百分之百免疫。他无意改变自己的生活方式——直到一个老情人突然出现,引起他对良知和道德感的思考。

  • 沐足店老板是经历了什么(在沐足店打工2年)

    在外面我干过很多不同的工作,后来才去到了东莞的一家沐足店打工,在沐足店打工两年后,店老板让我把店当成自己的家。其实不是的,在东莞的街头有很多沐足店,都非常的正规,而且也是专门帮一些疲劳的客人沐足。我去东莞打工的故事,还要从2013年说起。2013年,那一年的我刚好20岁,20岁的我阳光又青春,可是因为高中毕业就不读书,文化程度并不算高,所以去到东莞这个正在不断发展的城市,能做的工作也不多。

  • 今年小学入学年龄有何规定(小学入学年龄迎来改革)

    今年小学入学年龄有何规定在社会竞争压力的不断增长之下,教育也不可避免地成为了“内卷”的主场。那些喊着要让孩子赢在起跑线上的父母,开始有目的地去尝试“鸡娃”的教育方式。即便如此,相比起成绩的提升,父母们还是毅然决然地偏向了内卷式育儿。按照我国在教育方面的相关规定,小学的入学年龄是在六周岁,而且还具体到了九月一号这个时间点。

  • dnf副职业哪个比较好啊(DNF现在这个版本副职业应该如何选择)

    而炼金术师出厂的生命之息,现在这个版本基本凉凉了,因为价格一直比较低,没什么太高的赚头。至于生命之息大多是紫装出产比较多收益也一般不是很高。有人可能会问蜗牛君就只介绍一下这几种副职业的差别和作用吗?好了,以上就是本期“夏几把吹”的全部内容了,求各位读者姥爷们高抬贵手点点收藏、关注。

  • 实用新型发明专利申请流程(发明或实用新型专利申请说明书)

    《专利法》第三十三条中规定:申请人可以对其专利申请文件进行修改,但是,对发明和实用新型专利申请文件的修改不得超出原说明书和权利要求书记载的范围。说明书主要用于清楚、完整地描述发明或者实用新型,使所属技术领域的技术人员仅凭说明书和权利要求书就能够理解和实施该发明或者实用新型。《专利法》第二十六条第三款所规定“说明书应当对对发明或者实用新型作出清楚、完整的说明”。

  • 益生菌什么时候吃好(益生菌最佳食用时间)

    以下内容大家不妨参考一二希望能帮到您!益生菌什么时候吃好益生菌一般建议饭后20分钟服用,最好由于饭后胃酸浓度降低,更有利于益生菌达到肠道发挥作用。此外,冲服益生菌时避免使用开水,由于高温会杀死里面的有益菌,建议用30到40度的温开水冲调刚好。此外,益生菌不能与抗生素同时服用,以免影响益生菌的疗效,建议益生菌与抗生素服用时需要间隔3到4小时。。

  • 做梦洗头(做梦洗头好不好)

    下面内容希望能帮助到你,我们来一起看看吧!做梦洗头梦见洗头,预示着一切忧愁都会过去。梦见洗头,表示你最近在工作上可以有升迁的机会,如果你前一阵子刚好生病,则是痊癒的象徵。梦见洗头,表示一直以来的烦恼将要结束,心里能舒一口气了。男人做这样的梦,还预示将要出人头地。梦见双手抱头,预示着会有捷报传来。梦见自己蒙着头或在夏天戴着帽子,表示梦者的才华被压制,得不到施展。

  • 东芝s60cnw微烤一体机(更贴近你的生活)

    单纯烤一般很容易让食物的水分流失,但是加入了微波的话可以锁住食物水分的流失,让食物保持着外焦里嫩的口感。②水波炉的原理整合了微波和发热管,在蒸汽的发生过程中能够对蒸汽进行快速加热,让蒸汽温度在短时间内快速上升。①微烤一体机相比普通烤箱,多了一个“微”,也就是微波。想要做点高水准的蛋糕,又想做出营养原味美食,那就买微烤一体机。

  • 反流性食管炎怎么才能彻底治好(反流性食管炎太难治)

    胃黏膜的保护剂是在胃黏膜上形成保护膜,另外促进黏膜的愈合,减少胃酸腐蚀对它的影响。如果是轻度食管炎,一般一个月基本上可以得到愈合。如果治疗一个疗程以后,食管炎的症状还很重,还在持续,有的患者就需要维持治疗和长期用药。所以食管炎的治疗,它是分阶段来进行治疗的。因为在治疗的当中,一般在治疗食管炎第一个疗程以后,过三个月需要复查胃镜。第一是看食管炎否愈合的比较好,第二观察停药以后又复发的情况。

  • 手摇叉车一般多重(正常用的手动叉车有多重)

    手动叉车载重1500公斤,2000公斤,2500公斤,3000公斤,3500公斤,5000公斤,另外货叉外宽度分别有550mm和685mm二种。电动液压叉车厂家科普车轮分别有尼龙和聚氨酯二种类型。聚氨酯轮适用于环氧树脂地面的使用,质地较软,不会对地面造成伤害。