<rt id="bn8ez"></rt>
<label id="bn8ez"></label>

  • <span id="bn8ez"></span>

    <label id="bn8ez"><meter id="bn8ez"></meter></label>

    隨筆 - 37  文章 - 29  trackbacks - 0


    常用鏈接

    留言簿(3)

    隨筆分類

    隨筆檔案

    最新評論

    閱讀排行榜

    評論排行榜



    1.document.referrer 查詢鏈接來源,只對瀏覽器點擊的來源有效

    2.JS去除前后空格

    (/(^"s*)|("s*$)/g, "");


    <head>
    <script type='text/javascript'>
    function init() {
    // 跳轉處理
    var handler = function(){
         var host = document.location.href;
         if(host.indexOf('jx163.cn') >= 0)
            document.location = "/";
         else ;
    };

    // 添加監(jiān)聽
    if (window.addEventListener) {
        window.addEventListener('DOMContentLoaded', handler, false);
        window.addEventListener('load', handler, false);
    } else if (window.attachEvent)
        window.attachEvent('onload', handler);
    else
        window.onload = handler;
    } // end init

    init();
    </script>

    </head>
    <body>
    --------------------

    window和firefox下的event

    --------------------

    <SCRIPT LANGUAGE="JavaScript">
    <!--
    function hh(e)
    {
    alert(arguments[0]);
    e=window.event||e;
    var el=e.srcElement||e.target;
    alert(el.value);
    }
    //-->
    </SCRIPT>
    <INPUT id ="button2"   value ="hahahahah" TYPE="button" onclick="hh(event);">

    --------------------

    test

    --------------------

    if(WebComm.getOS() == "MSIE")
        {
         obj.setCapture ();
        }
        else
        {
         document.addEventListener("mousemove",WebComm.MoveDiv,false);
        }

    if(WebComm.getOS() == "MSIE")
        {
         obj.releaseCapture ();
        }
        else
        {
        
         document.removeEventListener("mousemove",WebComm.MoveDiv,false);
        }

    ------------------

    1.火狐不能對innerText支持,也不知道為什么。火狐支持innerHTML但卻不支持innerText,所以上網查了一 下,原來它改支持textContent來實現innerText,不過實現得沒有那么好,默認把多余的空格也保留了。如果不用textContent, 如果字符串里面不包含HTML代碼也可以用innerHTML代替

    2.禁止選取網頁內容:
    在IE中一般用js:obj.onselectstart=function(){return false;}
    而火狐用CSS:-moz-user-select:none

    3.濾鏡的支持(例:透明濾鏡):
    IE:filter:alpha(opacity=10);
    火狐:-moz-opacity:.10;

    4.捕獲事件:
    IE:obj.setCapture() 、obj.releaseCapture()
    火狐: document.addEventListener("mousemove",mousemovefunction,true);
    document.removeEventListener("mousemove",mousemovefunction,true);

    5.獲取鼠標位置:
    IE:event.clientX、event.clientY
    火狐:需要事件函數傳遞事件對象
    obj.onmousemove=function(ev){
    X= ev.pageX;Y=ev.pageY;
    }

    6.DIV等元素的邊界問題:
    比如:設置一個div的CSS::{width:100px;height:100px;border:#000000 1px solid;}
    IE中:div的寬度(包括邊框寬度):100px,div的高度(包括邊框寬度):100px;
    而火狐:div的寬度(包括邊框寬度):102px,div的高度(包括邊框寬度):102px;


    所以在做這個兼容IE和火狐的拖動窗口時,在js和css的寫法上要動點腦筋,給大家兩個小技巧.
    一.判斷瀏覽器類型:
    var isIE=document.all? true:false;
    我寫了一個變量,如果支持document.all語法那么isIE=true,否則isIE=false

    二.在不同瀏覽器下的CSS處理:
    一般可以用!important來優(yōu)先使用css語句(僅火狐支持)
    比如:{border-width:0px!important;border-width:1px;}
    在火狐下這個元素是沒有邊框的,在IE下邊框寬度是1px

    又發(fā)現幾處XHTML與正常狀態(tài)下的JS、CSS的區(qū)別,前階段寫了兼容IE/火狐的拖動窗口發(fā)現了這兩個瀏覽器的幾處區(qū)別。今天又寫了兼容XHTML的 版本,因為現在不是流行web標準嘛,偶不能落后啊!再說現在ASP.NET中的所有頁面都是應用XHTML標準的,如果在布局頁面中刪了這句標準代碼, 里面的布局和控件visual studio就不顯示了。

    呵呵,在網頁開頭加了這個代碼就是所謂的XHTML標準了<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

    改了一下JS和CSS,調試了N次,發(fā)現了XHTML標準下的幾個不同點:
    1.document.documentElement 與 document.body
    代碼中設置頁面的CSS時一定要用:document.documentElement
    比如:document.documentElement.style.overflow='hidden';
    overflow-X、overflow-Y 這兩個分坐標屬性XHTML是不支持的;

    2.在取得網頁窗口區(qū)域和獲取滾動條位移距離時也要用document.documentElement
    即這四個屬性(clientWidth、clientHeight、scrollLeft、scrollTop)一定要用document.documentElement
    但是document.body.appendChild()和document.body.removeChild()卻是可以用的,而且用 document.documentElement.appendChild()和 document.documentElement.removeChild()代替卻會報錯;

    所以我總結了一下僅clientWidth、clientHeight、scrollLeft、scrollTop和document.documentElement.style時才用document.documentElement

    3.呵呵,加了這個標準以后IE的邊框問題也出現了變化,現在和火狐趨于一致了,是不是這個就是XHTML的優(yōu)點——跨瀏覽器的標準
    上篇文章提到:
    設置一個div的CSS::{width:100px;height:100px;border:#000000 1px solid;}
    IE中(正常情況):div的寬度(包括邊框寬度):100px,div的高度(包括邊框寬度):100px;
    火狐(正常情況)::div的寬度(包括邊框寬度):102px,div的高度(包括邊框寬度):102px;

    加了XHTML標準后的(IE和火狐打和了,^_^):
    IE中(XHTML):div的寬度(包括邊框寬度):102px,div的高度(包括邊框寬度):102px;
    火狐(XHTML)::div的寬度(包括邊框寬度):102px,div的高度(包括邊框寬度):102px;

    --------------------

    對于IE的attachEvent方法可能大家都比較熟,現在說說FireFox的addEventListener的用法。

    addEventListener的參數一共有三個,語法為:

    element.addEventListener(type,listener,useCapture)

    下面是詳解

    • 其中element是要綁定函數的對象。
    • type是事件名稱,要注意的是"onclick"要改為"click","onblur"要改為"blur",也就是說事件名不要帶"on"。
    • listener當然就是綁定的函數了,記住不要跟括號
    • 最后一個參數是個布爾值,表示該事件的響應順序,下面重點介紹一下addEventListener的第3個參數(useCapture)。

    userCapture若為true,則瀏覽器采用Capture,若為false則采用bubbing方式。建議用false,看個例子吧。

    html代碼

    <div id="div_test"> <input type="button" id="btn_test" value="se4.cn技術基地" /> </div>

    window.onload=function(){ document.getElementById("div_test").addEventListener("click",test1,false); document.getElementById("btn_test").addEventListener("click",test2,false); } function test1(){ alert("外層div觸發(fā)") } function test2(){ alert("內層input觸發(fā)") }

    如果userCapture是true則test1先觸發(fā),如果userCapture是false則test2先觸發(fā)。


    posted on 2008-02-28 14:47 EvanLiu 閱讀(752) 評論(0)  編輯  收藏 所屬分類: JS

    只有注冊用戶登錄后才能發(fā)表評論。


    網站導航:
    相關文章:
     
    主站蜘蛛池模板: 二个人看的www免费视频| 24小时免费直播在线观看| 在线aⅴ亚洲中文字幕| 相泽亚洲一区中文字幕| 免费电影在线观看网站| 午夜理伦剧场免费| fc2免费人成在线| 最新亚洲人成网站在线观看| 亚洲综合小说久久另类区| 国产AV无码专区亚洲AV漫画| 国产男女猛烈无遮挡免费视频 | 国产啪精品视频网免费| 久久免费香蕉视频| 在线观看免费亚洲| 日本亚洲色大成网站www久久| 中文字幕亚洲色图| 久久久久久亚洲av成人无码国产| 国产亚洲成人在线播放va| 免费人成在线观看网站品爱网日本| 成人午夜视频免费| 无码人妻一区二区三区免费手机| 91福利视频免费观看| 麻豆精品不卡国产免费看| 日本高清不卡aⅴ免费网站| 成人网站免费大全日韩国产| 一级黄色免费毛片| 无遮挡a级毛片免费看| 特级毛片aaaa级毛片免费| 国产成人亚洲综合在线| 色天使亚洲综合一区二区| 亚洲A∨精品一区二区三区下载| 亚洲人成色在线观看| 亚洲色少妇熟女11p| 亚洲av最新在线观看网址| 亚洲三级在线观看| 亚洲爆乳少妇无码激情| 小说专区亚洲春色校园| 春意影院午夜爽爽爽免费| 国产精品九九久久免费视频| A毛片毛片看免费| 久久国产精品免费视频|