<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Olen Onnellinen 2 &#187; JavaScript</title>
	<atom:link href="http://blog.magellanic.net/archives/category/javascript/feed" rel="self" type="application/rss+xml" />
	<link>http://blog.magellanic.net</link>
	<description>さまようITエンジニアの日記です。システム開発から資格試験、ゲーム、ライトノベルまで何でもありの雑記。</description>
	<lastBuildDate>Thu, 05 Jan 2012 04:29:22 +0000</lastBuildDate>
	<language>ja</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.3.1</generator>
		<item>
		<title>jQueryのデバッグ</title>
		<link>http://blog.magellanic.net/archives/707</link>
		<comments>http://blog.magellanic.net/archives/707#comments</comments>
		<pubDate>Sat, 19 Dec 2009 03:31:26 +0000</pubDate>
		<dc:creator>koshian</dc:creator>
				<category><![CDATA[JavaScript]]></category>
		<category><![CDATA[jQuery]]></category>

		<guid isPermaLink="false">http://blog.magellanic.net/?p=707</guid>
		<description><![CDATA[jQuery 開発者向けメモ &#8211; リファレンス ↑のサイトのサンプルで使われている「jquery_dump」という関数がデバッグによいな、と思ったのですが、標準ではないみたい。 この方が作成した関数なのだろう [...]]]></description>
			<content:encoded><![CDATA[				<p><a href='http://www.mikage.to/jquery/jquery_ref.html'>jQuery 開発者向けメモ &#8211; リファレンス</a></p>
				<p>↑のサイトのサンプルで使われている「jquery_dump」という関数がデバッグによいな、と思ったのですが、標準ではないみたい。</p>
				<p>この方が作成した関数なのだろうか？もしくはプラグイン？</p>
				<p>ソースにもライセンス記述がなかったので勝手に使っちゃってよいものかと悩むところ。</p>
]]></content:encoded>
			<wfw:commentRss>http://blog.magellanic.net/archives/707/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>JavaScript：ブラウザによる動作の違い～基本</title>
		<link>http://blog.magellanic.net/archives/210</link>
		<comments>http://blog.magellanic.net/archives/210#comments</comments>
		<pubDate>Wed, 07 Jan 2009 13:39:48 +0000</pubDate>
		<dc:creator>koshian</dc:creator>
				<category><![CDATA[JavaScript]]></category>

		<guid isPermaLink="false">http://blog.magellanic.net/?p=210</guid>
		<description><![CDATA[忘れがちなのでメモ。 JavaScritpのDate#getYear()はブラウザによって返す値が異なります。 西暦4桁で返却するか、1900からの経過年で返却するか。仕様は後者ですが、IEが前者なので死に関数か。 確認 [...]]]></description>
			<content:encoded><![CDATA[				<p>忘れがちなのでメモ。</p>
				<p>JavaScritpのDate#getYear()はブラウザによって返す値が異なります。<br />
				西暦4桁で返却するか、1900からの経過年で返却するか。仕様は後者ですが、IEが前者なので死に関数か。</p>
				<p>確認するためには以下のようなHTMLをブラウザで開いてみればよいです。</p>
				<div class="src">
				<ol class="hl-main">
				<li>&nbsp;<span class="hl-brackets">&lt;</span><span class="hl-reserved">html</span><span class="hl-brackets">&gt;</span></li>
				<li>&nbsp;<span class="hl-brackets">&lt;</span><span class="hl-reserved">head</span><span class="hl-brackets">&gt;</span></li>
				<li>&nbsp;<span class="hl-brackets">&lt;</span><span class="hl-reserved">script</span><span class="hl-brackets">&gt;</span></li>
				<li><span class="hl-code">&nbsp;var date = new Date();</span></li>
				<li><span class="hl-code">&nbsp;document.write(&quot;このブラウザでの Date#getYear() の実行結果は【&quot; + date.getYear() + &quot;】です。&quot;);</span></li>
				<li>&nbsp;<span class="hl-brackets">&lt;/</span><span class="hl-reserved">script</span><span class="hl-brackets">&gt;</span></li>
				<li>&nbsp;<span class="hl-brackets">&lt;</span><span class="hl-reserved">body</span><span class="hl-brackets">&gt;</span></li>
				<li>&nbsp;<span class="hl-brackets">&lt;/</span><span class="hl-reserved">body</span><span class="hl-brackets">&gt;</span></li>
				<li>&nbsp;<span class="hl-brackets">&lt;/</span><span class="hl-reserved">html</span><span class="hl-brackets">&gt;</span></li>
				</ol>
				</div>
				<p>そんな感じ。</p>
				<p>いくらIEでしか動作を保障しないっていってもこれくらいは対応しておいた方がよいと思います。</p>
]]></content:encoded>
			<wfw:commentRss>http://blog.magellanic.net/archives/210/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>サイ本かった</title>
		<link>http://blog.magellanic.net/archives/136</link>
		<comments>http://blog.magellanic.net/archives/136#comments</comments>
		<pubDate>Thu, 20 Nov 2008 12:17:10 +0000</pubDate>
		<dc:creator>koshian</dc:creator>
				<category><![CDATA[JavaScript]]></category>

		<guid isPermaLink="false">http://blog.magellanic.net/?p=136</guid>
		<description><![CDATA[先日クリップライトを購入し、ベッドの上で優雅に読書を楽しんでいたところ何かを燃やした臭いが漂ってきたので、こんな時間に何燃やしてんだよと思ったらクリップライトの熱が椅子を燃やしてました、こんばんは、こしあんです。 ライト [...]]]></description>
			<content:encoded><![CDATA[				<p>先日クリップライトを購入し、ベッドの上で優雅に読書を楽しんでいたところ何かを燃やした臭いが漂ってきたので、こんな時間に何燃やしてんだよと思ったらクリップライトの熱が椅子を燃やしてました、こんばんは、こしあんです。</p>
				<p>ライトはLEDが良いらしいですよ。</p>
				<p>さて、職場に詳しい人がいるからと、逃げてきたJavaScriptですが、そろそろ1度腰を据えて勉強しておこうと思います。</p>
				<p>評判の良さそうなオライリーのサイ本。比較的どこの書店にも置いてあるようですが、本棚で擦り切れてボロボロなものしかなかったので、大型書店まで行ってきました。<br />
				オライリーのフェアだったらしく、おまけ込みで袋詰めされてました。</p>
				<p><img src="http://blog.magellanic.net/wp-content/uploads/2008/11/20081120a.jpg" alt="20081120a" title="20081120a" width="217" height="229" /></p>
				<p>見本誌かなーと思ったら、</p>
				<p><img src="http://blog.magellanic.net/wp-content/uploads/2008/11/20081120b.jpg" alt="20081120b" title="20081120b" width="158" height="134" /></p>
				<p>付箋だった。</p>
				<p>おまけはともかく、よい状態の本が買えて満足です。<br />
				新品で本を買って汚れてたら萎えるもんね。その辺りやっぱりAmazonとか強いですよね…。</p>
				<p>分厚いので持ち歩くにはしんどいので家でノンビリ勉強します！</p>
				<p><a href="http://amazon.co.jp/o/ASIN/4873113296/koshian404-22/ref=nosim" ><img src="http://ecx.images-amazon.com/images/I/413amOWGgvL._SL160_.jpg" width="123" height="160" alt="JavaScript 第5版" /></a><br /><a href="http://amazon.co.jp/o/ASIN/4873113296/koshian404-22/ref=nosim" >JavaScript 第5版</a></p>
]]></content:encoded>
			<wfw:commentRss>http://blog.magellanic.net/archives/136/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>擬似プロトコルとラベル＠JavaScript</title>
		<link>http://blog.magellanic.net/archives/131</link>
		<comments>http://blog.magellanic.net/archives/131#comments</comments>
		<pubDate>Tue, 18 Nov 2008 12:05:55 +0000</pubDate>
		<dc:creator>koshian</dc:creator>
				<category><![CDATA[JavaScript]]></category>

		<guid isPermaLink="false">http://blog.magellanic.net/?p=131</guid>
		<description><![CDATA[リンクをクリックされたときにJavaScriptで処理をしたいときは a タグの href属性か onClick属性に書くことが多いです。 &#160;&#60;html&#62; &#160;&#60;head&#62; &#038;n [...]]]></description>
			<content:encoded><![CDATA[				<p>リンクをクリックされたときにJavaScriptで処理をしたいときは a タグの href属性か onClick属性に書くことが多いです。</p>
				<div class="src">
				<ol class="hl-main">
				<li>&nbsp;<span class="hl-brackets">&lt;</span><span class="hl-reserved">html</span><span class="hl-brackets">&gt;</span></li>
				<li>&nbsp;<span class="hl-brackets">&lt;</span><span class="hl-reserved">head</span><span class="hl-brackets">&gt;</span></li>
				<li>&nbsp;<span class="hl-brackets">&lt;</span><span class="hl-reserved">script</span> <span class="hl-var">type</span><span class="hl-code">=</span><span class="hl-quotes">&quot;</span><span class="hl-string">text/javascript</span><span class="hl-quotes">&quot;</span><span class="hl-brackets">&gt;</span></li>
				<li>&nbsp;<span class="hl-comment">&lt;!&#8211;</span></li>
				<li><span class="hl-comment">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;function hoge(str){</span></li>
				<li><span class="hl-comment">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;document.getElementById(&#8216;res&#8217;).innerHTML=str+&#8217;をクリックしました&#8217;;</span></li>
				<li><span class="hl-comment">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}</span></li>
				<li><span class="hl-comment">&nbsp;//</span><span class="hl-comment">&#8211;&gt;</span></li>
				<li>&nbsp;<span class="hl-brackets">&lt;/</span><span class="hl-reserved">script</span><span class="hl-brackets">&gt;</span></li>
				<li>&nbsp;<span class="hl-brackets">&lt;</span><span class="hl-reserved">body</span><span class="hl-brackets">&gt;</span></li>
				<li>&nbsp;<span class="hl-brackets">&lt;</span><span class="hl-reserved">p</span><span class="hl-brackets">&gt;</span><span class="hl-brackets">&lt;</span><span class="hl-reserved">a</span> <span class="hl-var">href</span><span class="hl-code">=</span><span class="hl-quotes">&quot;</span><span class="hl-string">javascript:hoge(&#8216;href属性を使う&#8217;)</span><span class="hl-quotes">&quot;</span> <span class="hl-brackets">&gt;</span><span class="hl-code">href属性を使う</span><span class="hl-brackets">&lt;/</span><span class="hl-reserved">a</span><span class="hl-brackets">&gt;</span><span class="hl-brackets">&lt;/</span><span class="hl-reserved">p</span><span class="hl-brackets">&gt;</span></li>
				<li><span class="hl-code">&nbsp; </span></li>
				<li>&nbsp;<span class="hl-brackets">&lt;</span><span class="hl-reserved">p</span><span class="hl-brackets">&gt;</span><span class="hl-brackets">&lt;</span><span class="hl-reserved">a</span> <span class="hl-var">href</span><span class="hl-code">=</span><span class="hl-quotes">&quot;</span><span class="hl-string">#</span><span class="hl-quotes">&quot;</span> <span class="hl-var">onClick</span><span class="hl-code">=</span><span class="hl-quotes">&quot;</span><span class="hl-string">hoge(&#8216;onClick属性を使う&#8217;)</span><span class="hl-quotes">&quot;</span> <span class="hl-brackets">&gt;</span><span class="hl-code">onClick属性を使う</span><span class="hl-brackets">&lt;/</span><span class="hl-reserved">a</span><span class="hl-brackets">&gt;</span><span class="hl-brackets">&lt;/</span><span class="hl-reserved">p</span><span class="hl-brackets">&gt;</span></li>
				<li><span class="hl-code">&nbsp; </span></li>
				<li>&nbsp;<span class="hl-brackets">&lt;</span><span class="hl-reserved">p</span><span class="hl-brackets">&gt;</span><span class="hl-brackets">&lt;</span><span class="hl-reserved">span</span> <span class="hl-var">id</span><span class="hl-code">=</span><span class="hl-quotes">&quot;</span><span class="hl-string">res</span><span class="hl-quotes">&quot;</span><span class="hl-brackets">&gt;</span><span class="hl-code">リンクをクリックしてね！</span><span class="hl-brackets">&lt;/</span><span class="hl-reserved">span</span><span class="hl-brackets">&gt;</span><span class="hl-brackets">&lt;/</span><span class="hl-reserved">p</span><span class="hl-brackets">&gt;</span></li>
				<li>&nbsp;<span class="hl-brackets">&lt;/</span><span class="hl-reserved">body</span><span class="hl-brackets">&gt;</span></li>
				<li>&nbsp;<span class="hl-brackets">&lt;/</span><span class="hl-reserved">html</span><span class="hl-brackets">&gt;</span></li>
				</ol>
				</div>
				<p>「href=&#8221;#&#8221;」とかどうなのよ、という意見もあるかと思いますが、今回のポイントから外れるのでスルーします。<br />
				で、hrefとonClickで書き方が違います。hrefには&#8221;javascript:&#8221;を先頭につけています。<br />
				これは<strong>擬似プロトコル</strong>と呼ばれるもので、&#8221;http:&#8221;と同じようなプロトコルの指定という意味で同じようなものです。なので、普段URIを指定するようなところにJavaScriptを書きたいときに指定します。指定しなければ動作しませんので、大した問題にはなりません。</p>
				<p>では、onClickはどうでしょうか。以下のJavaScriptは動作するのでしょうか。</p>
				<div class="src">
				<ol class="hl-main">
				<li>&nbsp;<span class="hl-brackets">&lt;</span><span class="hl-reserved">html</span><span class="hl-brackets">&gt;</span></li>
				<li>&nbsp;<span class="hl-brackets">&lt;</span><span class="hl-reserved">head</span><span class="hl-brackets">&gt;</span></li>
				<li>&nbsp;<span class="hl-brackets">&lt;</span><span class="hl-reserved">script</span> <span class="hl-var">type</span><span class="hl-code">=</span><span class="hl-quotes">&quot;</span><span class="hl-string">text/javascript</span><span class="hl-quotes">&quot;</span><span class="hl-brackets">&gt;</span></li>
				<li>&nbsp;<span class="hl-comment">&lt;!&#8211;</span></li>
				<li><span class="hl-comment">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;function hoge(str){</span></li>
				<li><span class="hl-comment">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;document.getElementById(&#8216;res&#8217;).innerHTML=&#8217;うごいたよ！&#8217;</span></li>
				<li><span class="hl-comment">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;}</span></li>
				<li><span class="hl-comment">&nbsp;//</span><span class="hl-comment">&#8211;&gt;</span></li>
				<li>&nbsp;<span class="hl-brackets">&lt;/</span><span class="hl-reserved">script</span><span class="hl-brackets">&gt;</span></li>
				<li>&nbsp;<span class="hl-brackets">&lt;</span><span class="hl-reserved">body</span><span class="hl-brackets">&gt;</span></li>
				<li>&nbsp;<span class="hl-brackets">&lt;</span><span class="hl-reserved">p</span><span class="hl-brackets">&gt;</span><span class="hl-brackets">&lt;</span><span class="hl-reserved">a</span> <span class="hl-var">href</span><span class="hl-code">=</span><span class="hl-quotes">&quot;</span><span class="hl-string">#</span><span class="hl-quotes">&quot;</span> <span class="hl-var">onClick</span><span class="hl-code">=</span><span class="hl-quotes">&quot;</span><span class="hl-string">javascript:hoge(&#8216;onClick属性を使う&#8217;)</span><span class="hl-quotes">&quot;</span> <span class="hl-brackets">&gt;</span><span class="hl-code">これうごく？</span><span class="hl-brackets">&lt;/</span><span class="hl-reserved">a</span><span class="hl-brackets">&gt;</span><span class="hl-brackets">&lt;/</span><span class="hl-reserved">p</span><span class="hl-brackets">&gt;</span></li>
				<li><span class="hl-code">&nbsp; </span></li>
				<li>&nbsp;<span class="hl-brackets">&lt;</span><span class="hl-reserved">p</span><span class="hl-brackets">&gt;</span><span class="hl-brackets">&lt;</span><span class="hl-reserved">span</span> <span class="hl-var">id</span><span class="hl-code">=</span><span class="hl-quotes">&quot;</span><span class="hl-string">res</span><span class="hl-quotes">&quot;</span><span class="hl-brackets">&gt;</span><span class="hl-code">リンクをクリックしてね！</span><span class="hl-brackets">&lt;/</span><span class="hl-reserved">span</span><span class="hl-brackets">&gt;</span><span class="hl-brackets">&lt;/</span><span class="hl-reserved">p</span><span class="hl-brackets">&gt;</span></li>
				<li>&nbsp;<span class="hl-brackets">&lt;/</span><span class="hl-reserved">body</span><span class="hl-brackets">&gt;</span></li>
				<li>&nbsp;<span class="hl-brackets">&lt;/</span><span class="hl-reserved">html</span><span class="hl-brackets">&gt;</span></li>
				</ol>
				</div>
				<p>これも動きます。<br />
				なるほど、ならJavaScriptで動作させたいときは常に&#8221;javascript:&#8221;指定したほうがよさそうだね…<strong>とはならないのです</strong>。</p>
				<blockquote><p>＞javascriptの正しい書き方なのでしょうか？<br />
				とりあえず誤りではないというのが答えかと。<br />
				ただ、予想されているのとはたぶん異なり、<br />
				規則の上では javascript という名前のラベル付けがされたと考えられると思います。<br />
				<cite><a href='http://oshiete1.goo.ne.jp/qa1785291.html?ans_count_asc=20'>onChange=&#8221;javascript:関数名&#8221;について &#8211; 教えて！goo</a></cite></p></blockquote>
				<p>つまり、この場合の&#8221;javascript:&#8221;は擬似プロトコルではなく、ラベルになるとのこと。<br />
				実際に試してみましょう。</p>
				<div class="src">
				<ol class="hl-main">
				<li>&nbsp;<span class="hl-brackets">&lt;</span><span class="hl-reserved">html</span><span class="hl-brackets">&gt;</span></li>
				<li>&nbsp;<span class="hl-brackets">&lt;</span><span class="hl-reserved">head</span><span class="hl-brackets">&gt;</span></li>
				<li>&nbsp;<span class="hl-brackets">&lt;</span><span class="hl-reserved">script</span> <span class="hl-var">type</span><span class="hl-code">=</span><span class="hl-quotes">&quot;</span><span class="hl-string">text/JavaScript</span><span class="hl-quotes">&quot;</span><span class="hl-brackets">&gt;</span></li>
				<li>&nbsp;<span class="hl-brackets">&lt;/</span><span class="hl-reserved">script</span><span class="hl-brackets">&gt;</span></li>
				<li>&nbsp;<span class="hl-brackets">&lt;</span><span class="hl-reserved">body</span><span class="hl-brackets">&gt;</span></li>
				<li>&nbsp;<span class="hl-brackets">&lt;</span><span class="hl-reserved">a</span> <span class="hl-var">href</span><span class="hl-code">=</span><span class="hl-quotes">&quot;</span><span class="hl-string">#</span><span class="hl-quotes">&quot;</span> <span class="hl-var">onClick</span><span class="hl-code">=</span><span class="hl-quotes">&quot;</span><span class="hl-string">javascript:{break javascript;document.getElementById(&#8216;res&#8217;).innerHTML=&#8217;ありえない&#8217;}</span><span class="hl-quotes">&quot;</span> <span class="hl-brackets">&gt;</span><span class="hl-code">リンク</span><span class="hl-brackets">&lt;/</span><span class="hl-reserved">a</span><span class="hl-brackets">&gt;</span></li>
				<li>&nbsp;<span class="hl-brackets">&lt;</span><span class="hl-reserved">br</span> <span class="hl-brackets">/&gt;</span></li>
				<li>&nbsp;<span class="hl-brackets">&lt;</span><span class="hl-reserved">span</span> <span class="hl-var">id</span><span class="hl-code">=</span><span class="hl-quotes">&quot;</span><span class="hl-string">res</span><span class="hl-quotes">&quot;</span><span class="hl-brackets">&gt;</span><span class="hl-code">リンクをクリックしてね！</span><span class="hl-brackets">&lt;/</span><span class="hl-reserved">span</span><span class="hl-brackets">&gt;</span></li>
				<li>&nbsp;<span class="hl-brackets">&lt;/</span><span class="hl-reserved">body</span><span class="hl-brackets">&gt;</span></li>
				<li>&nbsp;<span class="hl-brackets">&lt;/</span><span class="hl-reserved">html</span><span class="hl-brackets">&gt;</span></li>
				</ol>
				</div>
				<p>先頭の&#8221;javascript:&#8221;がラベルとして解釈されるなら、&#8221;break javascript;&#8221;でブロックから抜け、次のinnerHTMLの処理は実行されないはずです。</p>
				<p>■IE6.0<br />
				エラー&#8221;このLabelは定義されていません&#8221;<br />
				ラベルとして解釈されず。</p>
				<p>■FF3.0<br />
				innerHTML実行されない。<br />
				ラベルとして解釈された。</p>
				<p>■Opera9.6<br />
				innerHTML実行されない。<br />
				ラベルとして解釈された。</p>
				<p>こんな感じです。IEは擬似プロトコルとして解釈してんのかな。<br />
				まあ、こんなコード書くのは限りなくダメダメなので深追いはしません。</p>
				<p>結論。<strong>onClickなどに&#8221;javascript:&#8221;を書くやつは限りなくアヤシイ</strong>。</p>
				<p>おわりです。</p>
]]></content:encoded>
			<wfw:commentRss>http://blog.magellanic.net/archives/131/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>

