タグ

DOMとjQueryに関するfushimikのブックマーク (4)

  • You Don't Need jQuery - Qiita

    注意とお願い この記事の内容はもはや古いです。ここに書いている方法では動かないものをいくつか見つけました。参考にする際は動作をよく確認してから使ってください。 ひとつお願いがあります。「あれ、動かないぞ」というコードを見つけたら是非コメントか編集リクエストで教えてください。解決方法までなくても結構です。「これはもう動かないよ」という印をつけたいのです。 この記事はYou Don't Need jQueryの日語訳と同じ内容です。 先日ひょんなことからYou Don't Need jQueryの日語訳をさせていただきました。著者のCam Songさんからも快諾をいただけたので1、Qiitaでも公開させていただきます。 なお、家の英語の説明は継続的にメンテされているので、この記事の情報は古くなっている可能性があります。 追記 この記事は当初は「もうjQueryは必要ない」というタイトルで

    You Don't Need jQuery - Qiita
  • [JS]不可視のDOMをコントロールしてUIを拡張するスクリプト -Shadow UI

    tooltip ツールチップ Shadow UIの使い方 Step 1: 外部ファイル まずは、ベースとしてhead内にjquery.jsと当スクリプトを外部ファイルとして記述します。 <script src="/shadow-ui/assets/js/jquery.js"></script> <script src="/shadow-ui/js/shadow.js"></script> スタイルシートはベースとなるファイルとそれぞれ用のファイルが用意されています。 <link rel="stylesheet" href="/shadow-ui/assets/css/main.css"> <link rel="stylesheet" href="/shadow-ui/css/ui.css"> <link rel="stylesheet" href="/shadow-ui/css/ui-dr

  • Klog » Blog Archive » jQueryで動的に追加したDOMのイベントを動かす方法

    jQueryのappend()やhtml()で動的に追加したDOMのclick等を動かすにはlive()を使うと良い。 例えば、hogeにmogeをappendしたとすると、以下のコードではmogeをクリックしたときにalertは出ません。 $("#hoge").append('<div id="moge">moge</div>') $("#moge").click(function() { alert('moge'); }; 以下のようにすればちゃんと動きます。 $("#hoge").append('<div id="moge">moge</div>') $("#moge").live('click' (function() { alert('moge'); });

  • js で利用する DOM の名前をどうやってつけたらよいのか - おもしろwebサービス開発日記

    js で DOM をゴニョゴニョしたい時、きっと皆さんは id や class で DOM に名前を付けて、その名前を利用して js の処理を書いていると思います。 例えば<input type="button" class="update" value="更新" />のようなボタンがあったとして、 js 側で更新処理を書くときには下記のように書きます。 $('.update').on('click', function () { // update 処理 }) でもこれだと問題になるケースがあります。よくあるのが、マークアッパーとフロントエンジニアが分業していて、マークアッパーがデザインのために class 名を変えてしまい js が動かなくなるパターン。分業せずに一人で全部やってたとしても、時間が経つにつれ使っている class 名が js だけで使っているのか、css でも使っている

    js で利用する DOM の名前をどうやってつけたらよいのか - おもしろwebサービス開発日記
  • 1