🟥Javascriptを教えて下さい

質問

TamperMonkeyで特定のWebページを改造して注意書きなどをしようと考えています。

❶指定した特定文字列の文字色･背景色を変更するjavascriptを教えてください。

❷指定した位置などに、特定の文字列を入力するjavascriptを教えてください。
（ミスしないように注意書きするメモ書きのような形）

❸もしWebページ自体を開いた瞬間にメモ書きが表示されるような拡張機能があれば教えてください

回答No.2

AsarKingChang · ベストアンサー

>CSSで画面上の特定の文字にマーキングするといったようなことは不可能でしょうか？

特定の文字というものをCSSは理解できないので、出来ません。
逆にCSSがあるエリアであればそれを上書きすればOKです。

>画面上の｢OKwave｣という文字だけを認識して背景色をつけたり、文字色を変更するということです。
同じ理由でCSSには、文字を認識することが出来ないので、
これはできません。

>1つ1つブロックごとに指定する以外は無理なのでしょうか？
元々のソースにCSSが当たってる部分であればCSSで上書きができます。

>また、そのブロックであれば、その中の指定した文字だけの色を変更したりすることは可能でしょうか。
可能です。

簡単なテストであれば、F12を押してデベロッパーモードにすれば、
全ソース、全要素がでますので、
書き換えたいエリアに飛んで、そこにCSSのオーバーライドを
書いてみればOKです。
もしそこに、text-align:right;になってるなら、centerにするなどの
再修飾が可能です。
これらの書き換えでやりたいことが決まったら、そのツールなどで
いじってみるのもよいでしょう！。
あくまで、送り元は元のサイトなので、元のサイトが
仕様を変えれば、毎回やり直しなので、およそ
暇な人しか、やらないジャンルの遊びですが。
質問的にはそれをしたい？と見えるので、やり方について
書いてみました。

補足

あくまで、よく使う･変更もほとんどない特定サイトのみでの部分的な使用用途ですね。
（テイクアウト画面や、よく確認したいサイトなどにハイライトしておくなど）

ブロックごとに指定はできますが、ブロックの名前が重複してしまう場合は難しいそうですね。
まとめて色が変わってしまわない部分があれば、そちらの背景色などを変更してなんとかしようと思います。

そのブロック中の特定文字列に設定したり、文字列を画面に表示させることは難しそうですね。。

ありがとうございました

回答No.1

AsarKingChang

JavaScriptが色変えているというより、
JavaScriptで書き換えてるというニュアンスの方がいいかもです。
例えばCSSで、
#abcd {
color:red;
}
というIDがあったとしたら、
あいうえお<span id=abcd>かきくけこ</span>さしすせそ
は、「かきくけこ」は、赤ですよね？
なので、
jqueryのJavaScriptだとして、
$('#abcd').css('color','blue');
なら、これを実行した後は、青になるという具合で、
JavaScriptが書き換えてるわけじゃないのですよ。

❷指定した位置などに、特定の文字列を入力するjavascriptを教えてください。
こちらも同じで、JavaScriptには、命令を実行する能力しかなく、
先ほどと同じく色を変えたり、位置を変えたりする命令はなく、
あくまでCSSを書き換えて対応します。
#abcd {
position: fixed;
top : 0px;
left : 0px;
width:320px;
height:240px;
}
と宣言しておいて、
<div id=abcd>あいうえお</div>
これは、このままなら必ず、左上に320x240のサイズで表示されるので、
同じように
$('#abcd').css('left',Xの座標);
$('#abcd').css('top',Yの座標);
と要素そのものを書き換えて位置を作り出してます。

❸もしWebページ自体を開いた瞬間にメモ書きが表示されるような拡張機能があれば教えてください
こちらも、そのようにサイトを作ってある必要があるので、
主にonloadにフックすることで作る方は多いと思いますよ。

大事な部分のみを抜粋しての回答になります。

補足

ありがとうございます

用途としてはStylebotなどでページを改ざんしたいのですが、
CSSで画面上の特定の文字にマーキングするといったようなことは不可能でしょうか？

画面上の｢OKwave｣という文字だけを認識して背景色をつけたり、文字色を変更するということです。
1つ1つブロックごとに指定する以外は無理なのでしょうか？

また、そのブロックであれば、その中の指定した文字だけの色を変更したりすることは可能でしょうか。