Chromeで表示しているWEBサイトのHTMLをF12キーを押下することで【DevTools】を呼び出すことができる。
ページ内のテキストをCtrl+Fで検索することはできるが、置換する方法が分からなかったのでその対応方法です。
Contents
環境
・Windows10
・Chrome
対処方法１
HTMLを全コピーし、テキストエディタで編集する方法
DevToolsを起動
１．ChromeでWEBサイトを表示する。
２．[F12]キーを押下する。
HTMLをコピー
１．DevToolsの[Elements]タブを選択する。
２．表示されたHTMLの一番上のHTMLタグを右クリックする。
３．[Edit as HTML]をクリックする。
４．編集状態になったら[Ctrl+A]で全選択。
５．全選択状態になったら[Ctrl+C]でコピーする。
テキストエディタで編集
１．置換機能のあるテキストエディタにコピーしたHTMLを貼り付ける。
２．置換したい文字列を置換する。
３．置換したHTMLをコピーする。
HTMLを上書き
１．DevToolsの[Elements]タブを選択する。
２．表示されたHTMLの一番上のHTMLタグを右クリックする。
３．[Edit as HTML]をクリックする。
４．編集状態になったら[Ctrl+A]で全選択。
５．全選択状態になったら[Ctrl+A]で貼り付け、コピーしているHTMLで上書きする。
６．上書き完了後、[Ctrl+Enter]で編集を完了する。
対処方法２
DevToolsでjavascriptを実行し上書きする方法
DevToolsを起動
１．ChromeでWEBサイトを表示する。
２．[F12]キーを押下する。
文字列置換のjavascriptを実行
１．DevToolsの[Console]タブを選択する。
２．以下のjavascriptコードをコピーし、貼り付ける。
３．貼り付け後、[Enter]キーで実行する。
※2回に分けてコピー、貼り付け、実行する。
document.head.innerHTML = document.head.innerHTML.replace(/置換したい文字列/g, "置換後の文字列")
document.body.innerHTML = document.body.innerHTML.replace(/置換したい文字列/g, "置換後の文字列")
対処方法３
Chromeの拡張機能を入れる方法
Search and Replaceをインスト―ル
Search and Replace
Search for text in input fields and replace it with different text.
https://chrome.google.com/webstore/detail/search-and-replace/bldchfkhmnkoimaciljpilanilmbnofo
HTMLの文字列を置換
１．「Search for」に置換前の文字列を入力する。
２．「Replace with」に置換先の文字列を入力する。
３．1個ずつ置換の場合、[Replace Next]ボタンを押下する。
４．全置換の場合、[Replace All]ボタンを押下する。
※置換に少し時間がかかるため、連打はしないこと
