前端:分享一些实用的JS代码片段

今天给大家分享一些实用的JS代码片段,有需要的朋友欢迎收藏!

       d41805dd2220e1bd34cb40947a4a194b.png        

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) => a + b) / 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

IT技术分享社区

个人博客网站:https://programmerblog.xyz

fa3cd4cec183f7f5987ff3383398bb16.png

文章推荐程序员效率:画流程图常用的工具程序员效率:整理常用的在线笔记软件远程办公:常用的远程协助软件,你都知道吗?51单片机程序下载、ISP及串口基础知识硬件:断路器、接触器、继电器基础知识

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/270385.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

20145206 《信息安全系统设计基础》第十二周学习总结

20145206 《信息安全系统设计基础》第十二周学习总结 本周学习目标 1、第九周代码检查 2、第十周代码检查 3、第十一周代码检查 博客链接 20145206 《信息安全系统设计基础》第九周学习总结20145206 《信息安全系统设计基础》第十周学习总结20145206 《信息安全系统设计基础》第…

lambda创建线程

Testpublic void add() {//方式一Thread thread1 new Thread("ttt") {Overridepublic void run() {System.out.println("1");}};thread1.start();//方式二Runnable runnable new Runnable() {Overridepublic void run() {System.out.println("2&quo…

电脑技巧:F5称为万能键,看了才知道它的强大

目录 NO.1 浏览器刷新 NO.2 PPT快速放映 NO.3 Word快速定位 NO.4 Excel快速定位 NO.5 记事本录入当前时间 今天给大家介绍一个经常被大家忽视的但非常实用的快捷键F5具体有哪些用法。 ★万能快捷键★ F5 NO.1 浏览器刷新 刷新功能 F5最常用的就是网页刷新功能&#xff0c;相比这…

FileZilla搭建FTP服务器图解教程

在日常办公当中&#xff0c;经常会需要一个共享文件夹来存放一些大家共享的资料&#xff0c;为了保证文件数据的安全&#xff0c;最佳的方式是公司内部服务器搭建FTP服务器&#xff0c;然后分配多个用户给相应的人员。今天给大家分享FileZilla搭建FTP服务器图解教程&#xff0c…

运维:Windows 系统安全日志中登录类型介绍

目录 Windows 登录类型 登录类型2&#xff1a;交互式登录&#xff08;Interactive&#xff09; 登录类型3&#xff1a;网络&#xff08;Network&#xff09; 登录类型4&#xff1a;批处理&#xff08;Batch&#xff09; 登录类型5&#xff1a;服务&#xff08;Service&#xff…

c语言灯塔案例求塔低数,C++:有一个8层灯塔,每层所点灯数都等于该层上一层的两倍,一共有765盏灯,求塔底的灯数...

满意答案0214zyt2013.05.23采纳率&#xff1a;51% 等级&#xff1a;12已帮助&#xff1a;6734人// Note:Your choice is C IDE#include #include using namespace std;int main(){//第一,穷举法int i,j;int n,s;for(i0;i<765;i)//穷举的范围可以进一步缩小&#xff0c;交…

电脑知识:电脑无法开机解决方案

电脑无法开机&#xff0c;首先不要紧张&#xff0c;你电脑里面的文件资料99.99%不会丢失&#xff0c;那有可能人问了&#xff0c;剩余0.001%是什么&#xff0c;只有一种可能&#xff0c;就是你的硬盘硬件彻底坏了。 今天小编讲的这几招都是对非常容易上手的电脑小白&#xff0c…

电脑技巧:键盘上最长的按键空格键使用技巧

目录 01、音视频播放器的暂停/播放切换 02、Alt空格键 03、Ctrl空格键 04、Shift空格键 05、游戏中按键 06、密码完美替代者 空格键是所有键盘中的按键最长一个&#xff0c;我们平常使用最多的按键就是在输入文字的时候按下空格键&#xff0c;其实除了空格&#xff0c;空格键还…

Hadoop HBase概念学习系列之HBase里的客户端和HBase集群建立连接(详细)(十四)...

需要遵循以下步骤&#xff1a; 1、客户端和Zookeeper集群建立连接。在这之前客户端需要获得一些信息&#xff08;可以从HBase配置文件中读取或是直接指定&#xff09;。客户端从Zookeeper集群中读取-ROOT-表的位置信息。这是客户端发起的第一次查询。 2、客户端连接-ROOT-表&am…

run()方法和start()方法测试解析

run()方法没有启动一个新的线程&#xff0c;通过如下代码可以看出&#xff0c;是main主线程执行的 start()方法启动了一个新线程&#xff0c;启动了线程&#xff0c;从如下代码看出t1线程执行了代码

操作系统:升级Windows 11正式版的四种方法

距离 Windows 11 预览版测试已经过去近四个半月。 终于&#xff0c;在 10 月 5 日&#xff0c;微软的 Windows 11 正式版操作系统全面上市。 Win11 的正式上线&#xff0c;打破了微软在 Win 10 刚发布之时曾表示 Win 10 将会是最后一代 Windows 的说法。 微软表示&#xff0c;…

线程NEW状态和RUNNABLE状态

新建一个线程的时候是NEW状态 启动线程后是RUNNABLE状态

电脑知识:Win10系统优化的7个设置技巧

今天小编给大家介绍一些Win10系统优化的7个设置技巧&#xff0c;希望对大家能有所帮助&#xff01;1、卸载Win10自带的软件Win10默认会自带很多的内置应用&#xff08;地图、游戏、画图3D、Groove音乐、Skye、Xbox&#xff09;&#xff0c;大部分大家都用不到&#xff0c;建议卸…

c语言已知加速度求位移速度,知道初速度知道加速度求位移的公式

知道初速度知道加速度求位移的公式以下文字资料是由(历史新知网www.lishixinzhi.com)小编为大家搜集整理后发布的内容&#xff0c;让我们赶快一起来看一下吧&#xff01;知道初速度知道加速度求位移的公式高一物理公式总结一、质点的运动(1)------直线运动1)匀变速直线运动1.平…

IllegalThreadStateException

IllegalThreadStateException

js日期显示效果

<!DOCTYPE html><html> <head> <meta charset"UTF-8"> <title></title> </head> <body> <div id"div1"> </div> <script type"text/javascript"> window.οnlοadfunction s…

操作系统:操作系统装进U盘的图解教程

使用U盘安装操作系统的相信大家都比较熟悉了&#xff0c;如果把操作系统安装在U盘中你尝试过吗&#xff1f;操作系统安装电脑的时候是写入硬盘当中&#xff0c;U盘属于移动硬盘&#xff0c;自然也在安装范围内&#xff0c;过去只是U盘空间小无法安装&#xff0c;现在随着科技发…

网络知识:WiFi越用越慢,到底是什么原因

WiFi越用越慢&#xff0c;到底是什么原因&#xff1f; 有人认为是WiFi盒子有问题&#xff0c;但其实和路由器的错误摆放也有关系。 今天&#xff0c;小编特地百度了一下&#xff0c;列出了几个路由器正确摆放的小常识&#xff0c;而且不用花一分钱&#xff0c;就可以测试出家中…

硬件知识:电脑组装机必备的知识梳理

今天小编给大家分享电脑组装机必备的知识&#xff0c;希望对大家能有所帮助&#xff01; 确实机箱内部的硬件连接中&#xff0c;大多数线材的插头和插孔都是独特的&#xff0c;比如主板的204pin&#xff0c;CPU的44pin都不能通用&#xff0c;多接口中方口和圆口的搭配也不会导致…