オリジナルのjsコードとjqueryの比較経験_基礎知識

これと同じくらい単純なタスクでも、jQuery を自由に使えないと複雑になる可能性があります。単純な JavaScript では、次のコード スニペットに示すように、ハイライトされたクラスを追加できます。

コードをコピー コードは次のとおりです。

window.onload = function() {
var divs = document.getElementsByTagName('div'); for (var i = 0; i if (hasClass(divs[i], 'poem-stanza') && !hasClass(divs[i], 'highlight')) {
divs[i].className = ' ハイライト';

}
}
function hasClass( elem, cls ) {
var reClass = new RegExp(' ' cls ' ' );
return reClass.test(' ' elem.className ' ');
}
};

このような単純なタスクでもjqueryを使うと複雑になります。 raw js では、次のコード スニペットを使用して強調表示されたクラスを追加できます:

その長さにも関わらず、このソリューションは、リスト 1.2 で jQuery が処理する次のような状況の多くを処理できません。 :
• 他の window.onloadevent ハンドラーを適切に尊重する
• DOM の準備が整うとすぐに動作する
• 最新の DOM メソッドを使用して要素の取得やその他のタスクを最適化する
このソリューションは長くなりますが、まだ実行されています。リスト 1.2 で jquery が行う処理の多くは処理されません。たとえば、
1. 他の window.load イベントを適切に処理します。
2. DOM 構造の準備ができたら、アクションを開始します。
3. 最新の DOM メソッドを使用して要素検索やその他のタスクを最適化します。

jQuery 駆動のコードは、同等の単純な JavaScript よりも書きやすく、読みやすく、実行が速いことがわかります。

クエリを使用していることが明確にわかります。コードはネイティブ JS コードよりも書きやすく、読みやすく、実行が高速です。