『javascript domプログラミングアート』ノート(一)――優雅ダウングレード、後方互換性、複数の関数バインディングonload関数
5473 ワード
独学を始めたばかりです.もし間違ったら、ご指摘ください.技術者の皆様のご指導を歓迎します.
「javascript domプログラミング芸術」を勉強して、勉強した知識を整理します.今日は第六章を見たばかりです.ゲットしたいくつかの知識点を覚えてください.
優雅降格
バージョンの翻訳を見て、逃げ道を残しておいて、先ほど名詞を見ましたが、おかしいと思います.以前聞いたことがありません.しかし、英語のコメントを見て、Graaceful degradationは優雅で格下げではないかと分かりました.聞いたことがあります.
本の中で例を挙げて、リンクをクリックして、一つのウィンドウをイジェクトする方法です.
与えられた処理方式は
後方互換性があり、古いバージョンのブラウザの互換性を考慮して、これがよく分かります.例を示します.
複数の関数バインディングonload関数
これはコードだけを提供しています.このノートを見ても分かるはずです.説明は多くしません.ここはコードを記録しただけです.収集しました.
「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"));