javascript常用函數(shù)(2)
文章主要內(nèi)容列表:
16、 除去數(shù)組重復(fù)項(xiàng)
17、 操作cookie
18、 判斷瀏覽器類型
19、 判斷是否開啟cookie
20、 斷是否開啟JavaScript
21、 JavaScript 打字機(jī)效果
22、 簡單打印
23、 禁止右鍵
24、 防止垃圾郵件
25、復(fù)制(javaeye flash版)
26、 阻止冒泡事件或阻止瀏覽器默認(rèn)行為
27、 關(guān)閉或跳轉(zhuǎn)窗口時(shí)提示
28、 用javascript獲取地 址欄參數(shù)
29、 計(jì)算停留的時(shí)間
30、 div為空,只有背景時(shí),背景自動(dòng)增高
主要內(nèi)容:
16、除去數(shù)組重復(fù)項(xiàng)
<script> Array.prototype.remove = function(){ var $ = this; var o1 = {}; var o2 = {}; var o3 = []; var o; for(var i=0;o = $[i];i++){ if(o in o1){ if(!(o in o2)) o2[o] = o; delete $[i]; }else{ o1[o] = o; } } $.length = 0; for(o in o1){ $.push(o); } for(o in o2){ o3.push(o); } return o3; } var a = [2,2,2,3,3,3,4,4,5,6,7,7]; a.remove (); document.write(a); </script>
17、 操作cookie
// 1. 設(shè)置COOKIE // 簡單型 function setCookie(c_name,value,expiredays) { var exdate=new Date() exdate.setDate(exdate.getDate()+expiredays) document.cookie=c_name+ "=" +escape(value)+ ((expiredays==null) ? "" : ";expires="+exdate.toGMTString()) } // 完整型 function SetCookie(name,value,expires,path,domain,secure) { var expDays = expires*24*60*60*1000; var expDate = new Date(); expDate.setTime(expDate.getTime()+expDays); var expString = ((expires==null) ? "" : (";expires=”+expDate.toGMTString())) var pathString = ((path==null) ? "" : (";path="+path)) var domainString = ((domain==null) ? "" : (";domain="+domain)) var secureString = ((secure==true) ? ";secure" : "" ) document.cookie = name + "=" + escape(value) + expString + pathString + domainString + secureString; } // 2.獲取指定名稱的cookie值: function getCookie(c_name) { if (document.cookie.length>0) { c_start=document.cookie.indexOf(c_name + "=") if (c_start!=-1) { c_start=c_start + c_name.length+1 c_end=document.cookie.indexOf(";",c_start) if (c_end==-1) c_end=document.cookie.length return unescape(document.cookie.substring(c_start,c_end)) } } return "" } // 3.刪除指定名稱的cookie: function ClearCookie(name) { var expDate = new Date(); expDate.setTime(expDate.getTime()-100); document.cookie=name+”=;expires=”+expDate.toGMTString(); } // 4. 檢測cookie: function checkCookie() { username=getCookie('username') if (username!=null && username!="") {alert('Welcome again '+username+'!')} else { username=prompt('Please enter your name:',"") if (username!=null && username!="") { setCookie('username',username,365) } } }
18、獲取坐標(biāo)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>payment</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> </head> <body style="font-size:12px;"> <script> var strInfo=""; strInfo += "網(wǎng)頁可見區(qū)域?qū)?" + document.body.clientWidth + "<br>"; strInfo += "網(wǎng)頁可見區(qū)域高:" + document.body.clientHeight + "<br>"; strInfo += "網(wǎng)頁可見區(qū)域?qū)?" + document.body.offsetWidth + "(包括邊線的寬)<br>"; strInfo += "網(wǎng)頁可見區(qū)域高:" + document.body.offsetHeight + "(包括邊線的寬)<br>"; strInfo += "網(wǎng)頁正文全文寬:" + document.body.scrollWidth + "<br>"; strInfo += "網(wǎng)頁正文全文高:" + document.body.scrollHeight + "<br>"; strInfo += "網(wǎng)頁被卷去的高:" + document.body.scrollTop + "<br>"; strInfo += "網(wǎng)頁被卷去的左:" + document.body.scrollLeft + "<br>"; strInfo += "網(wǎng)頁正文部分上:" + window.screenTop + "<br>"; strInfo += "網(wǎng)頁正文部分左:" + window.screenLeft + "<br>"; strInfo += "屏幕分辨率的高:" + window.screen.height + "<br>"; strInfo += "屏幕分辨率的寬:" + window.screen.width + "<br>"; strInfo += "屏幕可用工作區(qū)高度:" + window.screen.availHeight + "<br>"; strInfo += "屏幕可用工作區(qū)寬度:" + window.screen.availWidth + "<br>"; document.write(strInfo); </script> <br><br> <p> clientX 設(shè)置或獲取鼠標(biāo)指針位置相對于窗口客戶區(qū)域的 x 坐標(biāo),其中客戶區(qū)域不包括窗口自身的控件和滾動(dòng)條。 <br> clientY 設(shè)置或獲取鼠標(biāo)指針位置相對于窗口客戶區(qū)域的 y 坐標(biāo),其中客戶區(qū)域不包括窗口自身的控件和滾動(dòng)條。<br> offsetX 設(shè)置或獲取鼠標(biāo)指針位置相對于觸發(fā)事件的對象的 x 坐標(biāo)。<br> offsetY 設(shè)置或獲取鼠標(biāo)指針位置相對于觸發(fā)事件的對象的 y 坐標(biāo)。<br> screenX 設(shè)置或獲取獲取鼠標(biāo)指針位置相對于用戶屏幕的 x 坐標(biāo)。<br> screenY 設(shè)置或獲取鼠標(biāo)指針位置相對于用戶屏幕的 y 坐標(biāo)。<br> x 設(shè)置或獲取鼠標(biāo)指針位置相對于父文檔的 x 像素坐標(biāo)。<br> y 設(shè)置或獲取鼠標(biāo)指針位置相對于父文檔的 y 像素坐標(biāo)。<br> event.clientX返回事件發(fā)生時(shí),mouse相對于客戶窗口的X坐標(biāo),event.X也一樣。<br> 但是如果設(shè)置事件對象的定位屬性值為relative,event.clientX不變,而event.X返回事件對象的相對于本體的坐標(biāo)。<br> </p> </body> </html>
18、 判斷瀏覽器類型
Js代碼
<script type="text/javascript"> var Sys = {}; var ua = navigator.userAgent.toLowerCase(); var s; (s = ua.match(/msie ([\d.]+)/)) ? Sys.ie = s[1] : (s = ua.match(/firefox\/([\d.]+)/)) ? Sys.firefox = s[1] : (s = ua.match(/chrome\/([\d.]+)/)) ? Sys.chrome = s[1] : (s = ua.match(/opera.([\d.]+)/)) ? Sys.opera = s[1] : (s = ua.match(/version\/([\d.]+).*safari/)) ? Sys.safari = s[1] : 0; //以下進(jìn)行測試 if (Sys.ie) document.write('IE: ' + Sys.ie); if (Sys.firefox) document.write('Firefox: ' + Sys.firefox); if (Sys.chrome) document.write('Chrome: ' + Sys.chrome); if (Sys.opera) document.write('Opera: ' + Sys.opera); if (Sys.safari) document.write('Safari: ' + Sys.safari); </script>
jquery版
<script src="jquery-latest.js"></script> <script type="text/javascript"> $(document).ready(function(){ var bro=$.browser; var binfo=""; if(bro.msie) {binfo="Microsoft Internet Explorer "+bro.version;} if(bro.mozilla) {binfo="Mozilla Firefox "+bro.version;} if(bro.safari) {binfo="Apple Safari "+bro.version;} if(bro.opera) {binfo="Opera "+bro.version;} alert(binfo); }) </script>
19、判斷是否開啟cookie
<script> function checkCookie() { var result=false; if(navigator.cookiesEnabled){ return true; } document.cookie = "testcookie=yes;"; var setCookie = document.cookie; if (setCookie.indexOf("testcookie=yes") > -1){ result=true; }else{ document.cookie = ""; } return result; } if(!checkCookie()){ alert("對不起,您的瀏覽器的Cookie功能被禁用,請開啟"); }else{ alert("Cookie 成功開啟"); } </script>
20、 斷是否開啟JavaScript
// 方案 1 <span id="js_enable">您關(guān)閉了JavaScript</span> <script type="text/javascript"> <!-- document.getElementById("js_enable").innerHTML='您開啟了JavaScript'; --> </script> // 方案 2 <div id="NoJs" >您禁用了javascript。</div> <div id="YesJs" style="display:none;">您的Javascript是開啟的</div> <script> var NoJs= document.getElementById("NoJs"); var YesJs= document.getElementById("YesJs"); NoJs.style.display="none"; YesJs.style.display="block"; </script> // 方案 3 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>檢查瀏覽器是否開啟JavaScript</title> </head> <body> 如果您的瀏覽器支持的話,本頁面什么也不會(huì)顯示,如果不支持,則會(huì)出現(xiàn)提示! <noscript> <body scroll=no style="text-align: center"> <center> <table border="0" style="height: 100%; width: 100%; right: 1%; left: 1%; background: black; position: fixed"> <tr> <td align="center"> <div style="position: fixed; font-size: 18px; z-index: 2; cursor: help; background: #F8F8FF; width: 480px; color: black; padding: 5px 5px 5px 5px; border: 1px solid; border-color: maroon; height: auto; text-align: left; left: 20%"> <span style="font: bold 20px Arial; color:#F8F8FF; background: maroon; vertical-align: middle">對不起,你的瀏覽器沒有打開JavaScript腳本支持!</span></div> </td> </tr> </table> </center> </noscript> </body> </html>
HTML <noscript> 標(biāo)簽
定義和用法 noscript 元素用來定義在腳本未被執(zhí)行時(shí)的替代內(nèi)容(文本)。
此標(biāo)簽可被用于可識別 <script> 標(biāo)簽但無法支持其中的腳本的瀏覽器。
注釋:如果瀏覽器支持腳本,那么它不會(huì)顯示出 noscript 元素中的文本。
注釋:無法識別 <script> 標(biāo)簽的瀏覽器會(huì)把標(biāo)簽的內(nèi)容顯示到頁面上。為了避免瀏覽器這樣做,您應(yīng)當(dāng)在注釋標(biāo)簽中隱藏腳本。老式的(無法識別 <script> 標(biāo)簽的)瀏覽器會(huì)忽略注釋,這樣就不會(huì)把標(biāo)簽的內(nèi)容寫到頁面上,而新式的瀏覽器則懂得執(zhí)行這些腳本,即使它們被包圍在注釋標(biāo)簽中!
21、JavaScript 打字機(jī)效果
實(shí)例1
<html> <title>JavaScript 打字機(jī)</title> <head> <style type="text/css"> body{ font-family: Trebuchet MS, Lucida Sans Unicode, Arial, sans-serif; margin-top:0px; background-image:url('../../images/heading3.gif'); background-repeat:no-repeat; padding-top:100px; } #myContent, #myContent blink{ width:500px; height:200px; background:black; color: #00FF00; font-family:courier; } blink{ display:inline; } </style> <script type="text/javascript"> var charIndex = -1; var stringLength = 0; var inputText; function writeContent(init){ if(init){ inputText = document.getElementById('contentToWrite').innerHTML; } if(charIndex==-1){ charIndex = 0; stringLength = inputText.length; } var initString = document.getElementById('myContent').innerHTML; initStringinitString = initString.replace(/<SPAN.*$/gi,""); var theChar = inputText.charAt(charIndex); var nextFourChars = inputText.substr(charIndex,4); if(nextFourChars=='<BR>' || nextFourChars=='<br>'){ theChar = '<BR>'; charIndex+=3; } initStringinitString = initString + theChar + "<SPAN id='blink'>_</SPAN>"; document.getElementById('myContent').innerHTML = initString; charIndexcharIndex = charIndex/1 +1; if(charIndex%2==1){ document.getElementById('blink').style.display='none'; }else{ document.getElementById('blink').style.display='inline'; } if(charIndex<=stringLength){ setTimeout('writeContent(false)',150); }else{ blinkSpan(); } } var currentStyle = 'inline'; function blinkSpan(){ if(currentStyle=='inline'){ currentStyle='none'; }else{ currentStyle='inline'; } document.getElementById('blink').style.display = currentStyle; setTimeout('blinkSpan()',500); } </script> <body> <div id="myContent"> </div> <div id="contentToWrite" style="display:none"> <!-- Put the typewriter content here--> sharejs.com Login : username<br> password : ******<br> Access is granted<br> <!-- End typewriter content --> </div> <script type="text/javascript"> writeContent(true); </script> </body> </html>
實(shí)例2 (兼容IE,F(xiàn)X)
<html> <head> <title>打字效果的帶鏈接的新聞標(biāo)題</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <style type="text/css"> body{font-size:14px;font-weight:bold;} </style> </head> <body> 最新內(nèi)容:<a id="HotNews" href="" target="_blank"></a> <script language="JavaScript"> var NewsTime = 2000; //每條新聞的停留時(shí)間 var TextTime = 50; //新聞標(biāo)題文字出現(xiàn)等待時(shí)間,越小越快 var newsi = 0; var txti = 0; var txttimer; var newstimer; var newnewstitle = new Array(); //新聞標(biāo)題 var newnewshref = new Array(); //新聞鏈接 newstitle[0] = "javascript常用函數(shù)"; newshref[0] = "http://www.dbjr.com.cn/article/74365.htm"; newstitle[1] = "http://www.dbjr.com.cn/"; newshref[1] = "http://www.dbjr.com.cn/"; function shownew() { var endstr = "_"; hwnewstr = newstitle[newsi]; newslink = newshref[newsi]; if(txti==(hwnewstr.length-1)){endstr="";} if(txti>=hwnewstr.length){ clearInterval(txttimer); clearInterval(newstimer); newsi++; if(newsi>=newstitle.length){ newsi = 0 } newstimer = setInterval("shownew()",NewsTime); txti = 0; return; } clearInterval(txttimer); document.getElementById("HotNews").href=newslink; document.getElementById("HotNews").innerHTML = hwnewstr.substring(0,txti+1)+endstr; txti++; txttimer = setInterval("shownew()",TextTime); } shownew(); </script> </body> </html>
22、簡單打印
<style type="text/css" media=print> .noprint{display : none } </style> <input id="btnPrint" type="button" value="打印" onclick="javascript:window.print();" /><br> 這里是被打印的地方,這里是被打印的地方,這里是被打印的地方,這里是被打印的地方,這里是被打印的地方,<br> 這里是被打印的地方,這里是被打印的地方,這里是被打印的地方,這里是被打印的地方,這里是被打印的地方,<br> 這里是被打印的地方,這里是被打印的地方,這里是被打印的地方,這里是被打印的地方,這里是被打印的地方,<br> <p class="noprint">這里是不需要打印的地方</p>
23、禁止右鍵
<html> <title>jquery 禁止右鍵</title> <head> <script src="jquery.js"></script> <script type="text/javascript"> $(function(){ $(document).bind("contextmenu",function(e){ return false; }); }); </script> <body> Xinjiang to implement amended public security measures to safeguard social stability Xinjiang to implement amended public security measures to safeguard social stability Xinjiang to implement amended public security measures to safeguard social stability Xinjiang to implement amended public security measures to safeguard social stability Xinjiang to implement amended public security measures to safeguard social stability Xinjiang to implement amended public security measures to safeguard social stability </body> </html>
24、防止垃圾郵件
<script language="JavaScript"> var rJJdg="PYRUq"; var vjenFG="@cef.com"; var syniH="deo"; // 郵箱名字 var nQEEGoTp="@Deographics.com"; // 郵箱后綴 var KnJbiFO="imLCHy"; var JTCRe="@GZeejp.com"; var NersngGn=2014; // 郵箱地址loading時(shí)間 setTimeout("GRUBeoQUurKVgk()",NersngGn); function GRUBeoQUurKVgk(){ document.getElementById("TPNTZyRk").href= "mailto:"+syniH + nQEEGoTp; document.getElementById("gTslyYgEq").innerHTML = syniH + nQEEGoTp; } </script> <a id=TPNTZyRk><span id="gTslyYgEq">Email Loading...</span></a> <span style=display:none;>JwcFoxtWH@aPpeoOw.com RPibMejAUX@NQDg.com PWlVlgKG@QCpBcER.com SxOuqrHes@mszff.com taMmRPLu@EzcI.com NfXidnW@yympz.com quuMcbaKda@aUNdsyb.com DcnXCxaR@QcrN.com QeofXl@ibCh.com OxqzDkSH@hrScW.com</span>
25、復(fù)制(javaeye flash版)
<?php $clipboard = "This is a test !!"; ?> <div class="tools"> Javaeye <embed tplayername="SWF" splayername="SWF" id="Player1264100331386" type="application/x-shockwave-flash" src="clipboard.swf" mediawrapchecked="true" flashvars="clipboard=<?=$clipboard?>" quality="high" allowscriptaccess="always" pluginspage="http://www.macromedia.com/go/getflashplayer" height="15" width="14"> <div><textarea id="blog_content"><?=$clipboard?></textarea></div> </div>
26、阻止冒泡事件或阻止瀏覽器默認(rèn)行為
//阻止冒泡事件 function stopBubble(e) { if (e && e.stopPropagation) {//非IE e.stopPropagation(); } else {//IE window.event.cancelBubble = true; } } function stopDefault(e) { //阻止默認(rèn)瀏覽器動(dòng)作(W3C) if (e && e.preventDefault) e.preventDefault(); //IE中阻止函數(shù)器默認(rèn)動(dòng)作的方式 else window.event.returnValue = false; return false; }
27、關(guān)閉或跳轉(zhuǎn)窗口時(shí)提示
<script language="javascript"> function IsClose() { if(confirm("是否退出系統(tǒng)?")) { return true; } return false; } </script> <body onbeforeunload="javascript:if(IsClose()){return false;}else{return true}"> -------------------------------------------------------- </body> 或者 <script> function winclose(){ return '是否退出系統(tǒng)?'; } </script> <body onbeforeunload="return winclose()" > </body>
28、用javascript獲取地 址欄參數(shù)
//本頁地址為: alert(document.location);
方法一:
<script type="text/javascript"> <!-- String.prototype.getQuery = function(name) { var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)"); var r = this.substr(this.indexOf("\?")+1).match(reg); if (r!=null) return unescape(r[2]); return null; } var strHref = "www.cnlei.org/index.htm?a=aaa&b=bbb&c=ccc"; alert(strHref.getQuery("a")); alert(strHref.getQuery("b")); alert(strHref.getQuery("c")); //--> </script>
方法二:
<script type="text/javascript"> function getUrlPara(paraName){ var sUrl = location.href; var sReg = "(?:\\?|&){1}"+paraName+"=([^&]*)" var re=new RegExp(sReg,"gi"); re.exec(sUrl); return RegExp.$1; } //應(yīng)用實(shí)例:test_para.html?a=11&b=22&c=33 alert(getUrlPara("a")); alert(getUrlPara("b")); </script>
方法三:
<script type="text/javascript"> <!-- function Request(strName){ var strHref = "www.cnlei.org/index.htm?a=aaa&b=bbb&c=ccc"; var intPos = strHref.indexOf("?"); var strRight = strHref.substr(intPos + 1); var arrTmp = strRight.split("&"); for(var i = 0; i < arrTmp.length; i++) { var arrTemp = arrTmp[i].split("="); if(arrTemp[0].toUpperCase() == strName.toUpperCase()) return arrTemp[1]; } return ""; } alert(Request("a")); alert(Request("b")); alert(Request("c")); //--> </script>
29、計(jì)算停留的時(shí)間
<html> <form name="myform"> <td vAlign="top" width="135">您在此停留了: <input name="clock" size="8" value="在線時(shí)間"></td> </form> <script language="JavaScript"> var id, iM = 0, iS = 1; start = new Date(); function go(){ now = new Date(); time = (now.getTime() - start.getTime()) / 1000; time = Math.floor( time); iS = time % 60; iM = Math.floor( time / 60); if ( iS < 10) document.myform.clock.value = " " + iM + " 分 0" + iS + " 秒"; else document.myform.clock.value = " " + iM + " 分 " + iS + " 秒"; id = setTimeout( "go()", 1000); } go(); </script> </body> </html>
30、div為空,只有背景時(shí),背景自動(dòng)增高
<script src="jquery-latest.js"></script> <script> $(function(){ var $height = $('#main').height(); // main 是主體自動(dòng)增高的 id $('#bg').css('height',$height); // bg 是隨主體自動(dòng)增高的無內(nèi)容背景div的id,一般是陰影之類的 }) </script>
iframe 版
<iframe src="iframe_b.html" scrolling="no" frameborder="0" width="100%" onload="this.height=this.contentWindow.document.documentElement.scrollHeight"></iframe>
以上就是小編為大家整理的常用的javascript函數(shù),希望對大家的學(xué)習(xí)有所幫助,還有最后一篇關(guān)于常用的javascript函數(shù)的文章即將推出,繼續(xù)關(guān)注。
- javascript 終止函數(shù)執(zhí)行操作
- JavaScript截取字符串的Slice、Substring、Substr函數(shù)詳解和比較
- javascript字母大小寫轉(zhuǎn)換的4個(gè)函數(shù)詳解
- JavaScript中的函數(shù)的兩種定義方式和函數(shù)變量賦值
- JavaScript中的apply和call函數(shù)詳解
- javascript中聲明函數(shù)的方法及調(diào)用函數(shù)的返回值
- JavaScript實(shí)現(xiàn)的in_array函數(shù)
- JavaScript數(shù)組函數(shù)unshift、shift、pop、push使用實(shí)例
- 理解javascript中的回調(diào)函數(shù)(callback)
- javascript 自定義回調(diào)函數(shù)示例代碼
- Javascript獲取當(dāng)前時(shí)間函數(shù)和時(shí)間操作小結(jié)
- 原生Javascript封裝的一個(gè)AJAX函數(shù)分享
- 詳談JavaScript 匿名函數(shù)及閉包
- JavaScript中的alert()函數(shù)使用技巧詳解
- JavaScript中的console.dir()函數(shù)介紹
- javascript常用函數(shù)(1)
相關(guān)文章

javascript中clipboardData對象用法詳解

dedecms頁面如何獲取會(huì)員狀態(tài)的實(shí)例代碼

javascript時(shí)間與時(shí)間戳互轉(zhuǎn)多種方式

微信小程序?qū)崿F(xiàn)的canvas合成圖片功能示例