Q&A
alt=""を追加したい画像は、どのようなものですか？
抜けてしまったalt属性を、一括で入力できるようにしたい
下記のように置換（というか追加？）したいのですが、何かいい方法をご存知の方はいらっしゃいますでしょうか…
<img src="任意のパス"> ↓ <img src="任意のパス" alt="">
※上記の"任意のパス"の部分は変えずにaltを追加したいです。
テキストエディタはVScodeを使用しております。
WordPressのプラグインは使えない状況です。
VScodeの置換で何か上手いやり方があるのか、
JSやPHPで実装するのか色々と調べたのですが、
該当する記事が出てこなかったので質問させていただきました。
全部目視でやるしかないのかとある程度覚悟はしていたのですが、
かなりの数の画像があるので、何か方法があるかもしれないと思いこちらで質問させていただきました。
よろしくお願いいたします。
コメントありがとうございます。
画像は装飾的な使われ方のものなので、altの中身は空で大丈夫です。
すべて alt 属性がない場合は <img を <img alt="" に置換すればいいと思います。
回答2件
0
ベストアンサー
VSCODEでも正規表現の検索は使えます。
正規表現を使って以下でどうでしょうか。
0. 'img src=".."> 文字列を見つける
0. 見つかった文字列をaltありで置き換え
text
1置換前：(img\s+src="[^"]+")> 2置換後：$1 alt="">
例2)
text
1置換前：(img.+src="[^"]+")(?!\s+alt) 2置換後：$1 alt=""
投稿2020/12/15 02:56
編集2020/12/15 07:21
総合スコア815
ご回答ありがとうございます！
いただいたご回答でうまくできました！！
本当に助かりました！
ありがとうございます！
申し訳ありません…もう一度試してみましたらうまく検索がヒットしない場合がございました…
どういう場合でしょうか。
例を挙げていただければ、力になれるかもしれません。
ありがとうございます！
今現状で判明しているものは、例えば下記のようにクラス名がついている場合です。
<img class="任意のクラス名" src="任意のパス">
よろしくお願いいたします。
すごい！ありがとうございます！
例２）で試してみたところうまくできました！
本当に助かります！
ありがとうございました！
0
altを含まない<imgは、以下のような正規表現で検索できます。
<img\s(?:[^a]|a[^l]|al[^t])*?/?>
あとは分割して$1や$2を使った置換を行えばいいでしょう。
投稿2020/12/15 02:44
総合スコア146018
早速のご回答ありがとうございます！
検索はうまくできましたが、分割して$1や$2を使った置換の方法がちょっと知識がないので色々と調べてみます！
もしわからなければ改めて質問させていただきます。
ありがとうございました！
お世話になります。
あれからご回答いただいた「分割して$1や$2を使った置換」について調べてみたのですが、根本を理解していないせいかどのようにすればいいかわかりませんでした…
もし可能であれば、そちらについてもご教授いただけないでしょうか？
丸カッコ () を使ったキャプチャについて調べてください。
VSCodeでは、正規表現の丸カッコで囲んだ部分にマッチした内容を、置換文字列で「$n」(nは1以上の整数)で示すことができます。
つまり、「 alt=""」を挿入する前と後に分かれるように、2つの () を回答の正規表現に付け加えれば、後は置換文字列に$1と$2と「 alt=""」を正しい順番で並べて指定するだけです。
あなたの回答
tips
プレビュー
