「ユーザースクリプト」タグアーカイブ

document.getElementsByText()

ユーザースクリプト用に書いた

"use strict";

(function () {
	function walkDOM(node, callback) {
		if (node === null) return;
		callback(node);

		walkDOM(node.firstChild, callback);
		walkDOM(node.nextSibling, callback);
	}

	function getElementsByText(text) {
		var set = new Set();
		walkDOM(this, function (node) {
			if (node.nodeType !== 3) return;
			if (node.nodeValue.indexOf(text) === -1) return;
			set.add(node.parentNode);
		});
		var ret = [];
		set.forEach(function (value) {
			ret.push(value);
		});
		return ret.length === 0 ? null : ret;
	}

	document.getElementsByText = getElementsByText;
	Element.prototype.getElementsByText = getElementsByText;
})();

使い方はこのスクリプトを読み込んで、document.getElementsByText(text)を実行するかElement.getElementsByText(text)を実行する。

引数のtextが含まれている親のエレメント達が配列で返ってくる。何もなければnullを返す。

GitHubに例を載せている。

再帰を使っているためスタックオーバーフローする可能性がある。

document.evaluateでXPathを使ったほうが早い。

あくまでもユーザースクリプト用に書いてみた。

基礎を押さえていないと深みにハマる

先日、クッキークリッカーというゲームをやっていたら、昔やっていたとあるCGIゲームを思い出し、プログラムで自動化できないものかユーザースクリプトを組んでみた。

CookieClicker

一定時間後にフォームに情報を入力してsubmitしていくだけの単純なゲームだが、javascriptを勉強していないので「DOMって何?」状態から手探りで長時間かけて組んだ。

まずハマったのがsetTimeoutの使い方。文法は、setTimeout(関数名,時間)で関数名にはクォーテーションで囲むんだそう。ブラウザのコンソールでプログラムを動かしてみると問題なく動くのだが、ユーザースクリプトを読み込ませて組んでみるとエラーが・・・クォーテーションをつけないで読み込ませてみるとなぜかあっさり動いた。なぜ?いまだにわからない。とりあえず動いたので結果オーライで次に進んだ

そして、次にハマったのが、空欄のテキストボックスに文字を入力して送信する方法。ただvalueに情報を入れればいいのだとgetElementsByTagNameでテキストボックスを取得しvalueに情報を代入した。しかし、valueに情報は入るもテキストボックスに値が表示されていない。とりあえずマウスの動作を真似しようとマウスを動かして考えてみた。気づいたのは、まずテキストボックスを選択しているということ。そこで、selectでテキストボックスを選択状態にしてからvalueに値を代入すると見事に表示された。仕組みはよくわからないが、value値が空欄の時はまず選択してからでないとダメなよう・・・ちなみに、あらかじめvalueに値があれば選択状態にしなくても代入できた。

基礎を抑えていないと簡単なことに何時間もハマってしまうんだなぁと痛感。しかも、ユーザースクリプトについての情報はググっても中々辿りづらい。当然だが、サイト制作者側の観点に立った情報がほとんどだ。だからなおさら基礎を抑えていないとどんどん深みにハマってく。

例えるとRPGで正規ルートから外れて強敵ばっかりいるところに行ってしまった感じ。しかも簡単に戻れない・・・ダークソウルだといきなり巨人墓場に行ってしまった感じ・・・

しかし今回の経験である程度DOMについての概観がわかった。formの操作も若干ではあるができるようになって、「javascript面白い!」と思えるようになった。今はPHPとMySQLの勉強をしているので、一段落ついてからjavascriptを勉強する予定。基礎を抑えないとハマるけど、少し弄ってから基礎を勉強した方が理解も早いかもしれない。

とりあえず今回初めてスクリプトを書いてみたけど、そのきっかけとなったクッキークリッカーに感謝したい。

ありがとうグランドマ!!