ブラウザカーネルと互換性の問題

ブラウザと互換性
1.5種類のcssブラウザ互換の書き方
①*: ie 6,ie 7は認識できる;② _および-:ie 6は識別可能である.③ !important:優先度が高く、ie 7以上、firefoxがサポートしていることを示し、ie 6認識帯!importantのスタイルプロパティですが、認識していません!importantの優先度;④エンジン接頭辞-ms--moz--o--webkit-
2.3種類のjsブラウザ互換性の書き方
詳細:https://m.jb51.net/article/16319.htm①IEはparentElementを用いる親ノード、parentを得ることができる.childrenはノードのすべての子供のノードを得た.Firefoxはサポートされていません.解決方法:parentNodeとparentを使用します.childNodes.
②FirefoxはXMLHttpRequest、IEはActiveXObjectを使用します.解決方法:

if (window.XMLHttpRequest) { 
req = new XMLHttpRequest();
 } 
else if (window.ActiveXObject) {
 req = new ActiveXObject("Microsoft.XMLHTTP");
  }

③イベントバインドaddEventListener(「click」,function,true)互換firefox,chrome,safari,opera,IE 9+attachEvent(「onclick」,function)互換IE 7,8解決:

function add(obj,event){
          if ( obj.addEventListener) {
          obj.addEventListener(event,fn,fase);
          }
else{ obj.attachEvent("on"+event,fn);}
 }

④泡立ち止めevent.stopPropagation()はIE 6-8 eventと互換性がありません.cancleBubble=true互換IE
解決:

function stop(event){
    if (event.stopPropagation) {   event.stopPropagation();}
else{  event.cancleBubble = true;   }   }

3.ブラウザカーネル

       	  	                
IE     	Trident	               -ms-
Firefox	    Gecko  	                -moz-
Safari	    Webkit    	           -webkit-
opera       Blink  	                 -o-
Chrome  	Webkit（ ）、Blink（ 	-webkit-

主にブラウザエンジンプレフィックス(vendor-prefix)を追加する必要があるプロパティには、•@keyframes•移動および変換プロパティ(transition-property/duration/timing-function/delay)•アニメーションプロパティ(animation-name/duration/timing-function/delay)があります.•border-radius•box-shadow•backface-visibility•columnプロパティ•flexプロパティ•perspectiveプロパティ : 4.IEとFirefoxの互換性のないコードを書く
キャプチャイベントFFにはsetCapture()、releaseCapture()メソッドIEにおける解決メソッドobjはない.setCapture(); obj.releaseCapture(); 火狐の中の解决方法:window.captureEvents(Event.MOUSEMOVE|Event.MOUSEUP); window.releaseEvents(Event.MOUSEMOVE|Event.MOUSEUP); if (!window.captureEvents) { o.setCapture(); }else { window.captureEvents(Event.MOUSEMOVE|Event.MOUSEUP); } if (!window.captureEvents) { o.releaseCapture(); }else { window.releaseEvents(Event.MOUSEMOVE|Event.MOUSEUP); }