JavaScriptメモ

セレクタ

//idで取得
document.getElementById('id');

//classで取得
//HTMLCollectoinが取得できる
document.getElementsByClassName("class");

//親要素を取得
document.getElementById("XXX").parentNode

HTMLCollection

//要素数を取得
count = HTMLColleciton.length

//要素をインデックス指定して取得
node = HTMLCollection.item(index)

メソッド

//ランダムに整数を返却
rand = Math.floor(Math.random()*要素数);

一定時間で処理をくりかえす

//100ミリ秒ごとに処理を繰り返し行う
processId = setInterval(function(){
    //ここの処理が繰り返される
},100);

//処理を止める
clearInterval(processId)；

グローバル変数

//グローバル変数
//関数の外側でvarを使って宣言
var XXX = 'a';
function …()｛
} 

クラス名変更

//要素取得
elem = document.getElementById("menuList");

//クラス名追加
elem.classList.add("menuList");
//クラス名削除
elem.classList.remove("menuList");
//クラス名が無かった時のみ追加
elem.classList.toggle("menuList");

要素のテキストを取得、変更

//要素のテキスト取得
text = element.textContent;

//要素のテキストを設定
element.textContent = "aaa";

htmlの属性取得、設定

「data-abc」のように任意の属性を作成して、文字列の受け渡しが可能

//htmlの属性取得
text = element.getAttribute("data-abc");

//htmlの属性設定
element.setAttribute("data-abc", "aaaaa");

確認ダイアログの表示

if(window.confirm('MEIGENをツイートしますか？')){
    //OKをクリックした時の動作
} else {
    //キャンセル動作
}

Jsonのエンコードとでコード

//エンコード
array = ["リンゴ","みかん","ぶどう"];
json = JSON.stringify(array);

//デコード
array = JSON.parse(json);

アラート（メッセージボックス）

alert( 'テスト！')

文字列連結

str = "aaa" + "bbb"

比較演算子（NOT）

bool = aaa != 4

URLを新しいタブで開く

window.open('URL');
第２パラメータで、ウィンドウ名の指定
第３パラメータで、その他いろいろ設定できる