この記事では、JSがメッセージが来るときにWebページのタイトルをフラッシュする効果をどのように実装するかについて説明します。次のように、参照のために共有してください。
<html xmlns = "http://www.w3.org/1999/xhtml"> <head runat = "server"> <title> unt title page </title> <script> var g_blinkid = 0; null; var g_newmsg_sound = null; var g_app_num = 0; var g_appnum = 0; var g_bappmore = false; var g_inputtime = 0; function blinknewmsg（）{document.title = g_blinkswitch％2 == 0？ "【】 - " + g_blinktitle： "【新しいニュース - " + g_blinktitle; g_blinkswitch ++;} g_blinkid = setInterval（blinkNewmsg、1000）; function stopblinknewmsg（）{if（g_blinkid）{clearinterval（g_blinkid）; g_blinkid = 0; document.title = g_blinktitle; }} </script> </head> <body> <form id = "form1" runat = "server"> <div> <input id1 "button1" button "value =" button "onclick =" stopblinknewmsg（）; " /> </div> </form> </body> </html>Kaixin.comのhead-26.jsを参照してください
var g_blinkid = 0; var g_blinkswitch = 0; var g_blinktitle = document.title; var g_onlineuser = ""; var g_sysmsg_sound = null; var g_newmsg_sound = null; var g_app_num = 0; var g_appnum = 0; var g_bappmore = var g_input; blinkNewmsg（）{var now = new date（）; var now = now.getTime（）; if（nowtime -g_inputtime> 5000）{document.title = g_blinkswitch％2？ "【】 - " + g_blinktitle： "【新しいニュース - " + g_blinktitle; } g_blinkswitch ++;} function blinkonline（）{document.title = g_blinkswitch％2？ "○" + g_onlineuser + "is online-" + g_blinktitle： "●" + g_onlineuser + "is online-" + g_blinktitle; g_blinkswitch ++; if（g_blinkswitch> 10）{stopblinknewmsg（）; }} function checknewmsg（）{var url = "/home/newmsg.php"; var pars = ""; var myajax = new ajax.request（url、{method： "post"、parameters：pars、oncomplete：function（req）{checknewmsgshow（req）;}}）;} function stopblinknewmsg（）{if（g_blinkid）{clearinterval（g_blinkid）; g_blinkid = 0; $（ "head_msgdiv"）。style.display = "none"; document.title = g_blinktitle; }} var g_oldmsg = g_oldsysmsg = g_oldbbs = g_oldbbsreply = g_oldcomment = g_oldreply = 0; function checknewmsgshow（req）{var r = req.responsetext; stopblinknewmsg（）; Settimeout（CheckNewMSG、60000）; eval（ "r ="+r）; var a_msglist = new Array（ "msg"、 "sysmsg"、 "bbsreply"、 "comment"、 "Reply"）; if（r.notice == "1"）{var forbidsound = parseint（r.forbidsound）; if（！forbidsound）{for（i = 0; i <a_msglist.length; i ++）{if（$（ "body_" + a_msglist [i] + "_num"））{var c = parseint（$（ "body_" + a_msglist [i] + "_num"）。 eval（ "g_old" + a_msglist [i] + "= c;"）; }} var newmsg = parseint（r.msg） + parseint（r.bbs） + parseint（r.bbsreply） + parseint（r.comment） + parseint（r.reply）; var sysmsg = parseint（r.sysmsg）; var newChange =（parseint（r.msg）-g_oldmsg）|| （parseint（r.bbs）-g_oldbbs）|| （parseint（r.bbsreply）-g_oldbbsreply）|| （parseint（r.comment） - g_oldcomment）|| （parseint（R.Reply）-G_OldReply）; var syschange =（parseint（r.sysmsg）-g_oldsysmsg）; for（i = 0; i <a_msglist.length; i ++）{eval（ "g_old" + a_msglist [i] + "= parseint（r。" + a_msglist [i] + "）;"）; } if（newmsg && newChange）{if（g_newmsg_sound == null）{g_newmsg_sound = new swfobject（ "http://img.kaixin001.com.cn/i2/newmsg_sound.1.0.swf" 「#ffffff」、true）; g_newmsg_sound.addparam（ "aslowscriptaccess"、 "Always"）; g_newmsg_sound.addparam（ "wmode"、 "opaque"）; g_newmsg_sound.addparam（ "menu"、 "false"）; g_newmsg_sound.addvariable（ "autoplay"、 "0"）; } g_newmsg_sound.write（ "head_msgsound_div"）; } else if（sysmsg && syschange）{if（g_sysmsg_sound == null）{g_sysmsg_sound = new swfobject（ "http://img.kaixin001.com.cn/i2/i2/sysmsg_sound.1.0. 「#ffffff」、true）; g_sysmsg_sound.addparam（ "aslowscriptaccess"、 "Always"）; g_sysmsg_sound.addparam（ "wmode"、 "opaque"）; g_sysmsg_sound.addparam（ "menu"、 "false"）; g_sysmsg_sound.addvariable（ "autoplay"、 "0"）; } g_sysmsg_sound.write（ "head_msgsound_div"）; }} $（ "head_msgdiv"）。style.display = "block"; g_blinkid = setInterval（blinkNewmsg、1000）; } else if（0 && r.online.length）{g_blinkswitch = 0; g_onlineuser = r.online; g_blinkid = setInterval（Blinkonline、500）; } for（i = 0; i <a_msglist.length; i ++）{if（！parseint（r [a_msglist [i]]））{$（ "head_" + a_msglist [i] + "_num"）。innerhtml = ""; if（$（ "body_" + a_msglist [i] + "_num"））{$（ "body_" + a_msglist [i] + "_num"）。classname = "ql2"; $（ "body_" + a_msglist [i] + "_num"）。innerhtml = "0 new items"; }} else {$（ "head_" + a_msglist [i] + "_num"）。innerhtml = "（" + r [a_msglist [i]] + "）"; if（$（ "body_" + a_msglist [i] + "_num"））{$（ "body_" + a_msglist [i] + "_num"）。classname = "cr"; $（ "body_" + a_msglist [i] + "_num"）。innerhtml = r [a_msglist [i]] + "new"; } if（a_msglist [i] == "msg"）{if（ 'function' == typeof（msg_view_checknewmsg））{msg_view_checknewmsg（）; }; }}}} function outputhead（）{var v_html = '<div id = "head">'+'<div>'+'<div style = "mign-top：3px;">'+'<div style = "padding-left：18px;"> <a href = "/"> <imgg src = "http://img.kaixin001.com.cn/i2/kaixinlogo.gif"/> </a> </div> '+' <div> '+'+'<div = "hn1">'+'<div> <a href = "/home/？t ='+Math.ceil（Math（）100）+ '"> home </a> </div>'+'<div> <a href =" javascript：xs（1）; "> <img src =" http://img.kaixin001.com.cn/i/r_sj.gif "/>> </a> </</div> <div> <a href = "/home/">私のホームページ</a> </div> '+' <div> <a href = "/home/">私のホームページ</a> </div> '+' <div>私のホームページプレビュー：</div> '+' <div> '+' <a href = "/？ onclick = "javascript：hy（）;"> '+' <div> style = "マージン：5px 3px;"> <img src = "http://img.kaixin001.com.cn/ii/small-tri.gif"/>> </div> '+' <div> "cursor </div '+ <div> </div> '+' </a> '+' </div> '+' <div> '+' <a href = "/home/？_ preview = other"ターゲット= _blank onclick = "javascript：hy（）;" > '+' <div style = "マージン：5px 3px;"> <img src = "http://img.kaixin001.com.cn/ii/small-tri.gif"/> </div> '+' <div style = "cursor：pointer;"> </div> '+' </div> '+' </div> '+' <div id = "hn_xx1"> <img src = "http://img.kaixin001.com.cn/i/r_xx13.gif"/> </div> '+' '+'+ Math.ceil（Math.random（） * 100）+'"> friends </a> </div>'+'<div> <a href =" javascript：xs（2）; "> <img src =" http://img.kaixin001.com.cn/i/r_sj.gif <！ - '+' <iframe style = "position：absolute; z-index：1; width：expression（this.nextsibling.offsetwidth）; height：expression（this.nextsibling.offseetheight）; top：expression（this.nextsibling.offsettop）; left：expression（this.nextsiblingblingbling.offteleft）; frameborder = "0">/iframe> '+' - > '+' <div id = "hn2_l" style = "z-index：2"> '+' <div> <a href = "/friend/"> </div> '+' <div> <a href = "/friend/？ href = "/friend/group.php">友人管理</a> </div> '+' <div> <a href = "/home/fstatus.php"> friend status update </a> </div> '+' <div> href = "/friend/search.php"> fiend friends </a> </div> '+' </div> '+' <div> <a href = "/friend/search.php"> find friends </a> </div> '+' </div> '+' <div id = "hn_xx2"> <img src = "http://img.kaixin001.com.cn/i/r_xx13.gif"/> </div> '+' '+' <div id = "hn3"> '+' <div> <a href = "/group/？t = '+math.ceil（math.random（） * 100）'> '+'+'+'+ href = "javascript：xs（3）;"> <img src = "http://img.kaixin001.com.cn/ii/r_sj.gif"/> </a> </div> '+' <div> </div> '+' <div = "hn3_l"> '<a href = ">グループ</a> </div> '+' <div> <a href = "/group/flist.php"> friends </a> </div> '+' <div> <a href = "/group/new.php">新しいグループの作成</a> </div> '+' <div> <a href = " <div id = "hn_xx3"> <img src = "http://img.kaixin001.com.cn/i/r_xx13.gif"/> </div> '+' '+' <div div = "hn_xx3"> <img src = "http://img.kaixin001.ch.cn/ /> </div> '+' '+' <div id = "hn4" style = "padding-right：28px;"> '+' <div> <a href = "/msg/？t = '+math.ceil（） * 100）+'">メッセージ</a> </div> '+ src = "http://img.kaixin001.com.cn/i/r_sj.gif"/> </a> <span style = "position：absolute; top：5px; left：65px; display：none;" id = head_msgdiv> <a href = "/msg/" style = "mign-top：-5px;"> <img src = "http://img.kaixin001.com.cn/i/ddtx.gif" onmouseover = "javascript：xs（4）;" border = 0> </a> </span> </div> '+' <div> </div> '+' <div id = "hn4_l"> '+' <div> <a href = "/msg/inbox.php？t = '+math.ceil（math.random（） * 100）+'" id = head_msg_num> </span> </a> </div> ' +' <div> <a href = "/msg/sys.php？t = ' + math.ceil（math.random（） * 100） +'" ">システムメッセージ<スパンスタイル="パディング左：2px; coler：red; <div> <a href = "/comment/？t = ' + math.ceil（Math.random（） +'"> comment <span style = "padding-left：2px; color：red;" 100） + '">コメントReply <SPAN STYLE =" PADDING-LEFT：2PX; COLOR：RED; "ID = HEAD_REPLY_NUM> </SPAN> </a> </div>' + '<div> <a href ="/comment/uindex.php？t =' + Math.random（） * 100） + '>'>メッセージボードボードstyle = "padding-left：2px; color：red;" id = head_bbs_num> </span> </a> </div> ' +' <div> < id = head_bbsreply_num> </span> </a> </div> '+' </div> '+' <div> <a href = "/friend/invite.php"> invite </a> href = "/set/privacy.php"> privacy </a> <div> </div> '+' <div> </div> '+' <div> </div> '+' <div> '+' <div> </div> '+'+'+' <div> </div> '+' <div> '+' <div> </div> '+' <div> '+' id = "App__tip" " style = "z-index：20000; position：absolute：＃ffff; border：2px solid＃f7f7f7; width：160px; height：250px; display：none;"> '+' </div> '; v_index_num）{if（-1 == v_link.indexof（ "？"））{v_link + = " + math.ceil（math.random（） * 100）} 12px 15px; "onmouseover =" javascript：if（/'' + v_index_num + '/' ==/'1/'）{$（/'app_friend_' + v_aid + '/').style.display=/'block/';} '/').style.display =/'none/';"+' <div> <img src = "' + v_icon +'" align = "absmiddle"/> <a href = "' + v_link +'"> <b> ' + v_title +' </b style = "display：none; padding：8px 3px; cursor：pointer;" onclick = "javascript：a_appfriend_show（ ' + v_aid +'、 /'' + v_link + ' /'、 /'' + v_title + ' /'）;"> <img src = "http://img.kaixin001.com.cn/i2/xiasanjiao.gif" align = "absmiddle"/> </div> '+' <div> </div> '+' </div> '; v_index_num）{document.writeln（_outputapp（v_icon、v_title、v_index_num）;} function _setapplisthidded（）{if（g_app_num == -1）return '' {g_bappmore = true; '</span> <div id = applistscroll style = "margin-top：-10px;"> <img src = "http://img.kaixin001.com.cn/i2/xiala.gif" align = "absmiddle"> <a href = a href = "javascript：showapmmore（ } return '';} function setapplisthiddentail（）{document.writeln（_setapplisthiddentail（））;} function outputhead2（）{document.write（ '<div> <img src = "http://img.kaixin001.com.cn/idex_pisp.gif"/</</</</< style = "position：relative;"> <div id = "install_tips" style = "position：aspolute; left：110px; top：-7px; z-index：99; display：none;"> <div style = "padding：7px 0;"> <img src = "http://img.kaixin001.com.cn/ style = "cursor：pointer;" onclick = "h（/'install_tips/'）"/> </div> <p style = "padding：0px 20x;" <a href = "/app/list.php">コンポーネントの追加</a> </div> </div> <div style = "margin-top：-8px;"> <img src = "http://img.kaixin001.com.cn/ii/index_app_set1.gif"設定</a> </div> </div> '）;} function showappmore（）{if（$（ "Applistmore"）。display == "none"）{$（ "Applistmore"） src = "http://img.kaixin001.com.cn/i2/shouqi.gif" absmiddle "> <" javascript：showappmore = "text-decoration：none;"> close </a>} $（ "Applistscroll"）。innerhtml = '<img src = "http://img.kaixin001.com.cn/i2/xiala.gif outputappinfo（）{if（g_allapp_num> g_prevapp_num）{var url = "/app/left.php"; }） _OutputApp（data [i] [icon "]、data [i] [" title "]、data [i] [" index_num "]}} outputtail（）{document.writeln（ '<div> </div>'+'</div>'+'<div id = "b">'+'<div> <a href = "/s/s/s/about.html" = "_ blank">私たちについて</a> <span> </span </span <a href = "/s/contact.html"情報</a> <span>┊</span> <a href = "/t/feedback.html"ターゲット= "_ blank">フィードバック</a> <span> </span> <a href = "/s/helt.html"ターゲット= "_ blank"> help center </a>©2009 Kaixin001.com < href = http：//www.miibeian.gov.cnターゲット= _blank>北京ICP証明書番号080482 </a> </div> '+' </div> '）;}For more information about JavaScript related content, please check out the topics of this site: "Summary of ajax operation skills in JavaScript", "Summary of JavaScript switching effects and techniques", "Summary of JavaScript search algorithm skills", "Summary of JavaScript animation special effects and techniques", "Summary of JavaScript errors and debugging skills", "Summary of JavaScript data structures andアルゴリズムスキル」、「JavaScriptトラバーサルアルゴリズムとテクニックの要約」および「JavaScriptの数学操作の使用法の要約」
この記事がみんなのJavaScriptプログラミングに役立つことを願っています。