Q&A
一度Chrome拡張の作り方を調べられてはいかがでしょう。現状の質問は「要望に近い機能はできますでしょうか？」なので「できるでしょう」としか回答できないと思います。
Chromeブラウザで特定Webサイトを開いたときにテキスト追加・編集をしたい
タイトルと同じなのですが、実現可能かどうかも含めて判断頂けると助かります。
(progateでHTML,CSS,Javascriptを少し触れていた程度です...)
経緯なのですが
特定のWebサービスで、私がアップロードした画像・動画やその他ファイルなどを探し選択してから、
内容に応じた発注をかけるような作業をしております。
サービス元の仕様で、ファイルアップロード後のファイル選択はプレビューで見て選択する方法しかないため
類似のプレビューがあると誤選択や判別に時間がかかったりで、現状よろしくありません。
そこで、下図のように画像プレビュー下部などに何のデータなのかを識別したいため
ページが表示された段階でテキストを追加出来れば...というのが今回の希望です。(詳細は後述します)
試してみたこと
Chromeのデベロッパーツールから現在開いているページのソース書き換えが出来ることを最近知りまして、
HTMLソースだけではありますが、今回の相談内容を反映してみたところ上記画像のように反映されておりました。
(ページ更新でもちろん消えてしまいますが...)
デベロッパーツール上では以下の様に追加してました。
▼元ソース
<p><img src="https://～～～.jpg></p> <p><Video data-id=A1234 src="https://～～～.mp4></video></p>
▼イメージソース
<p><img src="https://～～～.jpg><span>abcde.jpg</span></p> <p><Video data-id=A1234 src="https://～～～.mp4></video><span>test.mp4</span></p>
この時にソースの中に、サービス元で管理しているIDとファイル名を見つけたので、
テキストを追加する際に、上記のIDかファイル名で表示するか、こちらで管理しているコードに置き換えて表示したいと考えています。
この操作を毎回するわけにもいかないので何とかChromeの拡張機能などにして
特定サイトを開いたら、例としてVideoタグの中にある「data-id」か「src属性」に
特定の文字列があれば、</video>の後ろにテキストが追加されるように仕込みたいところです。
そのほか
Chromeの拡張機能はHTML,CSS,Javascriptで作れると聞いていたのですが、
要望に近い機能はできますでしょうか？
類似のソフトやChromeの拡張機能などもしあれば、ご教授頂けますと助かります。
不足情報などがあれば追加いたします。
よろしくお願いします。
質問しながら要望に近いページがないかだけ探してたのでなかなか見つからずでした、
Chromeの拡張機能の方でも、「Content Scriptの処理を何とかすればいいんだな」っていうイメージしかついてないので詳しく調べてみます！
ありがとうございます！
回答3件
ベストアンサー
0
https://kurochan-note.hatenablog.jp/entry/20110227/1298790614
ブックマークレットで行けそうな気がします。
投稿2019/08/28 11:22
総合スコア2826
自分の環境が合ってないのか機能はしているみたいなのですが
画像表示されていたところがエラー表示されてしまうようで、
今回の目的からちょっと扱いが難しそうです。。
文字列検索で別途使ってみます！
ありがとうございます。
あなたの回答
tips
プレビュー
