How Can I Modify The Contents Of One Web Page From Another?

Let me explain my problem, I have a page 'A' that contains a textarea. I have a button on my page 'A' that calls a script, this script opens a pop up that contains the page 'B'. Ho

Solution 1:

build 2 html pages: test.htm and popup.htm - the test.htm will open the popup.htm, now if you enter something in the popup (textarea) and press the button, the text will be sent to test.htm textarea...:

test.htm

<h1>Page A<h1>
<form name="frm">
    <textarea name="txt"></textarea>
    <button onclick="popup('popup.htm')">Open Popup</button>
</form>


<script type="text/javascript">
    function popup (url) {
        win = window.open(url, "window1", "width=600,height=400,status=yes,scrollbars=yes,resizable=yes");
        win.focus();
    }
</script>

popup.htm :

<h1>Page B</h1>

<form name="frm">
<textarea name="txt"></textarea>
<button onclick="window.opener.frm.txt.value=document.frm.txt.value">Update Site A</button>
</form>

Solution 2:

Here's a good SO answer that's quite relevant (and uses jQuery). Basically, you want to manipulate the DOM of a child window (a window opened by your current window):

How can I access the dom tree of child window?