首页 > 网站 > WEB开发 > 正文

2015.03.19 笔记

2024-04-27 14:11:50
字体:
来源:转载
供稿:网友

2015.03.19 笔记

1.js配置不同屏幕的样式

1<scripttype="text/javascript">2gaibian();3window.onresize=gaibian;4functiongaibian(){5varkuangdu=document.documentElement.clientWidth;6if(kuangdu>1024){7document.getElementById("links").href="CSS/big_screen.css";8}elseif(kuangdu>600&&kuangdu<=1024){9document.getElementById("links").href="css/mi_screen.css";10}else{11document.getElementById("links").href="css/min_screen.css";12}13}14</script>View Code

2.阻止默认行为和冒泡时间

1function(e){2e.PReventDefault();3e.stopPropagation();}

function(e){//内容returnfalse;//作用同上}e.isDefaultPrevent();//判断是否用了阻止默认事件e.isPropagationStop();//判断是否用了阻止冒泡事件e.stopImmediatePropagation()//取消事件冒泡,并取消该事件的后续事件处理函数isImmediatePropagationStopped()//判断是否调用了stopImmediatePropagation()方法

3.Js获取当前日期时间及其它操作

varmyDate=newDate();myDate.getYear();//获取当前年份(2位)myDate.getFullYear();//获取完整的年份(4位,1970-????)myDate.getMonth();//获取当前月份(0-11,0代表1月)myDate.getDate();//获取当前日(1-31)myDate.getDay();//获取当前星期X(0-6,0代表星期天)myDate.getTime();//获取当前时间(从1970.1.1开始的毫秒数)myDate.getHours();//获取当前小时数(0-23)myDate.getMinutes();//获取当前分钟数(0-59)myDate.getSeconds();//获取当前秒数(0-59)myDate.getMilliseconds();//获取当前毫秒数(0-999)myDate.toLocaleDateString();//获取当前日期varmytime=myDate.toLocaleTimeString();//获取当前时间myDate.toLocaleString();//获取日期与时间

3.js 中的索引值

window.onload=function(){varoUl1=document.getElementById('ul1');varaLi=oUl1.getElementsByTagName('li');varoMeng=document.getElementById('meng');varoImg=document.getElementById('img1');//vartimer=null;varindex=0;for(vari=0;i<aLi.length;i++){aLi[i].index=i;aLi[i].onclick=function(){setTimeout(function(){oMeng.style.display="block";//第一步的动画开始出来});setTimeout(function(){location.href="index05.html";//动画过后执行的动作},2000);index=this.index;oImg.src="img/tu"+index+".jpg";//改变图片的路径}}}View Code

4.js在链接里面实现前进后退

history.back(0);刷新history.back(1);前进history.back(-1);后退Javascript:history.back(-1);

5.预加载

1<scripttype="text/javascript">2$(function(){3setTimeout(function(){4$(".loading_1").hide();5},8000)//加载动画6})7</script>8<divstyle="display:none;">9<scripttype="text/javascript">varcnzz_protocol=(("https:"==document.location.protocol)?"https://":"http://");document.write(unescape("%3Cspanid='cnzz_stat_icon_1254406391'%3E%3C/span%3E%3Cscriptsrc='"+cnzz_protocol+"s95.cnzz.com/z_stat.php%3Fid%3D1254406391'type='text/javascript'%3E%3C/script%3E"));</script>10</div>11</body>12<?php13//分享内容14$url='http://'.$_SERVER['HTTP_HOST'].$_SERVER['PHP_SELF'];15require_once'js/share.php';16?>17<scripttype="text/javascript">18functionpreload(arr){19vari=arr.length,20o,21d=document,22b=document.body,23isIE=/*@cc_on!@*/0;24while(i--){25if(isIE){26newImage().src=arr[i];27continue;28}29o=d.createElement('object');30o.data=arr[i];31o.width=o.height=0;32b.appendChild(o);33}34}3536window.onload=function(){37preload([38'http://new.yangyue.com.cn/wechat/dibiao/activity/tebo/img/shengzhi.png',39'http://new.yangyue.com.cn/wechat/dibiao/activity/tebo/img/shengzhi02.png',40'http://new.yangyue.com.cn/wechat/dibiao/activity/tebo/img/video_pic.png',41'http://new.yangyue.com.cn/wechat/dibiao/activity/tebo/img/p01_ti.png',42'http://new.yangyue.com.cn/wechat/dibiao/activity/tebo/img/p7_txt.png',43'http://new.yangyue.com.cn/wechat/dibiao/activity/tebo/img/p2_bg.jpg',44'http://new.yangyue.com.cn/wechat/dibiao/activity/tebo/img/p1_bg.jpg',45'http://new.yangyue.com.cn/wechat/dibiao/activity/tebo/img/p3_bg.jpg',46'http://new.yangyue.com.cn/wechat/dibiao/activity/tebo/img/p4_bg.jpg',47'http://new.yangyue.com.cn/wechat/dibiao/activity/tebo/img/p05_bg.jpg',48'http://new.yangyue.com.cn/wechat/dibiao/activity/tebo/img/kk.jpg',49]);//预加载图片路径50}51</script>View Code

6.定时执行动作

1<scripttype="text/javascript">2functions(){3$(".phone").addClass("shake");4}5functionss(){6$(".phone").removeClass("shake");7}8setInterval(s,2000)//要晃的湾湾9setTimeout(function(){10setInterval(ss,2000)11},1000)12</script>View Code

7.随机数

1<scripttype="text/javascript">2functionstar(){3varn=Math.ceil(Math.random()*10),4m=n%5;5$(".star").eq(m).show().siblings().hide();67}8setInterval(star,500)9</script>

8.监测宽高

window.onload=function(){

//alert(document.documentElement.clientWidth);//文档可视区域宽度

}

1$(document).ready(function()

2{3alert($(window).height());//浏览器时下窗口可视区域高度4alert($(document).height());//浏览器时下窗口文档的高度5alert($(document.body).height());//浏览器时下窗口文档body的高度6alert($(document.body).outerHeight(true));//浏览器时下窗口文档body的总高度包括borderpaddingmargin7alert($(window).width());//浏览器时下窗口可视区域宽度8alert($(document).width());//浏览器时下窗口文档对于象宽度9alert($(document.body).width());//浏览器时下窗口文档body的高度10alert($(document.body).outerWidth(true));//浏览器时下窗口文档body的总宽度包括borderpaddingmargin11}12)

9.js 添加类class

functionaddClass(id,className){varelement=document.getElementById(id);if(element.className==""){element.className=className;}else{element.className+=""+className;}}addClass(id,classname);

10.不同准备条件执行的js 函数

只要加载到所要执行部分的结构就会执行

$(document).ready(function(){})

-------------------------------------其中window可以使任何对象

window.onload=function(){//界面加载完了执行的内容}

--------------------------------------------------Javascript刷新页面的几种方法:

history.go(0)location.reload()location=locationlocation.assign(location)document.execCommand('Refresh')window.navigate(location)location.replace(location)document.URL=location.href

说明一下,jQuery没有发现刷新页面的方法。

window.resize(function(){上面选一个放到这里。});

11.返回顶部&锚点链接

QQt17.gif" class="code_img_closed" id="code_img_closed_14f99592-a5f8-4db9-a3b0-433eb03
发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表