Archive of published posts on 2012.2月

XMLをjQueryで取得してみる

Posted by specterant on 2012.02.25

jQueryでXMLデータの読み込みのお勉強。
とりあえず、このブログのRSSを取得して表示してみることに。

取得してみると日付が「Tue, 07 Feb 2012 04:52:55 +0000」みたいに表示されてしまう。
気に食わなかったので、Dateオブジェクトでゴニョゴニョして変換しました。

で、下記がその結果です。


ほんでもって、こっちがJavaScriptの記述。

$(function(){
	$.ajax({
		url: "http://log.specterant.com/?feed=rss2",
		type: "GET",
		dataType: "xml",
		success: function(xml)
		{
			$("item", xml).each(function(entryNum) {
				var titleTxt = $("title", this).text();
				var dataTxt = dateSetFunc($("pubDate", this).text());
				var linkUrl = $("link", this).text();
				$("div#rssdata").append($('<p>' + dataTxt + ':' + '<a href="' + linkUrl + '" target="_blank">' + titleTxt + '</a></p>'));
			});
		},
		error: function()
		{
			$('div#rssdata').append('XMLの読み込みが出来ませんでした。');
		}
	});
	
	
	function dateSetFunc(str)
	{
		var objDate = new Date(str);
		var y = objDate.getFullYear();
		var m = twoDigit(objDate.getMonth() + 1);
		var d = twoDigit(objDate.getDate());
		var ymd = y + "." + m + "." + d;
		str = ymd;
		return str;
	}
	
	function twoDigit(d)
	{
		d = "0" + d;
		d2 = d.substr(d.length - 2, 2);
		return d2;
	}
});
ブログサービスとかのRSSを取得する時に便利かもってことでメモでした。

【2012.02.28追記】
ブログサービスとかのRSSを取得する時に便利かもって書いたけど、
クロスドメインから取得することになるから、そこんとこ処理しないとだめやね…。
今回記述したのは、同一ドメイン内でしか使えんから…。
近いうちにクロスドメインから取得してみますです。

No Comments

インクリメントとデクリメント

Posted by specterant on 2012.02.07

ActionScriptやJavaScriptなど組むとき、i++や++iのような演算子を使用することがあります。
++(インクリメント)は、1を足して、–(デクリメント)は、1を引きます。

しかし、++や–をオペランド(演算の対象値や変数)の前にするか後にするかで、処理の順番が変わってきます。

/********************************
//前にした場合
********************************/
var i = 10;
var a = ++i * 2;

alert(i); //【結果】11
alert(a); //【結果】22
 
 
/********************************
//後にした場合
********************************/
var i = 10;
var a = i++ * 2;

alert(i); //【結果】11
alert(a); //【結果】20
前にした場合、iに1を足した後に、2を掛けている。
後にした場合は、iに1を足す前に、2を掛けている。
ということになるのですよ!オレ!

ちなみに、–(デクリメント)は、足すのではなく引くに変わるだけで同じ処理をします。
そんな訳で、物覚えが悪いのでメモしたっちゃ。

No Comments

HTML内にJavaScriptを記述する方法

Posted by specterant on 2012.02.04

HTML/XHTML内に記述する場合、<script>〜</script>のようにしますが、<script>タグが対応していないブラウザなどあるようです。
一番は、外部にするのがベストだと思うのですが、そうもいかないこともあるので、下記のように記述するようにした方がいいぜってことでメモ。

/***************************************
//HTMLの場合
***************************************/
<script type="text/javascript">
<!-- 
	//ここに記述。
-->
</script>
 
 
/***************************************
//XHTMLの場合
***************************************/
<script type="text/javascript">
//<![CDATA[
	//ここに記述。
//]]>
</script>
 
 
/***************************************
//HTML5の場合
***************************************/
<script>
	//ここに記述。
</script>
 
 
/***************************************
//最新ブラウザではなく古いブラウザの場合
//language属性も記述した方がいいみたい。
***************************************/
<script language="javascript" type="text/javascript">
<!-- 
	//ここに記述。
-->
</script>

No Comments

jQueryのbindメソッド

Posted by specterant on 2012.02.01

いつも忘れてしまうのでメモ。
bindメソッドは、セレクタで発生するイベントに対してイベント処理を行う関数を関連付けたり、一度に複数のイベントを設定できるモノ。

で、標準で以下のイベントが設定できます。

blur, focus, load, resize, scroll, unload, click, dblclick, mousedown, mouseup, mousemove, mouseover, mouseout, mouseenter, mouseleave, change, select, submit, keydown, keypress, keyup, error

/********************************
//書式
********************************/
$('セレクタ').bind('イベント名', function() {
  //セレクタでイベントが発生した時に実行するイベント処理
});
 
 
//イベント処理を行う関数にデータを渡す場合
$('セレクタ').bind('イベント名', "イベントデータ", function(event) {
  //event.dataでイベントデータを取得
});
 
 
//複数のイベントを同時に設定する場合(※イベント名の間にスペース入れて区切る)
$('セレクタ').bind('イベント名 イベント名', function() {
  //セレクタでイベントが発生した時に実行するイベント処理
});
/********************************
//そんな訳で、記述例
********************************/
$('#div1 a').bind('click', function() {
  alert("clickしました!");
});
 
 
//イベント処理を行う関数にデータを渡す場合
/* ------------------------------------------------------------------------
var message = '#div2でイベントデータ取得!';
$('#div2 a').bind('click', function() {
  alert(message);
});
message = '#div4でイベントデータ取得!';
$('#div4 a').bind('click', function() {
  alert(message);
});
【出力】#div4でイベントデータ取得!('#div2 a'も'#div4 aも同じになっちゃう。)
------------------------------------------------------------------------ */
var message = "イベントデータ取得!";
$('#div2 a').bind('click', {m:message}, function(e) {
  alert(e.data.m);
});
 
 
//複数のイベントを同時に設定する場合(※イベント名の間にスペース入れて区切る)
$('#div3 a').bind('click mouseout', function() {
  alert("clickかmouseoutしました!");
});

参考サイト
.bind() – jQuery API
bind(type, [data], fn) – jQuery API 1.4.4 日本語リファレンス – StackTrace

No Comments