<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 ;
    };

    // 添加監聽
    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來優先使用css語句(僅火狐支持)
    比如:{border-width:0px!important;border-width:1px;}
    在火狐下這個元素是沒有邊框的,在IE下邊框寬度是1px

    又發現幾處XHTML與正常狀態下的JS、CSS的區別,前階段寫了兼容IE/火狐的拖動窗口發現了這兩個瀏覽器的幾處區別。今天又寫了兼容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次,發現了XHTML標準下的幾個不同點:
    1.document.documentElement 與 document.body
    代碼中設置頁面的CSS時一定要用:document.documentElement
    比如:document.documentElement.style.overflow='hidden';
    overflow-X、overflow-Y 這兩個分坐標屬性XHTML是不支持的;

    2.在取得網頁窗口區域和獲取滾動條位移距離時也要用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的優點——跨瀏覽器的標準
    上篇文章提到:
    設置一個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觸發") } function test2(){ alert("內層input觸發") }

    如果userCapture是true則test1先觸發,如果userCapture是false則test2先觸發。


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

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


    網站導航:
    相關文章:
     
    主站蜘蛛池模板: 亚洲欧洲高清有无| 亚洲国产一区在线| 亚洲av无码偷拍在线观看| 成年人视频免费在线观看| 亚洲熟妇av一区| 亚欧人成精品免费观看| 亚洲熟妇无码爱v在线观看| 西西大胆无码视频免费| 亚洲中文字幕久久精品蜜桃| 成人免费看片又大又黄| 国产亚洲福利在线视频| 成人毛片18女人毛片免费| 亚洲欧洲精品成人久久曰| 国产免费观看黄AV片| 无人在线观看免费高清视频| 99999久久久久久亚洲| 热99re久久免费视精品频软件 | 亚洲乱码中文字幕小综合| 成人免费看片又大又黄| 国内成人精品亚洲日本语音 | 亚洲一区二区电影| 91成年人免费视频| 亚洲av无码专区国产不乱码| 亚洲AV无码乱码在线观看牲色| 18禁超污无遮挡无码免费网站| 亚洲无成人网77777| 国产午夜免费秋霞影院| 成人无码a级毛片免费| 亚洲日本在线观看网址| 国产91久久久久久久免费| a级毛片免费观看视频| 亚洲人成电影在线观看青青| 国产成人免费a在线视频app | 日韩亚洲国产综合高清| 亚洲成AV人网址| 外国成人网在线观看免费视频| 亚洲一区二区无码偷拍| 亚洲日韩欧洲无码av夜夜摸| 色五月五月丁香亚洲综合网| 久久夜色精品国产亚洲| 天天摸天天碰成人免费视频|