分享javascript、jquery实用代码段

javascript判断H5页面离开

function onbeforeunloadFn(){ console.log('离开页面'); //...code } function showOnbeforeunload(flags){ if(flags){ document.body.onbeforeunload = onbeforeunloadFn; }else{ document.body.onbeforeunload = null; } } $(function(){ showOnbeforeunload(true); })

jq判断img标签图片地址是否已经加载完毕

imgStatus = 0; $("img").each(function(){ if(this.complete){/*this.complete代表图片加载完成*/ imgStatus++; } });

iframe获取内容-和设置

if($(".ad_show iframe").size() > 0 ){ $(".ad_show iframe").attr("id","iframead");/*设置iframe的id*/ /*获取id为iframead的iframe的dom对象*/ var iframebox = document.getElementById("iframead").contentWindow; /*设置兜底内容*/ iframebox.document.body.innerText = "1234"; }

javascript获取浏览器上一页的url

/*返回上一次url,如果是新窗口则不能获取到*/ var beforeUrl = document.referrer;

关于头疼的移动端点击冒泡事件

<script> $(".class").live('tap',function(oEvent){ e = window.event || oEvent; if(e.stopPropagation){ e.stopPropagation(); }else{ e.cancelBubble = true; } e.preventDefault(); }); </script> /*虽说tap事件可以阻止大部分冒泡事件,但是还是有一小部分移动端不吃你这套,那么有另外一个解决办法*/ /*将层级间的事件通过H5属性data-flag="true"来控制*/ <!--html--> <div data-flag="true"> <div data-flag="false"> <div data-flag="false"> .... </div> </div> </div> <!--给父级parentTap绑定一个点击事件--> <!--给子级childTap绑定一个点击事件--> <!--给子孙级childsTap绑定一个点击事件--> <script type="text/javascript"> var bindInit = function(className){ if($(className).size() > 0){ $(className).on('tap',function(oEvent){ e = window.event || oEvent;if(e.stopPropagation){e.stopPropagation();}else{e.cancelBubble = true;}e.preventDefault(); var flag = $(this).data('flag'); if(flag){/*为true时允许点击进入事件*/ /* code... */ } }); } } $(function(){ bindInit('.parentTap'); bindInit('.childTap'); bindInit('.childsTap'); }); </script>

简单倒计时功能

<div data-end="2016-10-13 23:59:59" data-now="2016-10-13 03:59:59"> <div></div> <div></div> <div></div> <div></div> </div> <script type="text/javascript"> /*倒计时*/ var timeDown = { GetRTime: function (timeId,oldNowTime) { var tempTime;/*保存上一次时间*/ if(oldNowTime){ tempTime = new Date(oldNowTime.getTime() + 1000);/*如果有上一次时间则赋值*/ /*console.log(tempTime);*/ } var EndTime = new Date($("#" + timeId).data("end"));/*获取结束时间*/ if (!tempTime) { if ($("#" + timeId).data("now") == "" || $("#" + timeId).data("now") == "null") { var NowTime = new Date(); } else { var NowTime = new Date($("#" + timeId).data("now"));/*取开始时间*/ } } else { var NowTime = tempTime; } if (EndTime.getTime() >= NowTime.getTime()) {/*判断时间*/ var t = EndTime.getTime() - NowTime.getTime();/*得到结束时间减去开始时间的时间戳*/ var d = Math.floor(t / 1000 / 60 / 60 / 24);/*日*/ var h = Math.floor(t / 1000 / 60 / 60 % 24);/*时*/ var m = Math.floor(t / 1000 / 60 % 60);/*分*/ var s = Math.floor(t / 1000 % 60);/*秒*/ /*将时间填入对应的html中*/ $(".t_d", "#" + timeId).html((d > 9 ? '' : '0') + d); $(".t_h", "#" + timeId).html((h > 9 ? '' : '0') + h); $(".t_m", "#" + timeId).html((m > 9 ? '' : '0') + m); $(".t_s", "#" + timeId).html((s > 9 ? '' : '0') + s); tempTime = new Date(NowTime.getTime() + 1000);/*将开始时间+1秒*/ setTimeout(function () { timeDown.GetRTime(timeId,NowTime);/*等待一秒后继续执行*/ }, 1000); } else if (EndTime.getTime() == NowTime.getTime()) {/*当时间相等时要做处理的code*/ $("#"+timeId).hide(); } } } var t=0; if ($(".newTime").size() > 0) { $(".newTime").each(function(){ var timeId="timeOut"+t; $(this).attr("id",timeId);/*设置多个倒计时时指定唯一id*/ t++; timeDown.GetRTime(timeId,null);/*开始调用*/ }); } </script>

jQuery的节点操作

jQuery.parent(expr) /*找父亲节点,可以传入expr进行过滤,比如$("span").parent()或者$("span").parent(".class")*/ jQuery.parents(expr) /*类似于jQuery.parents(expr),但是是查找所有祖先元素,不限于父元素*/ jQuery.children(expr) /*返回所有子节点,这个方法只会返回直接的孩子节点,不会返回所有的子孙节点*/ jQuery.contents() /*返回下面的所有内容,包括节点和文本。这个方法和children()的区别就在于,包括空白文本,也会被作为一个*/ /* jQuery对象返回,children()则只会返回节点 jQuery.prev(),返回上一个兄弟节点,不是所有的兄弟节点 jQuery.prevAll(),返回所有之前的兄弟节点 jQuery.next(),返回下一个兄弟节点,不是所有的兄弟节点 jQuery.nextAll(),返回所有之后的兄弟节点 jQuery.siblings(),返回兄弟姐妹节点,不分前后 jQuery.find(expr),跟jQuery.filter(expr)完全不一样。 jQuery.filter()是从初始的jQuery对象集合中筛选出一部分, 而jQuery.find()的返回结果,不会有初始集合中的内容, 比如$("p"),find("span"),是从<p>元素开始找<span>,等同于$("p span") */

js中if判断语句中的in语法

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wjxyxj.html