站三界导航
首页 JS代码
  • js常用代码
    js常用代码

    创建过去七天的数组vara=[...Array(7).keys()].map(days=>newDate(Date.now()-86400000*days));创建未来七天的数组varb=[...Array(7).keys()].map(days=>newDate(Date.now()+86400000*days));生成长度为11的随机字母数字字符串varc=Math.random().toString(36).substring(2);获取URL的查询参数q={};location.search.replace(/([^?&=]+)=([^&]+)/g,(_,k,v)=>q[k]=v);q;随机更改数组元素顺序,混淆数组{letf=(arr)=>arr.slice().sort(()=>Math.random()-0.5)letq=f([1,2,3,4,5])console.log(q)}生成随机十六进制代码如:'#c618b2'生成随机十六进制代码(生成随机颜色)letcolor='#'+Math.floor(Math.random()*0xffffff).toString(16).padEnd(6,'0');数组去重letarr=[1,2,3,3,2,1,5,1,6,0,4];vararrs=[...newSet(arr)];console.log(arrs)方便快捷创建特定大小的数组console.log([...Array(4).keys()])

    • JS代码
    • 146阅读
    • 2022-05-04

  • JavaScript常用代码段
    JavaScript常用代码段

    功能:修改window.setTimeout,使之可以传递参数和对象参数(同样可用于setInterval)  使用方法: setTimeout(回调函数,时间,参数1,...,参数n)(FF已经原生支持,IE不支持)var__sto=setTimeout;window.setTimeout=function(callback,timeout,param){varargs=Array.prototype.slice.call(arguments,2);var_cb=function(){callback.apply(null,args);}__sto(_cb,timeout);}functionaaaaa(a,b,c){alert(a+b+c);}window.setTimeout(aaaaa,2000,5,6,7);功能:理解递归程序的返回规律(从内到外) 对象之间成员的互引用varninja={yell:function(n){returnn>0?ninja.yell(n-1)+"a":"hiy";}};alert(ninja.yell(4))//结果为:hiyaaaa;varsamurai={yell:ninja.yell};//varninja={};//此处注释与否对结果有影响try{alert(samurai.yell(4));}catch(e){alert("Uh,thisisn'tgood!Where'dninja.yellgo?");}功能:截取长字符串{string}str要截取的字符串{number}size截取长度(单字节长度)varsubStr=function(str,size){varcurSize=0,arr=[];for(vari=0,len=str.length;i<len;i++){arr.push(str.charAt(i));if(str.charCodeAt(i)>255){curSize+=2;if(size===curSize||size===curSize-1){returnarr.join('');}}else{curSize++;if(size===curSize){returnarr.join('');}}}};varstr='#%*……&#什么东西1234abcd还不够长';alert(str.length);alert(str.substr(0,15));alert(subStr(str,15));功能:取得元素在页面中的绝对位置(相对于页面左上角) {string}node待求位置的DOM元素functiongetAbsPosition(node){vart=node.offsetTop;varl=node.offsetLeft;while(node=node.offsetParent){t+=node.offsetTop;l+=node.offsetLeft;}alert("top="+t+"\n"+"left="+l);}功能:统计、去除重复字符 str需要统计的字符串说明:常用于字符串中重复字符,或者数组中重复的字母、数字等个数统计。此处从网上收集两种典型的类型,分别有两种实现方法,其他还有许多变种,从不同角度编写,可搜索学习。待统计的数据,不论是数组和字符串都可以,只用借助String.split()或Array.join()转换为函数参数要求的类型即可。   类型一:借助新建对象来保存数据varcount1=function(str){varmap={},maxCount=0,maxChar,undefined,i=str.length;while(i--){vart=str.charAt(i);map[t]==undefined?map[t]=1:map[t]+=1;if(map[t]>maxCount){maxChar=t;maxCount=map[maxChar];}}return"字符:"+maxChar+"次数:"+maxCount;}functions_0(a){//此处参数应为数组类型varb={},c=[],i;for(i=0;i<a.length;i++){if(!b[a[i]]){c[c.length]=a[i],b[a[i]]=true;}}returnc;}类型二:正则表达式匹配统计varcount2=function(str){varmost=str.split('').sort().join('').match(/(.)\1*/g);//排列重复字符most=most.sort(function(a,b){returna.length-b.length}).pop();//按出现频繁排序returnmost.length+':'+most[0];}functions_1(a){vara=a.join(""),b=[];while(a.length>0)a=a.replace(newRegExp((b[b.length]=a.charAt(0)),"g"),"");returnb;}功能:把有序数组打乱(产生无序随机数组)说明:基本的排序算法大家应该都很清楚。但是在编程中也经常用到相反的操作,即把原来有序的数组元素随机打乱。以下给出三种方法,第一种是以前我自己写出来的,由于水平差,写出的代码时间复杂度太大,于是从网上搜索一些简单而且效率高的方法来。第二种据说是“洗牌算法”,想必很多人都听说过;第三种是利用JS的内置sort方法,这种实现起来很简单。 方法1(给大家做失败的教训借鉴)functionrandArray(num){varrands=[];varra=parseInt(num*Math.random());rands.push(ra);for(varr=0;r<num-1;r++){ra=parseInt(num*Math.random());for(varm=0;m<rands.length;m++){while(rands[m]==ra){ra=parseInt(num*Math.random());m=-1;}}rands.push(ra);}//alert(rands);returnrands;}方法2:选择两个[0...array.Length)之间的随机数,把它们做下标的两个元素交换位置(这样乱序效率高)说明:这是“洗牌算法”有人证明打乱的效果如下:随机交换nums/2次的效果很差,平均约1/3的对象还在原来的位置随机交换nums次才基本可用,平均约15%的对象还在原来的位置随机交换nums*2次才真正可用,平均约2%的对象还在原来的位置functiondaluan(nums){vararray=[];for(vari=0;i<nums;i++){array[i]=i;}for(vari=0;i<nums;i++){varrand=parseInt(nums*Math.random());vartemp=array[i];array[i]=array[rand];array[rand]=temp;}returnarray;}方法3:让比较函数随机传回-1或1就可以了(这样乱序效率可能不高)vartestArray3=[1,2,3,4,5,6,7,8,9,10,22,33,55,77,88,99];testArray3.sort(function(){returnMath.random()>0.5?-1:1;});alert(testArray3);

    • JS代码
    • 157阅读
    • 2022-05-04

  • 15个工作中会用到的JS代码片段
    15个工作中会用到的JS代码片段

    JavaScript是你学习编程,可以选择学习的最流行的语言之一。当我开始学习JavaScript时,我总是在StackOverflow、Medium和其他博客上寻找优秀解决方案来处理实际开发中遇到的问题。在本文中,我将分享我发现的15个有用的JavaScript代码段。1、不循环地重复一个字符串此JavaScript代码段将展示如何在不使用任何循环的情况下重复字符串。我们将通过JavaScript中的repeat()方法来构建一个数字,该数字将作为你需要的数字副本。//OldMethodfor(vari=0;i<5;i++){console.log("1")//1111}//BestMethodconsole.log("1".repeat(5))//111112、数组的差异这一个很棒的代码片段,可以帮助你区分数组。当你处理一个长数组并想知道该数组的相似之处或不同之处时,这个会派上用场。下面的示例代码将帮助你更加清晰理解,你可以在你的JavaScript项目中自由使用这些代码。//CodeExamplefunctionArrayDiff(a,b){constsetX=newSet(a)constsetY=newSet(b)return[...a.filter(x=>!setY.has(x)),...b.filter(x=>!setX.has(x))]}constArray1=[1,2,3];constArray2=[1,2,3,4,5];console.log(ArrayDiff(Array1,Array2))//[4,5]3、String是否为Json当你需要检查数据是字符串,还是JSON时,此代码段将派上用场。假设你从服务器端获得响应并解析该数据,你需要检查它是JSON还是字符串。下面的代码片段。//CodeExamplefunctionisJSON(str){try{JSON.parse(str)}catch{returnfalse}returntrue}varstr="JavaScript"console.log(isJSON(str))//false4、简短的Console.log厌倦了一遍又一遍地编写console.log()吗?不用担心,这个片段会为你节省大量时间来编写长长的console.log()。varcl=console.log.bind(document)cl(345)cl("JAVASCRIPT")cl("PROGRAMMING")<--Giveitatry!-->5、全部替换此代码段将向你展示如何替换字符串中的单词,而无需迭代每个单词、匹配它并放置新单词。下面的代码片段使用了replaceAll(TargetWord,NewWord)方法。//CodeExamplevarstr="PythonisaProgrammingLanguage,Pythonisatopprogramminglanguageandfavouriteofeverydeveloper"str=str.replaceAll("Python","JavaScript")console.log(str)//JavaScriptisaProgrammingLanguage,JavaScript5isatopprogramminglanguageandfavouriteofeverydeveloper6、将数字转换数字数组此代码段可用于将数字转换为数字数组。使用带有map的扩展运算符,我们可以在一秒钟内完成此操作。试一试://examplecodeconstNumberToArray=number=>[...`${number}`].map(i=>parseInt(i));console.log(NumberToArray(86734))//[8,6,7,3,4]console.log(NumberToArray(1234))//[1,2,3,4]console.log(NumberToArray(9000))//[9,0,0,0]7、检查数字是否为2的幂现在,此代码段将帮助你检查是否为2的幂。尝试从下面的示例代码中理解它。//examplecodeconstisPowerTwo=n=>!!n&&(n&(n-1))==0;console.log(isPowerTwo(3))//trueconsole.log(isPowerTwo(8))//trueconsole.log(isPowerTwo(4))//true8、数字转换为二进制此代码段将使用toString()方法简单地将数字转换为二进制。看看下面的代码示例。varn1=500console.log(n1.toString(2))//111110100varn2=4console.log(n2.toString(2))//100varn3=5004console.log(n3.toString(2))//10011100011009、返回数组的幂集此代码段将返回你的任何数字数组的Powerset。检查下面的代码片段以获得更好的理解。//examplecodeconstPowerSet=array=>array.reduce((accumalator,current)=>accumalator.concat(accumalator.map(n=>[current].concat(n))),[[]]);console.log(PowerSet([1,2]))10、从数组中删除元素当你需要从数组中删除元素时,此代码段将派上用场。在下面的代码片段示例中,我们使用了array.slice()内置方法。//examplecodeconstDropElement=(array,num=1)=>array.slice(num);console.log(DropElement([2,45,6,7],2))//[6,7]console.log(DropElement([2,45,6,7],1))//[45,6,7]11、反转字符串现在你不需要循环遍历字符串来反转它。此代码段将展示如何使用扩展运算符(...)和reverse()函数来反转字符串。这在反转大字符串时会派上用场,你需要为此提供快速片段代码。检查下面的代码示例。//examplecodefunctionReverse(str){return[...str].reverse().join('');}console.log(Reverse("data"))//atadconsole.log(Reverse("Code"))//edoC12、深度扁平化阵列展平数组是将任何有序数组和二维数组转换为一维数组的过程。简而言之,你可以降低数组的维数。你已经看过FlattenArray片段代码,但是深展平数组呢。当你有一个大的有序数组并且正常的展平对它不起作用时,此代码段非常有用。为此,你将需要一个深展平。//examplecodefunctionDeepFlat(array){return[].concat(...array.map(value=>(Array.isArray(value)?DeepFlat(value):value)));}console.log(DeepFlat([1,[2,[4,6,6,[9]],0,],1]))//[1,2,4,6,6,9,0,1]13、计算字节大小每个程序员的目标都是让他们的JavaScript程序高效并具有良好的性能。为此,我们需要确保我们有一些不会让我们的内存过载的数据大小。查看下面的代码片段以了解如何检查任何数据的字节。//bytesizecalculationconstByteSize=string=>newBlob([string]).size;console.log(ByteSize("Codding"))//7console.log(ByteSize(true))//4console.log(ByteSize("4"))//414、数组转为CSVCSV是当今广泛使用的电子表格,你可以使用如下所示的简单代码段将数组转换为CSV文件。//CodeExampleconstArrayToCsv=(array,delimiter=',')=>array.map(value=>value.map(num=>`"${num}"`).join(delimiter)).join('\n');console.log(ArrayToCsv([['name','age'],['haider','22'],['Peter','23']]))//Output//"name","age"//"haider","22"//"Peter","23"15、数组的最后一个元素现在,你不再需要遍历或循环整个数组并提取最后一个元素。你可以使用以下简单的代码片段执行相同的操作。//codeexampleconstLastElement=array=>array[array.length-1];console.log(LastElement([2,3,4]))//4console.log(LastElement([2,3,4,5]))//5console.log(LastElement([2,3]))//3以上就是我今天与你分享的15个JavaScript代码片段,我希望你喜欢这篇文章,并从这篇文章中学到一些新东西。最后,如果你觉得今天内容对你有帮助,请与你的JavaScript开发人员朋友分享它。

    • JS代码
    • 161阅读
    • 2022-05-04

  • js 加载动画
    js 加载动画

    html<divid="loading"style="text-align:center;"><divclass="loader"style="position:absolute;top:50%;left:50%;margin:-75px00-75px;width:150px;height:150px;"title="loading..."><svgversion="1.1"id="loader-1"xmlns="http://www.w3.org/2000/svg"xmlns:xlink="http://www.w3.org/1999/xlink"x="-100px"y="0px"width="150px"height="150px"viewBox="005050"style="enable-background:new005050;"xml:space="preserve"><pathfill="#00cec9"d="M25.251,6.461c-10.318,0-18.683,8.365-18.683,18.683h4.068c0-8.071,6.543-14.615,14.615-14.615V6.461z"><animateTransformattributeType="xml"attributeName="transform"type="rotate"from="02525"to="3602525"dur="1s"repeatCount="indefinite"></animateTransform></path></svg><h4id="information"style="color:#fff;font-size:large;">loading</h4></div></div>cssbody{background-color:#636e72;}js/*-------------------------------------------配置参数----------------------------------------*/vardata_group=newArray("loading","loading.","loading..","loading...");//需要的数组字符串varID="information";//操作IDvarspeed=400;//执行速率varEndvalue=4;//结束值varstartvalue=0;//初始值/*--------------------------------------------运算器----------------------------------------*/num=startvalue;vart=setInterval(function(){num++;if(num==Endvalue){num=0;}//执行内容document.getElementById(ID).innerHTML=data_group[num];},speed);

    • JS代码
    • 151阅读
    • 2022-05-04

  • js网页禁止右键下载代码
    js网页禁止右键下载代码

    jsvarh=window.innerHeight,w=window.innerWidth;////禁用右键(防止右键查看源代码)window.oncontextmenu=function(){returnfalse;}////在本网页的任何键盘敲击事件都是无效操作(防止F12和shift+ctrl+i调起开发者工具)window.onkeydown=window.onkeyup=window.onkeypress=function(){window.event.returnValue=false;returnfalse;}////如果用户在工具栏调起开发者工具,那么判断浏览器的可视高度和可视宽度是否有改变,如有改变则关闭本页面window.onresize=function(){if(h!=window.innerHeight||w!=window.innerWidth){window.close();window.location="about:blank";}}document.onkeydown=function(e){e=window.event||e;varkeycode=e.keyCode||e.which;if(e.ctrlKey||e.altKey||e.shiftKey||keycode>=112&&keycode<=123){if(window.event){ietry{e.keyCode=0;}catch(e){}e.returnValue=false;}else{ffe.preventDefault();}}}

    • JS代码
    • 157阅读
    • 2022-05-04

  • 日历背景变色
    日历背景变色

    html<divclass="calendar"><divclass="header"><adata-action="prev-month"href="javascript:void(0)"title="PreviousMonth"><i></i></a><divclass="text"data-render="month-year"></div><adata-action="next-month"href="javascript:void(0)"title="NextMonth"><i></i></a></div><divclass="months"data-flow="left"><divclass="monthmonth-a"><divclass="renderrender-a"></div></div><divclass="monthmonth-b"><divclass="renderrender-b"></div></div></div></div>cssbody{margin:0;color:#444;background-color:#98c2c2;font:30018px/18pxRoboto,sans-serif;transition:background.4sease-in-out0s;}*,:after,:before{box-sizing:border-box}.pull-left{float:left}.pull-right{float:right}.clearfix:after,.clearfix:before{content:'';display:table}.clearfix:after{clear:both;display:block}.calendar{width:300px;font-size:100%;margin:50pxauto0;-webkit-perspective:1000px;perspective:1000px;cursor:default;position:relative}.calendar.header{height:100px;position:relative;color:#fff}.calendar.header.text{position:absolute;top:0;left:0;right:0;bottom:0;background-color:#308ff0;padding:15px;-webkit-transform:rotateX(90deg);transform:rotateX(90deg);-webkit-transform-origin:bottom;transform-origin:bottom;-webkit-backface-visibility:hidden;backface-visibility:hidden;transition:.4sease-in-out0s;box-shadow:06px20px0rgba(0,0,0,.19),08px17px0rgba(0,0,0,.2);opacity:0}.calendar.header.text>span{text-align:center;padding:26px;display:block}.calendar.header.active.text{-webkit-transform:rotateX(0deg);transform:rotateX(0deg);opacity:1}.months{width:100%;height:280px;position:relative}.months.hr{height:1px;margin:15px0;background:#ccc}.month{padding:15px;width:inherit;height:inherit;background:#fff;position:absolute;-webkit-backface-visibility:hidden;backface-visibility:hidden;transition:all.4sease-in-out0s;box-shadow:06px20px0rgba(0,0,0,.19),08px17px0rgba(0,0,0,.2)}.months[data-flow="left"].month{-webkit-transform:rotateY(-180deg);transform:rotateY(-180deg)}.months[data-flow="right"].month{-webkit-transform:rotateY(180deg);transform:rotateY(180deg)}.table{width:100%;font-size:10px;font-weight:400;display:table}.table.row{display:table-row}.table.row.head{color:#308ff0;text-transform:uppercase}.table.row.cell{width:14.28%;padding:5px;text-align:center;display:table-cell}.table.row.cell.disable{color:#ccc}.table.row.cellspan{display:block;width:28px;height:28px;line-height:28px;transition:color,background.4sease-in-out0s}.table.row.cell.activespan{color:#fff;background-color:#308ff0}.months.month[data-active="true"]{-webkit-transform:rotateY(0);transform:rotateY(0)}.header[data-action]{color:inherit;position:absolute;top:50%;margin-top:-20px;width:40px;height:40px;z-index:1;opacity:0;transition:all.4sease-in-out0s}.header[data-action]>i{width:20px;height:20px;display:block;position:absolute;left:50%;top:50%;margin-top:-10px;margin-left:-10px}.header[data-action]>i:before,.header[data-action]>i:after{top:50%;margin-top:-1px;content:'';position:absolute;height:2px;width:20px;border-top:2pxsolid;border-radius:2px}.header[data-action*="prev"]{left:15px}.header[data-action*="next"]{right:15px}.header[data-action*="prev"]>i:before,.header[data-action*="prev"]>i:after{left:0}.header[data-action*="prev"]>i:before{top:3px;-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}.header[data-action*="prev"]>i:after{top:auto;bottom:3px;-webkit-transform:rotate(45deg);transform:rotate(45deg)}.header[data-action*="next"]>i:before,.header[data-action*="next"]>i:after{right:0}.header[data-action*="next"]>i:before{top:auto;bottom:3px;-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}.header[data-action*="next"]>i:after{top:3px;-webkit-transform:rotate(45deg);transform:rotate(45deg)}.header.active[data-action]{opacity:1}[data-theme="jan"]{background-color:#90CAF9}[data-theme="jan"].row.head{color:#1E88E5}[data-theme="jan"].header.text,[data-theme="jan"].table.row.cell.activespan{background-color:#1E88E5}[data-theme="feb"]{background-color:#81D4FA}[data-theme="feb"].row.head{color:#039BE5}[data-theme="feb"].header.text,[data-theme="feb"].table.row.cell.activespan{background-color:#039BE5}[data-theme="mar"]{background-color:#80CBC4}[data-theme="mar"].row.head{color:#00897B}[data-theme="mar"].header.text,[data-theme="mar"].table.row.cell.activespan{background-color:#00897B}[data-theme="apr"]{background-color:#C5E1A5}[data-theme="apr"].row.head{color:#7CB342}[data-theme="apr"].header.text,[data-theme="apr"].table.row.cell.activespan{background-color:#7CB342}[data-theme="may"]{background-color:#FFE082}[data-theme="may"].row.head{color:#FFB300}[data-theme="may"].header.text,[data-theme="may"].table.row.cell.activespan{background-color:#FFB300}[data-theme="jun"]{background-color:#FFAB91}[data-theme="jun"].row.head{color:#F4511E}[data-theme="jun"].header.text,[data-theme="jun"].table.row.cell.activespan{background-color:#F4511E}[data-theme="jul"]{background-color:#CE93D8}[data-theme="jul"].row.head{color:#8E24AA}[data-theme="jul"].header.text,[data-theme="jul"].table.row.cell.activespan{background-color:#8E24AA}[data-theme="aug"]{background-color:#B39DDB}[data-theme="aug"].row.head{color:#5E35B1}[data-theme="aug"].header.text,[data-theme="aug"].table.row.cell.activespan{background-color:#5E35B1}[data-theme="sep"]{background-color:#EF9A9A}[data-theme="sep"].row.head{color:#E53935}[data-theme="sep"].header.text,[data-theme="sep"].table.row.cell.activespan{background-color:#E53935}[data-theme="oct"]{background-color:#CE93D8}[data-theme="oct"].row.head{color:#8E24AA}[data-theme="oct"].header.text,[data-theme="oct"].table.row.cell.activespan{background-color:#8E24AA}[data-theme="nov"]{background-color:#BCAAA4}[data-theme="nov"].row.head{color:#6D4C41}[data-theme="nov"].header.text,[data-theme="nov"].table.row.cell.activespan{background-color:#6D4C41}[data-theme="dec"]{background-color:#B0BEC5}[data-theme="dec"].row.head{color:#546E7A}[data-theme="dec"].header.text,[data-theme="dec"].table.row.cell.activespan{background-color:#546E7A}jsvarCalendar=function(t){this.divId=t.RenderID?t.RenderID:'[data-render="calendar"]',this.DaysOfWeek=t.DaysOfWeek?t.DaysOfWeek:["Sun","Mon","Tue","Wed","Thu","Fri","Sat"],this.Months=t.Months?t.Months:["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"];vare=newDate;this.CurrentMonth=e.getMonth(),this.CurrentYear=e.getFullYear();varr=t.Format;this.f="string"==typeofr?r.charAt(0).toUpperCase():"M"};Calendar.prototype.nextMonth=function(){11==this.CurrentMonth?(this.CurrentMonth=0,this.CurrentYear=this.CurrentYear+1):this.CurrentMonth=this.CurrentMonth+1,this.divId='[data-active="false"].render',this.showCurrent()},Calendar.prototype.prevMonth=function(){0==this.CurrentMonth?(this.CurrentMonth=11,this.CurrentYear=this.CurrentYear-1):this.CurrentMonth=this.CurrentMonth-1,this.divId='[data-active="false"].render',this.showCurrent()},Calendar.prototype.previousYear=function(){this.CurrentYear=this.CurrentYear-1,this.showCurrent()},Calendar.prototype.nextYear=function(){this.CurrentYear=this.CurrentYear+1,this.showCurrent()},Calendar.prototype.showCurrent=function(){this.Calendar(this.CurrentYear,this.CurrentMonth)},Calendar.prototype.checkActive=function(){1==document.querySelector(".months").getAttribute("class").includes("active")?document.querySelector(".months").setAttribute("class","months"):document.querySelector(".months").setAttribute("class","monthsactive"),"true"==document.querySelector(".month-a").getAttribute("data-active")?(document.querySelector(".month-a").setAttribute("data-active",!1),document.querySelector(".month-b").setAttribute("data-active",!0)):(document.querySelector(".month-a").setAttribute("data-active",!0),document.querySelector(".month-b").setAttribute("data-active",!1)),setTimeout(function(){document.querySelector(".calendar.header").setAttribute("class","headeractive")},200),document.querySelector("body").setAttribute("data-theme",this.Months[document.querySelector('[data-active="true"].render').getAttribute("data-month")].toLowerCase())},Calendar.prototype.Calendar=function(t,e){"number"==typeoft&&(this.CurrentYear=t),"number"==typeoft&&(this.CurrentMonth=e);varr=(newDate).getDay(),n=(newDate).getMonth(),a=(newDate).getFullYear(),o=newDate(t,e,1).getDay(),i=newDate(t,e+1,0).getDate(),u=0==e?newDate(t-1,11,0).getDate():newDate(t,e,0).getDate(),s="<span>"+this.Months[e]+" "+t+"</span>",d='<divclass="table">';d+='<divclass="rowhead">';for(varc=0;c<7;c++)d+='<divclass="cell">'+this.DaysOfWeek[c]+"</div>";d+="</div>";for(varh,l=dm="M"==this.f?1:0==o?-5:2,v=(c=0,0);v<6;v++){d+='<divclass="row">';for(varm=0;m<7;m++){if((h=c+dm-o)<1)d+='<divclass="celldisable">'+(u-o+l++)+"</div>";elseif(h>i)d+='<divclass="celldisable">'+l+++"</div>";else{d+='<divclass="cell'+(r==h&&this.CurrentMonth==n&&this.CurrentYear==a?"active":"")+'"><span>'+h+"</span></div>",l=1}c%7==6&&h>=i&&(v=10),c++}d+="</div>"}d+="</div>",document.querySelector('[data-render="month-year"]').innerHTML=s,document.querySelector(this.divId).innerHTML=d,document.querySelector(this.divId).setAttribute("data-date",this.Months[e]+"-"+t),document.querySelector(this.divId).setAttribute("data-month",e)},window.onload=function(){vart=newCalendar({RenderID:".render-a",Format:"M"});t.showCurrent(),t.checkActive();vare=document.querySelectorAll(".header[data-action]");for(i=0;i<e.length;i++)e[i].onclick=function(){if(document.querySelector(".calendar.header").setAttribute("class","header"),"true"==document.querySelector(".months").getAttribute("data-loading"))returndocument.querySelector(".calendar.header").setAttribute("class","headeractive"),!1;vare;document.querySelector(".months").setAttribute("data-loading","true"),this.getAttribute("data-action").includes("prev")?(t.prevMonth(),e="left"):(t.nextMonth(),e="right"),t.checkActive(),document.querySelector(".months").setAttribute("data-flow",e),document.querySelector('.month[data-active="true"]').addEventListener("webkitTransitionEnd",function(){document.querySelector(".months").removeAttribute("data-loading")}),document.querySelector('.month[data-active="true"]').addEventListener("transitionend",function(){document.querySelector(".months").removeAttribute("data-loading")})}};

    • JS代码
    • 170阅读
    • 2022-05-04

站三界导航
本站声明:本站严格遵守国家相关法律规定,非正规网站一概不予收录。本站所有资料取之于互联网,任何公司或个人参考使用本资料请自辨真伪、后果自负,站三界导航不承担任何责任。在此特别感谢您对站三界导航的支持与厚爱。