1、列表的滑鼠移入和移出事件
<ul id="ulLIST"><li>1</li><li>2</li><li>3</li><li>4</li><li>5</li></ul><script> var lis = document.getElementById('ulLIST').getElementsByTagName('li'); for (var i = 0, j = lis.length; i < j; i++) { lis[i].onmouseover = function () { this.style.backgroundColor = 'blue'; } lis[i].onmouseout = function () { this.style.backgroundColor = 'transparent'; } }</script>
2、在面板外點擊滑鼠,關閉面板方法
<script> //jquery實現 $(window).click(function(e){ e = window.event || e; var tag = e.srcElement || e.target; if(tag.id != 'testdiv'){ $("#testdiv").hide(); } }) //js實現 function handle(e){ e=window.event||e; var tag=e.srcElement||e.target; if(tag.id!='testdiv'){ document.getElementById("testdiv").style.display='none'; } } window.onload=function(){ window.onclick=handle; }</script>
3、jQuery的mouseenter和mouseover事件的區別
(1)mouseenter事件將只在進入的第一次生效;
(2)mouseover事件將觸發滑鼠所在的地區移動的事件即每移動一次就觸發一次事件。
4、在文檔的指定位置輸出內容
function writeAt(str,x,y)//str:要顯示的內容;x:x座標;y:y座標 { var adiv=document.createElement("div"); adiv.style.position = "absolute"; //要加px,否則達不到效果 adiv.style.left = x + "px"; adiv.style.top = y + "px"; adiv.innerHTML=str; //要加body否則會報錯的 document.body.appendChild(adiv); return adiv; } writeAt("測試",100,100);//在100,100處顯示"測試"
5、關於全域變數的解釋
if (true) { var a = 1;}alert(a);
輸出的是:1
解釋:JavaScript變數沒有區塊範圍,只要在方法中定義,無論是在switch塊中還是if塊中,他們的作用範圍都是整個函數。
而除此之外,就是全域變數了。if,for 都沒有獨立範圍。
window.onload = function(){ var a = 10; if(true){ var a = 9; } alert(a); }
輸出的是:9
6、解決頁面訪問量大的資源下載問題
當訪問使用者量巨大時候可以把外部CSS寫到頁面內部或者是將幾個外部CSS合成到一個CSS中。
JS也是能整合的整合,能內建的內建。
而圖片,則使用CSS精靈的方法,將眾多小圖片合成為一個大圖片。歸納起來都是兩個字:合成。
通過這個方法,就可以減少資源讀取請求串連數,消除此類現象。