31、原生JavaScript判断是否移动设备
1 function isMobile(){ 2 if (typeof this._isMobile === 'boolean'){ 3 return this._isMobile; 4 } 5 var screenWidth = this.getScreenWidth(); 6 var fixViewPortsExperiment = rendererModel.runningExperiments.FixViewport || rendererModel.runningExperiments.fixviewport; 7 var fixViewPortsExperimentRunning = fixViewPortsExperiment && (fixViewPortsExperiment.toLowerCase() === "new"); 8 if(!fixViewPortsExperiment){ 9 if(!this.isAppleMobileDevice()){ 10 screenWidth = screenWidth/window.devicePixelRatio; 11 } 12 } 13 var isMobileScreenSize = screenWidth < 600; 14 var isMobileUserAgent = false; 15 this._isMobile = isMobileScreenSize && this.isTouchScreen(); 16 return this._isMobile; 17 }
32、原生JavaScript判断是否移动设备访问
1 function isMobileUserAgent(){ 2 return (/iphone|ipod|android.*mobile|windows.*phone|blackberry.*mobile/i.test(window.navigator.userAgent.toLowerCase())); 3 }
33、原生JavaScript判断是否苹果移动设备访问
1 function isAppleMobileDevice(){ 2 return (/iphone|ipod|ipad|Macintosh/i.test(navigator.userAgent.toLowerCase())); 3 }
34、原生JavaScript判断是否安卓移动设备访问
1 function isAndroidMobileDevice(){ 2 return (/android/i.test(navigator.userAgent.toLowerCase())); 3 }
35、原生JavaScript判断是否Touch屏幕
1 function isTouchScreen(){ 2 return (('ontouchstart' in window) || window.DocumentTouch && document instanceof DocumentTouch); 3 }
36、原生JavaScript判断是否在安卓上的谷歌浏览器
1 function isNewChromeOnAndroid(){ 2 if(this.isAndroidMobileDevice()){ 3 var userAgent = navigator.userAgent.toLowerCase(); 4 if((/chrome/i.test(userAgent))){ 5 var parts = userAgent.split('chrome/'); 6 7 var fullVersionString = parts[1].split(" ")[0]; 8 var versionString = fullVersionString.split('.')[0]; 9 var version = parseInt(versionString); 10 11 if(version >= 27){ 12 return true; 13 } 14 } 15 } 16 return false; 17 }
37、原生JavaScript判断是否打开视窗
1 function isViewportOpen() { 2 return !!document.getElementById('wixMobileViewport'); 3 }
38、原生JavaScript获取移动设备初始化大小
1 function getInitZoom(){ 2 if(!this._initZoom){ 3 var screenWidth = Math.min(screen.height, screen.width); 4 if(this.isAndroidMobileDevice() && !this.isNewChromeOnAndroid()){ 5 screenWidth = screenWidth/window.devicePixelRatio; 6 } 7 this._initZoom = screenWidth /document.body.offsetWidth; 8 } 9 return this._initZoom; 10 }
39、原生JavaScript获取移动设备最大化大小
1 function getZoom(){ 2 var screenWidth = (Math.abs(window.orientation) === 90) ? Math.max(screen.height, screen.width) : Math.min(screen.height, screen.width); 3 if(this.isAndroidMobileDevice() && !this.isNewChromeOnAndroid()){ 4 screenWidth = screenWidth/window.devicePixelRatio; 5 } 6 var FixViewPortsExperiment = rendererModel.runningExperiments.FixViewport || rendererModel.runningExperiments.fixviewport; 7 var FixViewPortsExperimentRunning = FixViewPortsExperiment && (FixViewPortsExperiment === "New" || FixViewPortsExperiment === "new"); 8 if(FixViewPortsExperimentRunning){ 9 return screenWidth / window.innerWidth; 10 }else{ 11 return screenWidth / document.body.offsetWidth; 12 } 13 }
40、原生JavaScript获取移动设备屏幕宽度
1 function getScreenWidth(){ 2 var smallerSide = Math.min(screen.width, screen.height); 3 var fixViewPortsExperiment = rendererModel.runningExperiments.FixViewport || rendererModel.runningExperiments.fixviewport; 4 var fixViewPortsExperimentRunning = fixViewPortsExperiment && (fixViewPortsExperiment.toLowerCase() === "new"); 5 if(fixViewPortsExperiment){ 6 if(this.isAndroidMobileDevice() && !this.isNewChromeOnAndroid()){ 7 smallerSide = smallerSide/window.devicePixelRatio; 8 } 9 } 10 return smallerSide; 11 }
41、原生JavaScript完美判断是否为网址
1 function IsURL(strUrl) { 2 var regular = /^\b(((https?|ftp):\/\/)?[-a-z0-9]+(\.[-a-z0-9]+)*\.(?:com|edu|gov|int|mil|net|org|biz|info|name|museum|asia|coop|aero|[a-z][a-z]|((25[0-5])|(2[0-4]\d)|(1\d\d)|([1-9]\d)|\d))\b(\/[-a-z0-9_:\@&?=+,.!\/~%\$]*)?)$/i 3 if (regular.test(strUrl)) { 4 return true; 5 } 6 else { 7 return false; 8 } 9 }
42、原生JavaScript根据样式名称检索元素对象
1 function getElementsByClassName(name) { 2 var tags = document.getElementsByTagName('*') || document.all; 3 var els = []; 4 for (var i = 0; i < tags.length; i++) { 5 if (tags[i].className) { 6 var cs = tags[i].className.split(' '); 7 for (var j = 0; j < cs.length; j++) { 8 if (name == cs[j]) { 9 els.push(tags[i]); 10 break 11 } 12 } 13 } 14 } 15 return els 16 }
43、原生JavaScript判断是否以某个字符串开头
1 String.prototype.startWith = function (s) { 2 return this.indexOf(s) == 0 3 }
44、原生JavaScript判断是否以某个字符串结束
1 String.prototype.endWith = function (s) { 2 var d = this.length - s.length; 3 return (d >= 0 && this.lastIndexOf(s) == d) 4 }
45、原生JavaScript返回IE浏览器的版本号
1 function getIE(){ 2 if (window.ActiveXObject){ 3 var v = navigator.userAgent.match(/MSIE ([^;]+)/)[1]; 4 return parseFloat(v.substring(0, v.indexOf("."))) 5 } 6 return false 7 }
46、原生JavaScript获取页面高度
1 function getPageHeight(){ 2 var g = document, a = g.body, f = g.documentElement, d = g.compatMode == "BackCompat" 3 ? a 4 : g.documentElement; 5 return Math.max(f.scrollHeight, a.scrollHeight, d.clientHeight); 6 }
47、原生JavaScript获取页面scrollLeft
1 function getPageScrollLeft(){ 2 var a = document; 3 return a.documentElement.scrollLeft || a.body.scrollLeft; 4 }
48、原生JavaScript获取页面可视宽度
1 function getPageViewWidth(){ 2 var d = document, a = d.compatMode == "BackCompat" 3 ? d.body 4 : d.documentElement; 5 return a.clientWidth; 6 }
49、原生JavaScript获取页面宽度
1 function getPageWidth(){ 2 var g = document, a = g.body, f = g.documentElement, d = g.compatMode == "BackCompat" 3 ? a 4 : g.documentElement; 5 return Math.max(f.scrollWidth, a.scrollWidth, d.clientWidth); 6 }
50、原生JavaScript获取页面scrollTop
1 function getPageScrollTop(){ 2 var a = document; 3 return a.documentElement.scrollTop || a.body.scrollTop; 4 }
51、原生JavaScript获取页面可视高度
1 function getPageViewHeight() { 2 var d = document, a = d.compatMode == "BackCompat" 3 ? d.body 4 : d.documentElement; 5 return a.clientHeight; 6 }
52、原生JavaScript跨浏览器添加事件
1 function addEvt(oTarget,sEvtType,fnHandle){ 2 if(!oTarget){return;} 3 if(oTarget.addEventListener){ 4 oTarget.addEventListener(sEvtType,fnHandle,false); 5 }else if(oTarget.attachEvent){ 6 oTarget.attachEvent("on" + sEvtType,fnHandle); 7 }else{ 8 oTarget["on" + sEvtType] = fnHandle; 9 } 10 }
53、原生JavaScript跨浏览器删除事件
1 function delEvt(oTarget,sEvtType,fnHandle){ 2 if(!oTarget){return;} 3 if(oTarget.addEventListener){ 4 oTarget.addEventListener(sEvtType,fnHandle,false); 5 }else if(oTarget.attachEvent){ 6 oTarget.attachEvent("on" + sEvtType,fnHandle); 7 }else{ 8 oTarget["on" + sEvtType] = fnHandle; 9 } 10 }
54、原生JavaScript去掉url前缀
1 function removeUrlPrefix(a){ 2 a=a.replace(/:/g,":").replace(/./g,".").replace(///g,"/"); 3 while(trim(a).toLowerCase().indexOf("http://")==0){ 4 a=trim(a.replace(/http:\/\//i,"")); 5 } 6 return a; 7 }
55、原生JavaScript随机数时间戳
1 function uniqueId(){ 2 var a=Math.random,b=parseInt; 3 return Number(new Date()).toString()+b(10*a())+b(10*a())+b(10*a()); 4 }
56、原生JavaScript全角半角转换,iCase: 0全到半,1半到全,其他不转化
1 function chgCase(sStr,iCase){ 2 if(typeof sStr != "string" || sStr.length <= 0 || !(iCase === 0 || iCase == 1)){ 3 return sStr; 4 } 5 var i,oRs=[],iCode; 6 if(iCase){/*半->全*/ 7 for(i=0; i<sStr.length;i+=1){ 8 iCode = sStr.charCodeAt(i); 9 if(iCode == 32){ 10 iCode = 12288; 11 }else if(iCode < 127){ 12 iCode += 65248; 13 } 14 oRs.push(String.fromCharCode(iCode)); 15 } 16 }else{/*全->半*/ 17 for(i=0; i<sStr.length;i+=1){ 18 iCode = sStr.charCodeAt(i); 19 if(iCode == 12288){ 20 iCode = 32; 21 }else if(iCode > 65280 && iCode < 65375){ 22 iCode -= 65248; 23 } 24 oRs.push(String.fromCharCode(iCode)); 25 } 26 } 27 return oRs.join(""); 28 }
57、原生JavaScript确认是否键盘有效输入值
1 function checkKey(iKey){ 2 if(iKey == 32 || iKey == 229){return true;}/*空格和异常*/ 3 if(iKey>47 && iKey < 58){return true;}/*数字*/ 4 if(iKey>64 && iKey < 91){return true;}/*字母*/ 5 if(iKey>95 && iKey < 108){return true;}/*数字键盘1*/ 6 if(iKey>108 && iKey < 112){return true;}/*数字键盘2*/ 7 if(iKey>185 && iKey < 193){return true;}/*符号1*/ 8 if(iKey>218 && iKey < 223){return true;}/*符号2*/ 9 return false; 10 }
58、原生JavaScript获取网页被卷去的位置
1 function getScrollXY() { 2 return document.body.scrollTop ? { 3 x: document.body.scrollLeft, 4 y: document.body.scrollTop 5 }: { 6 x: document.documentElement.scrollLeft, 7 y: document.documentElement.scrollTop 8 } 9 }
59、原生JavaScript另一种正则日期格式化函数+调用方法
1 Date.prototype.format = function(format){ //author: meizz 2 var o = { 3 "M+" : this.getMonth()+1, //month 4 "d+" : this.getDate(), //day 5 "h+" : this.getHours(), //hour 6 "m+" : this.getMinutes(), //minute 7 "s+" : this.getSeconds(), //second 8 "q+" : Math.floor((this.getMonth()+3)/3), //quarter 9 "S" : this.getMilliseconds() //millisecond 10 } 11 if(/(y+)/.test(format)) format=format.replace(RegExp.$1, 12 (this.getFullYear()+"").substr(4 - RegExp.$1.length)); 13 for(var k in o)if(new RegExp("("+ k +")").test(format)) 14 format = format.replace(RegExp.$1, 15 RegExp.$1.length==1 ? o[k] : 16 ("00"+ o[k]).substr((""+ o[k]).length)); 17 return format; 18 } 19 alert(new Date().format("yyyy-MM-dd hh:mm:ss"));
60、原生JavaScript时间个性化输出功能
1 /* 2 1、< 60s, 显示为“刚刚” 3 2、>= 1min && < 60 min, 显示与当前时间差“XX分钟前” 4 3、>= 60min && < 1day, 显示与当前时间差“今天 XX:XX” 5 4、>= 1day && < 1year, 显示日期“XX月XX日 XX:XX” 6 5、>= 1year, 显示具体日期“XXXX年XX月XX日 XX:XX” 7 */ 8 function timeFormat(time){ 9 var date = new Date(time) 10 , curDate = new Date() 11 , year = date.getFullYear() 12 , month = date.getMonth() + 1 13 , day = date.getDate() 14 , hour = date.getHours() 15 , minute = date.getMinutes() 16 , curYear = curDate.getFullYear() 17 , curHour = curDate.getHours() 18 , timeStr; 19 20 if(year < curYear){ 21 timeStr = year +'年'+ month +'月'+ day +'日 '+ hour +':'+ minute; 22 }else{ 23 var pastTime = curDate - date 24 , pastH = pastTime/3600000; 25 26 if(pastH > curHour){ 27 timeStr = month +'月'+ day +'日 '+ hour +':'+ minute; 28 }else if(pastH >= 1){ 29 timeStr = '今天 ' + hour +':'+ minute +'分'; 30 }else{ 31 var pastM = curDate.getMinutes() - minute; 32 if(pastM > 1){ 33 timeStr = pastM +'分钟前'; 34 }else{ 35 timeStr = '刚刚'; 36 } 37 } 38 } 39 return timeStr; 40 }
61、原生JavaScript解决offsetX兼容性问题
1 // 针对火狐不支持offsetX/Y 2 function getOffset(e){ 3 var target = e.target, // 当前触发的目标对象 4 eventCoord, 5 pageCoord, 6 offsetCoord; 7 8 // 计算当前触发元素到文档的距离 9 pageCoord = getPageCoord(target); 10 11 // 计算光标到文档的距离 12 eventCoord = { 13 X : window.pageXOffset + e.clientX, 14 Y : window.pageYOffset + e.clientY 15 }; 16 17 // 相减获取光标到第一个定位的父元素的坐标 18 offsetCoord = { 19 X : eventCoord.X - pageCoord.X, 20 Y : eventCoord.Y - pageCoord.Y 21 }; 22 return offsetCoord; 23 } 24 25 function getPageCoord(element){ 26 var coord = { X : 0, Y : 0 }; 27 // 计算从当前触发元素到根节点为止, 28 // 各级 offsetParent 元素的 offsetLeft 或 offsetTop 值之和 29 while (element){ 30 coord.X += element.offsetLeft; 31 coord.Y += element.offsetTop; 32 element = element.offsetParent; 33 } 34 return coord; 35 }
62、原生JavaScript常用的正则表达式
1 //正整数 2 /^[0-9]*[1-9][0-9]*$/; 3 //负整数 4 /^-[0-9]*[1-9][0-9]*$/; 5 //正浮点数 6 /^(([0-9]+\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\.[0-9]+)|([0-9]*[1-9][0-9]*))$/; 7 //负浮点数 8 /^(-(([0-9]+\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\.[0-9]+)|([0-9]*[1-9][0-9]*)))$/; 9 //浮点数 10 /^(-?\d+)(\.\d+)?$/; 11 //email地址 12 /^[\w-]+(\.[\w-]+)*@[\w-]+(\.[\w-]+)+$/; 13 //url地址 14 /^[a-zA-z]+://(\w+(-\w+)*)(\.(\w+(-\w+)*))*(\?\S*)?$/; 15 //年/月/日(年-月-日、年.月.日) 16 /^(19|20)\d\d[- /.](0[1-9]|1[012])[- /.](0[1-9]|[12][0-9]|3[01])$/; 17 //匹配中文字符 18 /[\u4e00-\u9fa5]/; 19 //匹配帐号是否合法(字母开头,允许5-10字节,允许字母数字下划线) 20 /^[a-zA-Z][a-zA-Z0-9_]{4,9}$/; 21 //匹配空白行的正则表达式 22 /\n\s*\r/; 23 //匹配中国邮政编码 24 /[1-9]\d{5}(?!\d)/; 25 //匹配身份证 26 /\d{15}|\d{18}/; 27 //匹配国内电话号码 28 /(\d{3}-|\d{4}-)?(\d{8}|\d{7})?/; 29 //匹配IP地址 30 /((2[0-4]\d|25[0-5]|[01]?\d\d?)\.){3}(2[0-4]\d|25[0-5]|[01]?\d\d?)/; 31 //匹配首尾空白字符的正则表达式 32 /^\s*|\s*$/; 33 //匹配HTML标记的正则表达式 34 < (\S*?)[^>]*>.*?|< .*? />;
63、原生JavaScript实现返回顶部的通用方法
1 function backTop(btnId) { 2 var btn = document.getElementById(btnId); 3 var d = document.documentElement; 4 var b = document.body; 5 window.onscroll = set; 6 btn.style.display = "none"; 7 btn.onclick = function() { 8 btn.style.display = "none"; 9 window.onscroll = null; 10 this.timer = setInterval(function() { 11 d.scrollTop -= Math.ceil((d.scrollTop + b.scrollTop) * 0.1); 12 b.scrollTop -= Math.ceil((d.scrollTop + b.scrollTop) * 0.1); 13 if ((d.scrollTop + b.scrollTop) == 0) clearInterval(btn.timer, window.onscroll = set); 14 }, 15 10); 16 }; 17 function set() { 18 btn.style.display = (d.scrollTop + b.scrollTop > 100) ? 'block': "none" 19 } 20 }; 21 backTop('goTop');
64、原生JavaScript获得URL中GET参数值
1 // 用法:如果地址是 test.htm?t1=1&t2=2&t3=3, 那么能取得:GET["t1"], GET["t2"], GET["t3"] 2 function get_get(){ 3 querystr = window.location.href.split("?") 4 if(querystr[1]){ 5 GETs = querystr[1].split("&") 6 GET =new Array() 7 for(i=0;i<GETs.length;i++){ 8 tmp_arr = GETs[i].split("=") 9 key=tmp_arr[0] 10 GET[key] = tmp_arr[1] 11 } 12 } 13 return querystr[1]; 14 }
65、原生JavaScript实现全选通用方法
1 function checkall(form, prefix, checkall) { 2 var checkall = checkall ? checkall : 'chkall'; 3 for(var i = 0; i < form.elements.length; i++) { 4 var e = form.elements[i]; 5 if(e.type=="checkbox"){ 6 e.checked = form.elements[checkall].checked; 7 } 8 } 9 }
66、原生JavaScript实现全部取消选择通用方法
1 function uncheckAll(form) { 2 for (var i=0;i<form.elements.length;i++){ 3 var e = form.elements[i]; 4 if (e.name != 'chkall') 5 e.checked=!e.checked; 6 } 7 }
67、原生JavaScript实现打开一个窗体通用方法
1 function openWindow(url,windowName,width,height){ 2 var x = parseInt(screen.width / 2.0) - (width / 2.0); 3 var y = parseInt(screen.height / 2.0) - (height / 2.0); 4 var isMSIE= (navigator.appName == "Microsoft Internet Explorer"); 5 if (isMSIE) { 6 var p = "resizable=1,location=no,scrollbars=no,width="; 7 p = p+width; 8 p = p+",height="; 9 p = p+height; 10 p = p+",left="; 11 p = p+x; 12 p = p+",top="; 13 p = p+y; 14 retval = window.open(url, windowName, p); 15 } else { 16 var win = window.open(url, "ZyiisPopup", "top=" + y + ",left=" + x + ",scrollbars=" + scrollbars + ",dialog=yes,modal=yes,width=" + width + ",height=" + height + ",resizable=no" ); 17 eval("try { win.resizeTo(width, height); } catch(e) { }"); 18 win.focus(); 19 } 20 }
68、原生JavaScript判断是否为客户端设备
1 function client(o){ 2 var b = navigator.userAgent.toLowerCase(); 3 var t = false; 4 if (o == 'isOP'){ 5 t = b.indexOf('opera') > -1; 6 } 7 if (o == 'isIE'){ 8 t = b.indexOf('msie') > -1; 9 } 10 if (o == 'isFF'){ 11 t = b.indexOf('firefox') > -1; 12 } 13 return t; 14 }
69、原生JavaScript获取单选按钮的值
1 function get_radio_value(field){ 2 if(field&&field.length){ 3 for(var i=0;i<field.length;i++){ 4 if(field[i].checked){ 5 return field[i].value; 6 } 7 } 8 }else { 9 return ; 10 } 11 }
70、原生JavaScript获取复选框的值
1 function get_checkbox_value(field){ 2 if(field&&field.length){ 3 for(var i=0;i<field.length;i++){ 4 if(field[i].checked && !field[i].disabled){ 5 return field[i].value; 6 } 7 } 8 }else { 9 return; 10 } 11 }
相关推荐
根据提供的文件信息,我们可以归纳总结出以下几个JavaScript实用功能代码片段的知识点: ### 1. 字符串截取:中文字符的正确处理 **代码片段**: ```javascript function cutstr(str, len) { var temp; var ...
在JavaScript的世界里,掌握一些实用的功能代码片段是提升开发效率的关键。这些代码片段涵盖了各种常见的前端开发场景,从DOM操作到事件处理,再到数据处理和动画效果,无一不是前端开发者日常所需。以下是对这些...
81、原生JavaScript用正则表达式提取页面代码中所有网址 82、原生JavaScript用正则表达式清除相同的数组(低效率) 83、原生JavaScript用正则表达式清除相同的数组(高效率) 84、原生JavaScript用正则表达式按字母排序...
本文将介绍40个可以直接使用的JavaScript实用功能代码,旨在帮助开发者提高效率,减少重复工作。这些功能包括字符串处理、URL解析、日期时间格式化等多个方面。 首先,字符串处理是常见的任务。例如,`cutstr()`...
标题中提到的是“直接拿来用的15个jQuery代码片段”,这表明本文将分享十五个可以直接应用于项目中的实用jQuery代码片段。jQuery是广泛使用的一个JavaScript库,它简化了HTML文档遍历、事件处理、动画以及AJAX交互...
《网页易筋经》通过实例教学的方式,将复杂的HTML语法转化为直观、可操作的代码片段,使得读者能够直接复制并应用到自己的网页中,大大降低了学习门槛。 首先,我们来了解一下HTML的基本结构。一个基本的HTML页面...
描述中的"个人收藏经典代码"暗示这些代码是某个开发者认为有价值和实用的部分,可能是他们在开发过程中遇到的问题解决方案,或者是他们觉得设计巧妙、性能高效的代码片段。"穷了,拿点东西换点分"这部分可能是该...
"AmazeUI模板简介有效,可以直接拿来使用"这句话表明这些模板经过验证,是可靠的,并且无需过多修改就能满足基本需求。 在压缩包中的"AMAZUI"文件可能包含了以下内容: 1. HTML模板:这些文件以.html为扩展名,...
在前端开发领域,demo通常指的是可运行的、小型的代码片段,用于展示特定功能或技术的实现。这些小案例涵盖了前端开发的各个方面,可能是HTML、CSS、JavaScript的基础应用,也可能是更高级的框架如React、Vue或...
HTML到Temple是一个工具,主要用于将HTML代码片段转换为Temple模板语言,这是一种基于JavaScript的解决方案,旨在提高前端开发的效率和代码可维护性。Temple作为一种模板引擎,它的设计目的是简化HTML与JavaScript...
"birt报表常用JS.txt"可能是一份JavaScript代码片段集合,用于在Birt报表中实现动态行为和用户交互。JavaScript在Birt中起着关键作用,它允许开发者添加自定义逻辑,增强报表的功能性。 最后,"birt"可能是某个特定...
【标签】"自己拿来学习"进一步确认了这个压缩包的用途,即个人学习和自我提升。这表明文件中的内容可能并不涉及高级或专业领域的知识,而是更适合初学者的基础教程和实战练习。 虽然具体的【压缩包子文件的文件名称...
在提供的代码片段中,`setCookie`函数展示了如何使用JavaScript来设置一个Cookie。该函数接受两个参数:`name`和`value`,分别代表Cookie的名称和值。此外,它还定义了Cookie的有效期为30天。这是通过创建一个新的`...
使用IDE或代码片段工具可以更快速地生成和维护这样的基础框架。 4. **设定CSS样式框架**:除了HTML框架,还需要建立一套CSS样式基础,包括重置样式、通用类名和可复用的样式集合。这有助于减少重复代码,保持代码...