ウェブテコでやったブックマークレット入門のLT資料
ウェブテコ(WebTeko)第5回でLTをやった。ブックマークレット入門ということで、簡単な作り方の説明と、僕が作ったブックマークレットを紹介した。
そのときの資料を張っておくよ。
ブックマークレット入門
その中に出てくるブックマークレットはこんな感じ。
W3C HTML 4.01仕様書の日本語ページと英語ページを切り替える
LTで紹介したのは日本語から英語だけだったけど、これは両方向OKだよ。
javascript: (function() { var urls = { ja:'http://www.asahi-net.or.jp/~sd5a-ucd/rec-html401j/', en:'http://www.w3.org/TR/1999/REC-html401-19991224/'}; for (var key in urls) { if (location.href.indexOf(urls[key]) === 0) { location.href = location.href.replace(urls[key], urls[key == 'en'?'ja':'en']); break; } } })();
もうちょっと詳しい説明を別のエントリでしたよ。
a要素のリンクを無効化し、ただのテキストにする
リンクが無くなって単なるテキストになるので、コピペするときに便利だよ。
javascript: (function() { /* node に含まれるテキストを連結して返す */ var getText = function(node) { var f = function(n, strs) { if (n.nodeType == 3 /* Node.TEXT_NODE */) { strs.push(n.data); } else if(n.nodeType == 1 /* Node.ELEMENT_NODE */){ /* テキストノードを再帰的に探す */ for (var m = n.firstChild; m !== null; m = m.nextSibling) { f(m, strs); } } }; var strings = []; f(node, strings); return strings.join(''); }; /* * replace オブジェクト * 'a': HTMLAnchorElement * 't': TextNode, 'a' に含まれるテキストをdataとして持つ */ var reps = []; var anchors = document.getElementsByTagName('a'); for(var i = 0; i < anchors.length; i++) { var a = anchors[i]; var text = getText(a); if (text) { reps.push({'a':a, 't':document.createTextNode(text)}); } } /* a要素をTextNodeで置き換える */ for (var j = 0; reps.length; j++) { reps[j]['a'].parentNode.replaceChild( reps[j]['t'], reps[j]['a']); } })();
こっちも、もうちょっと詳しい説明を別のエントリでしたので、見てね。
あと、ブックマークレットを作るときの注意事項なんかはBookmarklet - ブックマークレットを作成する際のポイントページにかいてあるので、参考にするといいよ。