タグ

javascriptとperformanceに関するsinsengumi-2のブックマーク (3)

  • 14のjQueryベストプラクティス[to-R]

    14のjQueryベストプラクティス 原文:14 Helpful jQuery Tricks, Notes, and Best Practices 良かったので翻訳してみました。かなりの意訳で、上手に訳せてない箇所も多いので詳しくは原文を参照してください。 1.メソッドはjQueryオブジェクトを返す ほとんどのメソッドがjQueryオブジェクトを返すのが重要です。 これにより次のようなメソッドチェーンが可能になっています。 $someDiv .attr('class', 'someClass') .hide() .html('new stuff'); jQueryオブジェクトを返すのがわかっていれば次のように分割して書くことも出来ます。 var someDiv = $('#someDiv'); someDiv.hide(); 次のように一行で書くことも出来ます。 var someDiv

    14のjQueryベストプラクティス[to-R]
  • jqueryの基礎

    よく使うようになった JavaScript ライブラリの jQuery を簡単に紹介。 jQueryの使い方 まず jQueryをダウンロードして利用する html でロードするようにします。そして、CSSクラスやCSS ID に対して動作させたい内容(アクション)を関数で定義します。どのように jQuery が動作するか簡単な図を以下に示します。 この例では、"ボタン"リンクがクリックされたら、隠れている"panel"をスライド表示されるものです。 実際の動作例: ↓ボタン $()関数 jQuery のもっとも基となる操作は $() 関数を利用することです。この関数で操作したい対象を選び、様々な操作を行うことができます。$()の指定方法は、CSSXPathどちらでも利用できます。 指定場所(セレクタ) 概要 例

  • CSSセレクタの高速化の話し - Webtech Walker

    続・ハイパフォーマンスWebサイトを読んでCSSセレクタの高速化の話しが面白かった(というか全然知らなくてちょっとびびった)ので紹介します。 セレクタは右から左に解釈される これは正直知らなくて、結構衝撃でした。 #foo .bar {} これはなんとなく#fooを探して、その中の.barを探している気がしてたんですけど、実は.barを探して、その親要素に#fooがあるかを探すそうです。なので特に#fooが必要なければ .bar {} と書いたほうが高速だということ。 また、以下の様に要素名で指定すると、その要素を全て探します。 #foo a {} これは一度a要素を全て探すので、できればaにclassをふって #foo .anchor {} とするほうが高速のようです。(#fooをとるとより高速) 特にユニバーサルセレクタなどは、 #foo * {} とすると、全ての要素の親要素に対して

    CSSセレクタの高速化の話し - Webtech Walker
  • 1