はるらぼ

jQuery、Perl、Linux、デザイン、UI関連の備忘録です。※引用する場合は自己責任で。

【jQueryなど】よく使うのに忘れやすい記述メモメモ

jQueryで複数のセレクタを指定する

カンマ区切りでつなげる。CSSとおんなじ。

$(function() {
  $(".hoge, .fuga").メソッド();
});

jQueryセレクタに変数を使う

parts = $(this).val();
$('img[src*= ' + parts + ']').show();

+忘れちゃうんですよねぇ・・・。 kaicoo.blogspot.jp

変数といえばこれも。 javascriptの足し算の演算は変数を数値型にしてから。

var a = 100
var b = 200
total = parseInt(a) + parseInt(b);
alert(total); //結果 300

blog.pinkmonky.net

jQueryで処理を繰り返す(該当するセレクタすべてに適用する)

each

$(function() {
  $(".hoge").each(function(){
    $(this).メソッド();
  });
});

ifで要素が存在するかの分岐

if($(".hoge").length) {
  // 存在する場合の処理
} else {
  // 存在しない場合の処理
}

モバイル、タブレットの分岐

iPhone Android iPad

var device = navigator.userAgent;
if(device.indexOf('iPhone') > 0 || device.indexOf('iPad') > 0 || device.indexOf('Android') > 0) {
  // モバイル、タブレットの処理
} else {
  // 上記以外
}

もしくは

var win_w = $(window).width();
if (win_w <= 768) {
  // モバイル、タブレットの処理
} else {
  // 上記以外
}

ファイル読み込み

document.writeでファイルを読み込むときはをエスケープすること。
HTML5では非推奨でしたっけ・・・でも使っちゃうなぁ。
// <![CDATA はコメントアウトしないと正常に動かないブラウザがあるとか。

// <![CDATA[
  document.write("<script src='hoge.js'></script>");
// ]]>

もしくは

  document.write("<script src='hoge.js'><\/script>");

これもいいですね。 参考: 団塊爺ちゃんの備忘録

var script = document.createElement("script");
// 要素ノードの属性値設定、HTML5はtypeプロパティは不要
script.src = "include.js";
var head = document.getElementsByTagName("head");
head[0].appendChild(script);
 
window.onload = function(){alert(resText);};

jQueryで値を数値として取得する(pxなし)

var top= parseInt( $('.hoge').css('top') );

qiita.com

などなど・・・。