jQuery

jQueryでのfind()で得られるDOM配列について

ついでなので、jQueryのfind()メソッドで得られる配列についてのメモ。 var list = $('ul#hoge > li'); var list = $('ul#hoge').find('li'); 上記二式とも得られるオブジェクトは同じなのですが、ここで例えば list[0].hide(); とするとエラーになる。とい…

jQueryでのイベントコールバックの"this"を考える

jQuery におけるthisの扱いについて、簡単なメモというか案外忘れがちなこと。 <ul id="tgs"> <li>Hitomi</li> <li>Miyu</li> <li>Yuri</li> <li>Mei</li> <li>Ayano</li> </ul> のようになっている場合、 Hitomiがクリックされた時、このリストの何番目?を取得する 「index()」というメソッドに投げるオブジェクトについて…

jQueryの$.extendを使ってみたくなる、今さら聞けない$.extend()

以下ではjQuery.extend() (以下$.extend())がどういう動きをするのか、 そして、$.extend() と $.fn.extend() の違い、紛らわしさをまとめました。 jQuery.extend() の使い方 function momoclo(osaretai) { var members = { red : 'kanako', yellow : 'shi…

jQueryで(nの倍数)番目の要素だけに処理する

jQueryで(nの倍数)番目の要素だけに処理する例えば、4の倍数番目だけmargin-rightを取り除くといった処理。 $('.book_container').each(function(i){ if(((i+1)%4) == 0){ $(this).css({'margin-right': '0px'}); } }); DOMに対してeachでループする際、fu…

jQueryでis(':visible')を使った着色

前回の記事で使用したソースへの追記です jQueryを使って領域外のクリックイベントで消えるボックスを複数設定 - Surflog 2.0 <html> <head> <meta http-equiv="Content-Type" content="text/html"; charset="utf-8"> <title>jQuery Click Outside Test</title> <style> a { color: inherit; } .content { display: none; width: 400px; height: 80px; } .red { b…</meta></head></html>