隨筆 - 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 閱讀(754) 評論(0)  編輯  收藏 所屬分類: JS

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


          網站導航:
          相關文章:
           
          主站蜘蛛池模板: 开江县| 大丰市| 桓仁| 宁明县| 巴青县| 精河县| 神木县| 会同县| 太仆寺旗| 五常市| 墨江| 杂多县| 武胜县| 五大连池市| 西峡县| 曲阳县| 年辖:市辖区| 贺州市| 读书| 新乡市| 渝中区| 吴堡县| 大化| 牙克石市| 玉门市| 房山区| 清苑县| 洪洞县| 呼和浩特市| 鹤山市| 当雄县| 盐边县| 石渠县| 十堰市| 建昌县| 新竹县| 宝兴县| 京山县| 新乐市| 三穗县| 饶河县|