『javascript domプログラミングアート』ノート(一)――優雅ダウングレード、後方互換性、複数の関数バインディングonload関数

5473 ワード

独学を始めたばかりです.もし間違ったら、ご指摘ください.技術者の皆様のご指導を歓迎します.
「javascript domプログラミング芸術」を勉強して、勉強した知識を整理します.今日は第六章を見たばかりです.ゲットしたいくつかの知識点を覚えてください.
優雅降格
バージョンの翻訳を見て、逃げ道を残しておいて、先ほど名詞を見ましたが、おかしいと思います.以前聞いたことがありません.しかし、英語のコメントを見て、Graaceful degradationは優雅で格下げではないかと分かりました.聞いたことがあります.
本の中で例を挙げて、リンクをクリックして、一つのウィンドウをイジェクトする方法です.
function popUp(WinURL){

     window.open(WinURL,"popUp","width=320,height=480");

}
二つの裏面の典型を示した.
1 <a href="#" onclick="popUp('http://www.example.com/');return false;">Example<a> 

2 <a href="javascript:popUp('http://www.example.com/');">Example<a> 
上は埋め込みイベント処理関数で、以下の行為はjavascript疑似プロトコルです.二つの処理方法の欠点は、ブラウザがjavascriptをサポートしないと、ユーザーが正常に使えないということです.
与えられた処理方式は
<a href="http://www.example.com/" onclick="popUp(this.href); return false;">Example</a>
後方互換性
後方互換性があり、古いバージョンのブラウザの互換性を考慮して、これがよく分かります.例を示します.
if (!getElementById)  return false; 
getを感じているのは美術館の例の中の短いコードの応用です.このテクニックは後方互換とは言えません.関数最適化です.
//      

function showPic(whichPic){

    if(!document.getElementById("placeholder")) return true;//       ,  true

    //TODO           

     if(!document.getElementById("description")) return false;//       ,  false

    //TODO          

    return false;

}

//  <a>     

links[i].onclick=function(){

    return showPic(this)

}
上記はどういう意味ですか?つまり、正常に画像の結点が得られないなら、trueに戻ります.Oclickは写真リンクを開く機能を実行して、一枚の写真のページをブラウズします.画像の結点を得ることができれば、得られた写真は予約された位置に表示されます.「placholder」という容器にあります.この機能は私も実現できますが、彼のような簡潔さはありません.
複数の関数バインディングonload関数
これはコードだけを提供しています.このノートを見ても分かるはずです.説明は多くしません.ここはコードを記録しただけです.収集しました.
function addLoadEvent (func) {

    var oldLoad = window.onload;//                  

    if(typeof window.onload!='function'){//

        window.onload=func;

    }else{

        window.onload=function(){

            oldLoad();

            func();//

        }

    }

}

//       

function function_name (argument) {

    console.log(argument);

}

addLoadEvent(function_name("hehe"));

addLoadEvent(function_name("haha"));