`

分享原生JavaScript技巧大收集(51~60)

阅读更多

文章来源:jquery教程 - http://www.jq-school.com/Show.aspx?id=305

51、原生JavaScript获取页面可视高度

function getPageViewHeight() {
	var d = document, a = d.compatMode == "BackCompat"
			? d.body
			: d.documentElement;
	return a.clientHeight;
}


52、原生JavaScript跨浏览器添加事件

function addEvt(oTarget,sEvtType,fnHandle){
	if(!oTarget){return;}
	if(oTarget.addEventListener){
		oTarget.addEventListener(sEvtType,fnHandle,false);
	}else if(oTarget.attachEvent){
		oTarget.attachEvent("on" + sEvtType,fnHandle);
	}else{
		oTarget["on" + sEvtType] = fnHandle;
	}
}


53、原生JavaScript跨浏览器删除事件

function delEvt(oTarget,sEvtType,fnHandle){
	if(!oTarget){return;}
	if(oTarget.addEventListener){
		oTarget.addEventListener(sEvtType,fnHandle,false);
	}else if(oTarget.attachEvent){
		oTarget.attachEvent("on" + sEvtType,fnHandle);
	}else{
		oTarget["on" + sEvtType] = fnHandle;
	}
}


54、原生JavaScript去掉url前缀

function removeUrlPrefix(a){
  a=a.replace(/:/g,":").replace(/./g,".").replace(///g,"/");
  while(trim(a).toLowerCase().indexOf("http://")==0){
    a=trim(a.replace(/http:\/\//i,""));
  }
  return a;
}


55、原生JavaScript随机数时间戳

function uniqueId(){
	var a=Math.random,b=parseInt;
	return Number(new Date()).toString()+b(10*a())+b(10*a())+b(10*a());
}


56、原生JavaScript全角半角转换,iCase: 0全到半,1半到全,其他不转化

function chgCase(sStr,iCase){
	if(typeof sStr != "string" || sStr.length <= 0 || !(iCase === 0 || iCase == 1)){
		return sStr;
	}
	var i,oRs=[],iCode;
	if(iCase){/*半->全*/
		for(i=0; i<sStr.length;i+=1){ 
			iCode = sStr.charCodeAt(i);
			if(iCode == 32){
				iCode = 12288;				
			}else if(iCode < 127){
				iCode += 65248;
			}
			oRs.push(String.fromCharCode(iCode)); 
		}		
	}else{/*全->半*/
		for(i=0; i<sStr.length;i+=1){ 
			iCode = sStr.charCodeAt(i);
			if(iCode == 12288){
				iCode = 32;
			}else if(iCode > 65280 && iCode < 65375){
				iCode -= 65248;				
			}
			oRs.push(String.fromCharCode(iCode)); 
		}		
	}		
	return oRs.join("");		
}


57、原生JavaScript确认是否键盘有效输入值

function checkKey(iKey){
	if(iKey == 32 || iKey == 229){return true;}/*空格和异常*/
	if(iKey>47 && iKey < 58){return true;}/*数字*/
	if(iKey>64 && iKey < 91){return true;}/*字母*/
	if(iKey>95 && iKey < 108){return true;}/*数字键盘1*/
	if(iKey>108 && iKey < 112){return true;}/*数字键盘2*/
	if(iKey>185 && iKey < 193){return true;}/*符号1*/
	if(iKey>218 && iKey < 223){return true;}/*符号2*/
	return false;
}


58、原生JavaScript获取网页被卷去的位置

function getScrollXY() {
    return document.body.scrollTop ? {
        x: document.body.scrollLeft,
        y: document.body.scrollTop
    }: {
        x: document.documentElement.scrollLeft,
        y: document.documentElement.scrollTop
    }
}


59、原生JavaScript另一种正则日期格式化函数+调用方法

Date.prototype.format = function(format){ //author: meizz
  var o = {
    "M+" : this.getMonth()+1, //month
    "d+" : this.getDate(),    //day
    "h+" : this.getHours(),   //hour
    "m+" : this.getMinutes(), //minute
    "s+" : this.getSeconds(), //second
    "q+" : Math.floor((this.getMonth()+3)/3),  //quarter
    "S" : this.getMilliseconds() //millisecond
  }
  if(/(y+)/.test(format)) format=format.replace(RegExp.$1,
    (this.getFullYear()+"").substr(4 - RegExp.$1.length));
  for(var k in o)if(new RegExp("("+ k +")").test(format))
    format = format.replace(RegExp.$1,
      RegExp.$1.length==1 ? o[k] :
        ("00"+ o[k]).substr((""+ o[k]).length));
  return format;
}
alert(new Date().format("yyyy-MM-dd hh:mm:ss"));


60、原生JavaScript时间个性化输出功能

/*
1、< 60s, 显示为“刚刚”
2、>= 1min && < 60 min, 显示与当前时间差“XX分钟前”
3、>= 60min && < 1day, 显示与当前时间差“今天 XX:XX”
4、>= 1day && < 1year, 显示日期“XX月XX日 XX:XX”
5、>= 1year, 显示具体日期“XXXX年XX月XX日 XX:XX”
 */
function timeFormat(time){
  var date = new Date(time)
    , curDate = new Date()
    , year = date.getFullYear()
    , month = date.getMonth() + 1
    , day = date.getDate()
    , hour = date.getHours()
    , minute = date.getMinutes()
    , curYear = curDate.getFullYear()
    , curHour = curDate.getHours()
    , timeStr;

  if(year < curYear){
    timeStr = year +'年'+ month +'月'+ day +'日 '+ hour +':'+ minute;
  }else{
    var pastTime = curDate - date
      , pastH = pastTime/3600000;

    if(pastH > curHour){
      timeStr = month +'月'+ day +'日 '+ hour +':'+ minute;
    }else if(pastH >= 1){
      timeStr = '今天 ' + hour +':'+ minute +'分';
    }else{
      var pastM = curDate.getMinutes() - minute;
      if(pastM > 1){
        timeStr = pastM +'分钟前';
      }else{
        timeStr = '刚刚';
      }
    }
  }
  return timeStr;
}

 

分享到:
评论

相关推荐

    原生JavaScript100例

    原生JavaScript100例

    基于原生JavaScript实现的扫雷小游戏.zip

    基于原生JavaScript实现的扫雷小游戏 基于原生JavaScript实现的扫雷小游戏 基于原生JavaScript实现的扫雷小游戏 基于原生JavaScript实现的扫雷小游戏 基于原生JavaScript实现的扫雷小游戏 基于原生JavaScript实现的...

    原生JavaScript飞机大战

    《原生JavaScript飞机大战》是一款基于JavaScript开发的经典小游戏,它为初学者提供了一个良好的实践平台,帮助提升JavaScript编程技能。这款游戏虽然功能相对简单,但涵盖了基础的编程概念和技巧,对于学习...

    分享10个原生JavaScript技巧

    标题中提到的“分享10个原生JavaScript技巧”,指的是文章将介绍JavaScript编程中十种有用的技巧,这些技巧通常是编程者在进行项目开发时常用到的,有助于提升开发效率或代码质量。原生JavaScript指的是不依赖任何第...

    原生javascript小练习,各种属性的用法

    在原生JavaScript的世界里,掌握各种属性的用法是提升编程技能的关键。在这个小练习中,我们将探讨如何利用JavaScript实现动画效果、创建轮播图以及利用页面存储属性等实际应用场景。下面,我们将深入讨论这些知识点...

    原生Javascript开发让你的表单亮起来

    在网页设计中,表单是不可或缺的元素,用于收集用户数据。原生JavaScript开发能帮助我们更好地控制和美化这些表单,使其更具交互性和吸引力。本文将深入探讨如何利用JavaScript来提升表单的用户体验,使其“亮起来”...

    100个直接可以拿来用的JavaScript实用功能代码片段(1-10)

    90、原生JavaScript常用的正则表达式大收集 91、原生JavaScript实现窗体改变事件resize的操作(兼容所以的浏览器) 92、原生JavaScript用正则清除空格分左右 93、原生JavaScript判断变量是否空值 94、原生JavaScript...

    基于原生JavaScript完成的网页端2048游戏,适配移动端,绑定键盘和鼠标滑动事件.zip

    基于原生JavaScript完成的网页端2048游戏,适配移动端,绑定键盘和鼠标滑动事件 基于原生JavaScript完成的网页端2048游戏,适配移动端,绑定键盘和鼠标滑动事件 基于原生JavaScript完成的网页端2048游戏,适配移动端...

    打飞机小游戏原生javascript版

    《打飞机小游戏原生JavaScript版》是一款基于HTML5技术开发的、模仿微信内置经典小游戏“打飞机”的在线娱乐项目。这款游戏充分利用了JavaScript语言的强大功能,实现了在PC端运行的轻量级互动体验,旨在为玩家提供...

    原生javascript页面图片懒加载代码

    原生javascript页面图片懒加载效果

    原生javascript实现ajax 发送post请求

    原生javascript实现ajax发送pos请求,这样可以脱离jquery框架,

    JavaScript原生拼图游戏

    JavaScript原生拼图游戏是一种基于Web的互动娱乐项目,它利用HTML、JavaScript和CSS这三种核心技术来构建。在这个游戏中,用户可以通过移动拼图块来重组一幅图像,游戏提供了简单、中等和困难三种不同的难度等级,...

    2048小游戏 - 原生JavaScript实现

    《2048小游戏 - 原生JavaScript实现》 2048是一款风靡全球的数字拼图游戏,由19岁的意大利开发者Gabriele Cirulli在2014年创造。这款游戏的目标是通过合并相同数字的方块,最终达到2048这个数字。原生JavaScript...

    jquery 库与原生javascript 常用方法

    - **体积**: jQuery库比原生JavaScript代码大,对于小项目可能增加加载时间。但可以通过使用精简版的jQuery或模块化工具来解决。 ### 结合使用 在实际开发中,开发者通常会根据需求结合使用jQuery和原生JavaScript...

    原生JavaScript轮播图特效.zip

    原生JavaScript轮播图特效

    原生javascript实现的3D轮播动画

    在这个场景中,我们关注的是如何使用原生JavaScript实现一个3D轮播动画。3D轮播动画是一种吸引用户注意力并展示多张图片或内容的有效方式,通常用于网站的首页或产品展示区域。 首先,我们要理解3D轮播动画的核心...

    一种基于原生JavaScript的焦点轮播图简易实现.pdf

    "一种基于原生JavaScript的焦点轮播图简易实现" 本文主要讲述了基于原生JavaScript的焦点轮播图简易实现方法,该方法可以简化轮播图的实现过程,不需要使用第三方框架和插件,使得JavaScript初学者也可以轻松实现...

    原生JavaScript在网页实现类似excel.rar

    在网页上实现类似Excel的功能,原生JavaScript是一个常见的选择,因为它是所有浏览器都支持的基础脚本语言,无需依赖外部库。下面将详细讲解如何利用原生JavaScript实现这一目标,以及可能涉及的技术点。 首先,...

Global site tag (gtag.js) - Google Analytics