スニペット集
2009/09/12(土) 23:50 Javascript親記事へこのエントリーをはてなブックマークに追加

小技的なものを書きためていく場所

splitで分割した最後の要素を取る

var m = location.href.split("/").pop();
alert(m);

配列の最後を非破壊的に取得

上と同じようなもの。
var ary = [1,2,3,4];
ary.slice(-1)[0];// 4

http://example.com/?hoge=huga#aaa から/?hoge=hugaを取り出す

location.pathname + location.search

scriptタグで呼び出したjsのディレクトリパスを取得

とてもシンプルに自分自身が属する script 要素を取得 - IT戦記
Togetter - まとめ「scriptタグからディレクトリを取得」 いろいろな方法。速度比較
// <script type="text/javascript" src="http://example.com/lab/test.js"></script>
// から呼ぶ
var currentScript = (function (e) {
    if(e.nodeName.toLowerCase() == 'script') return e;
    return arguments.callee(e.lastChild);
})(document);
var currentPath = currentScript.src.split("/").slice(0,-1).join("/"); // http://example.com/lab

単純な置換

"foobar".split('foo').join('bar');//barbar

正規表現でマッチしたものを取り出す

var m = navigator.userAgent.match(/Firefox\/([\d\.]+)/);
m = m && m[1];
alert(m);

0か1にする

+!!変数
var a;
var b = 0;
var c = "test";
var d = 3; 
alert("a: "+ +!!a + " b: "+ +!!b + "\n c: "+ +!!c +" d: "+ +!!d);

ページ中の相対URLを絶対URLに変換

相対パスを絶対パスに変換する - How We Hear
http://d.hatena.ne.jp/brazil/20070103/1167788352

function absolutePath(path){
  var e = document.createElement('span');
  e.innerHTML = '<a href="' + path + '" />';
  return e.firstChild.href;
}
var aTags =document.getElementsByTagName("a");
for(var i=0;i<aTags.length;i++){
	aTags[i].setAttribute("href" ,absolutePath(aTags[i].getAttribute("href")));
}

filterと正規表現

document.querySelectorAllはCSSセレクタ
セレクタでマッチしたものを正規表現でフィルタをして取り出す。
Array.filter の使い方 - hogehoge
http://d.hatena.ne.jp/teramako/20070514/p1

var m=[].filter.call(document.querySelectorAll('a'), /^http:\/\//);
alert(m.join('\n'));

行番号を取得する

errorを作って取得する。FireFoxのみ。[JavaScript] Errorから行番号を取得する。 - うなの日記
(new Error).lineNumber;

匿名関数とarguments.calleeで再帰呼び出し

JavaScriptで、定期的に呼び出される処理を簡単に作る - NEST :: laboratory
(function() {
	alert((new Date()) + '\nfunction is:\n\n' + arguments.callee);
	setTimeout(arguments.callee, 10000);
})();

insertAfter

/*
 * @newNode 挿入するノード
 * @node 挿入先のノード(このノードの後ろに挿入)
 */
function insertAfter(newNode, node) {
	return node.parentNode.insertBefore(newNode, node.nextSibling);
}

配列を結合して文字列にする関数

/**
 * 文字列から区切り文字で切った配列を作成する。
 * 空要素は除外される。
 * 配列が空の場合は、空文字列が返される。。
 * 
 * @param {Array} txts 文字列。
 * @param {String} delm 区切り文字列。
 * @return {String} 区切られた配列。
 */
function splitText(txts , delm){
	if(!txts)
		return '';
	if(delm==null)
		delm = ',';
	return txts.split(delm).filter(truth) ;
}
/**
 * 配列を結合し文字列を作成する。
 * 空要素は除外される。
 * 配列が空の場合は、空文字列が返される。。
 * 
 * @param {Array} txts 文字列配列。
 * @param {String} delm 区切り文字列。
 * @return {String} 結合された文字列。
 */
function joinText(txts, delm){
	if(!txts)
		return '';
	
	if(delm==null)
		delm = ',';
	txts = [].concat(txts).filter(truth);
	return txts.join(delm);
}
function truth(a){
	return !!a;
}

ページの文字コードを取得

if(document.all){
    alert(document.charset)    
}else{
    alert(document.characterSet)    
}

文字列を反転させる

"文字列".split("").reverse().join("");

配列をシャッフルする

function shuffle(ary) {
    return ary.sort(function(a,b){ return Math.random()>Math.random()?1:-1 });
};
shuffle([0,2,3,5,6,7,1,3,3]);

getTime(); したものから日時を作成

function createDate(dateTime){
	 //曜日の配列を作成
   var weeks = new Array("日","月","火","水","木","金","土");
   //日付の取得
   var dateObj = new Date(parseInt(dateTime) * (dateTime.length > 10 ? 1 : 1000));;
   var year = dateObj.getFullYear();
   var mon = dateObj.getMonth() + 1;
   var date = dateObj.getDate();
   console.log(dateObj.getSeconds());
   var youbi = weeks[dateObj.getDay()];   //日付を表示
   return [year,"年",mon,"月",date,"日(",youbi,")"].join("");}

特定の文字列に囲まれた範囲を取り出す

function trimSurround(str ,first , end){
    return str.substring(str.indexOf(first)+1,str.indexOf(end));
}
trimSurround("aaaa(test)sss","(",")");// test

あるtagのattrがvalueなものを取り出す関数


function getElementsByAttr(tag, attr, value){
	var arrayEl = new Array();
	var el = document.getElementsByTagName(tag);
	for(i=0, j=0; i<el.length; i++){
		if(el[i].getAttribute(attr) == value){
			arrayEl[j] = el[i];
			j++;
		}
	}
	return arrayEl;
}

名前:  非公開コメント   

  • TB-URL  http://efcl.info/adiary/03/tb/