2006-12-01
[JavaScript] とてもシンプルに自分自身が属する script 要素を取得
グローバル領域に以下の一行を書く
<script>
var currentScript = (function (e) { if(e.nodeName.toLowerCase() == 'script') return e; return arguments.callee(e.lastChild) })(document);
alert(currentScript);
</script>
こうすることで、currentScript はこの script 要素を指す。
いちおう説明
DOM は構築されるときに、上から順番に構築される。そして、script タグがあると、 script 要素を構築したあとに、スクリプトを実行する。
つまり、スクリプトが実行されたとき script 要素は今まさに作られたばかりであり、それよりも後ろの要素が存在しない。さらにこの script 要素を含むすべての要素が 今まさに構築中の状態で document から lastChild をたどって行けば必ずたどり着くのである。
たとえば、以下のような HTML があったとすると
<html>
<script>
// このスクリプトが実行される時点ではこの script 要素は
// document.lastChild.lastChild である。
</script>
<head>
<script>
// このスクリプトが実行される時点ではこの script 要素は
// document.lastChild.lastChild.lastChild である。
</script>
</head>
<body>
<script>
// このスクリプトが実行される時点ではこの script 要素は
// document.lastChild.lastChild.lastChild である。
</script>
</body>
<script>
// このスクリプトが実行される時点ではこの script 要素は
// document.lastChild.lastChild である。
</script>
</html>
ということである。
これを利用すると
script タグを張りつけた位置の回りを操作するということが簡単に出来そうである。
例えば:前のタグを消す
// hidden.js
var currentScript = (function (e) { if(e.nodeName.toLowerCase() == 'script') return e; return arguments.callee(e.lastChild) })(document);
var prevTag = (function(e){ if(e.nodeType == 1) return e; return arguments.callee(e) })(currentScript.previousSibling);
prevTag.style.display = 'none';
<div>秘密だよー><</div><script src="hidden.js"></script>
とかとか
追記: prototype.js 1.5 系ならたぶんこうかな。(未確認)
Element.recursivelyCollect(document, 'lastChild').last();
はてな質問へトラバ
トラックバック - http://d.hatena.ne.jp/amachang/20061201/1164986067
- document.writeをDOM仕様にする
- JSで自分自身が属するscript要素を取得
- レビューポスターが1ページに複数個はりつけられるようになりました
- 「とてもシンプルに自分自身が属する script 要素を取得」の注意点
- Javascript で書き換えられた後の Webページの内容を表示する
- http://d.hatena.ne.jp/shogo4405/20070206
- 画像を非同期で読み込む工夫
- http://d.hatena.ne.jp/ku0522/20070906
- ブログパーツを作る際の5つのキホン
- XPath/DOM : javascriptファイルの呼び出し元script要素を取得する
- m2 - オレオレ言語 neko mimi Fu**♥
- javascript - DOM時代のdocument.write()
- javascript - 決定版 - DOM時代のdocument.write()
- こせきの技術日記 - JavaScriptでヒアドキュメントを使うライブラ...
リンク元
- 156 http://reader.livedoor.com/reader/
- 110 http://b.hatena.ne.jp/hotentry
- 50 http://www.google.co.jp/ig?hl=ja
- 24 http://b.hatena.ne.jp/entrylist?sort=hot
- 24 http://clip.livedoor.com/page/http://d.hatena.ne.jp/amachang/20061201/1164986067
- 23 http://d.hatena.ne.jp/
- 23 http://www.google.com/reader/view/
- 22 http://www.google.co.jp/search?sourceid=navclient-ff&ie=UTF-8&rls=DVFA,DVFA:1970--2,DVFA:ja&q=FireFox+JavaScript
- 19 http://b.hatena.ne.jp/
- 15 http://b.hatena.ne.jp/hotentry?