[JavaScript]ボタンをクリックすると、別のHTMLにある画像を切り替える方法が知りたいです

Question

お世話になっております。
JavaScriptまたはJQueryでボタンをクリックすると、別のHTMLにある画像を切り替える方法が調べても
わからなく、こちらで質問させていただきます。
よろしくお願い致します。

追記：
着せ替え系のアプリ開発をMonacaで行っております。
b.htmlで着替えるimg画像を選択し、a.htmlでもとのimg画像を別のimg画像に切り替わるようにしたいです。

前提・実現したいこと

・a.htmlにあるボタンをクリックすると、b.htmlにあるimgタグの画像が別の画像に切り替わるというのを行いたいです。
※下記コードにあるb.htmlにあるhideModal('end')がクリックされた後

試したこと

jsファイルで普通にimgタグで指定しているidから画像を切り替えようとしてみたのですが、切り替わらずでした。

＜a.html＞

<script src="js/imgtest.js"></script>
：
<img id="aaa" src="./img/test.gif" alt="">

＜b.html＞

<script src="js/imgtest.js"></script>
:
<ons-modal direction="up" animation="fade" id="end" animation-options='{"duration": 0.1, "delay": 0, "timing": "ease-in"}'>
  <div style="text-align: center; padding: 10px;">
    <div class="modal" style="padding-top:0;">
      <p class="font" style="margin-top:0; background-color:#f5bcd3; color:#fff; padding:1em; font-weight:bold;">
	購入完了
      </p>
      <div class="modal-text">
        購入が完了しました
      </div>
      <div class="button">
        <div class="normal-button font" onclick="hideModal('end')">
	OK
        </div>
      </div>
    </div>
   </div>
</ons-modal>

＜imgtest.js＞

var hideModal = function (id) {
  var modal = document.getElementById(id);
  modal.hide();
  var chara1 = document.getElementById("end").onclick = function() {
  :
  document.getElementById("aaa").src = "kimono.gif";
};

Comments

[hoshi-takanori]

Monaca や Onsen UI を使ったモバイルアプリである (Web ではない) というのは重要な情報なので、質問文にはしっかり書いていただけると助かります。
「Onsen UI 画面遷移」や「Onsen UI 値の受け渡し」などで検索してみましたが、独特の作法があるみたいで、私にはさっぱり分かりませんでした。がんばってください。

[proday]

パラメータで受け渡しで考えなおしてます。

Answer 1

aとbが同じドメインにあり、bがaにより開かれたwindowであれば可能だと思います。
bのwindow名を利用してアクセスしてください

Comments

[proday]

> yambejp 様
ご回答ありがとうございます！
それは、Window名.name 等を使用して参照するということでしょうか。

[proday]

申し訳ございません。
意味がわかっていなく。。

[yambejp]

逆にどういった運用なのかをもう少し明確にした方がよいでしょう
いまの見立てだとaとbに相関関係が見当たりません
そうなるとaからbの操作は難しいと思います

[proday]

> yambejp 様
説明不足で申し訳ございません。
着せ替え系のアプリ開発をMonacaで行っております。
b.htmlで着替えるimg画像を選択し、a.htmlでもとのimg画像を別のimg画像に切り替わるようにしたいのです。

[yambejp]

ちなみにaとbの相関関係とは
・aからwindow.openでbを開いている
・aからiframeでbを開いている
などです。
それぞれが独立して開かれているようなものはwindow間の参照はできないと思います
その場合たとえばクッキーで調整したり面倒な処理になるでしょう

[proday]

> yambejp 様
なるほど…。
それであれば、aからiframeでbを開く状態にしてみます。
ご指摘ありがとうございます。

[proday]

aタグでa.htmlからb.htmlを開いた状態はダメなんですよね。

[proday]

大変厚かましいお願いですが、
iframeタグを使用した場合の例題をいただきたいです。

[yambejp]

> aタグでa.htmlからb.htmlを開いた状態

//a.html
<script>
window.addEventListener('DOMContentLoaded',function(){
document.querySelector('a').addEventListener('click',e=>{
var t=e.target;
var win_name=t.target?t.target:"_self";
const test_win=window.open(t.getAttribute('href'),win_name);
document.querySelector('#btn').addEventListener('click',e=>{
if(test_win)test_win.document.querySelector("#hoge").textContent="fuga";
});
});
});
</script>
<a href="b.html" target="hoge">b</a>
<input type="button" value="fuga" id="btn">

//b.html
<div id="hoge">hoge</div>

[hoshi-takanori]

横から失礼します。Monaca はモバイルアプリ開発用なので、Web とはいろいろ違うようですが、具体的にどうやってページ間で情報を受け渡すのかはちょっと調べた限りではよく分かりませんでした。UI フレームワークに何を使うかによるみたいですし…。

[proday]

>yambejp 様
ありがとうございます！
いただいた例題をもとに追加してみたのですが、うまくいかないみたいなので、
他を考えてみます。
申し訳ございません。

[proday]

＞ hoshi-takanori 様
ご回答ありがとうございます！
Onsen UIを使用しております。

[proday]

ご回答およびにご指摘ありがとうございました。
無事解決致しました。
解決に近かったyambe.jp様をベストアンサーにさせていただきます。