id、クラス指定のないソースの書き換え方(HTML/CSS/Javascript)

初歩的なことかもしれませんが、
教えていただけると助かります。

現在、Javascriptを用いてページ内の内容を書き換える方法を調べています。
検索していると、getElementByIdなどを用いて、IDやクラスを指定し、
対象を書き換える記事を拝見しましたが、
現在私が書き換えたいページの内容にはクラスやIDの指定がない内容になっています。

<例>

HTML
1<a href="https://www.google.com/"><b>Google</b></a>
2<br><a href="https://www.yahoo.co.jp/"><b>Yahoo</b></a>
3<br><a href="https://www.amazon.co.jp//"><b>Amazon</b></a>

このようなソースがあるとして、
真ん中のYahooの表示だけ(URLはそのまま)を"Apple"に変えようと思った場合
どうすれば指定と書き換えができるでしょうか。

あるいは、テキストのYahooに準拠し、表示はそのままとして
リンクのURLを"https://www.apple.com/jp/"に変えるとすれば
どうすれば指定と書き換えができるでしょうか。

ここまでのご拝読ありがとうございます。
何卒、ご教授宜しくお願いいたします。

行動規範の内容に同意します

回答2件

ベストアンサー

javascript
1window.addEventListener('DOMContentLoaded', ()=>{
2  document.querySelector('[href="https://www.yahoo.co.jp/"] b').textContent="apple";
3});

投稿2021/05/04 01:44

yambejp

総合スコア116724

どういう条件で置換するのかによります。
getElementsByTagName('a')でa要素のHTMLコレクションを取り出して、ループで1個ずつa要素のhrefかtextContentを調べて、置換したいものを見つけたらtextContentまたはinnerHTMLを置換する、というのはどうでしょう。

投稿2021/05/03 11:05