How to access frame (not iframe) contents from jQuery

Question

I have 2 frames in one page like this (home.html)

Answer 1

For a pure jquery solution (that doesn't require top.frames etc), the following seems to work:

$('some selector for item from frame' ,$('frame selector')[0].contentDocument)

This has the advantage that it works for nested frames:

$('inner frame item selector', $('inner frame selector', $('outer frame selector')[0].contentDocument)[0].contentDocument)

Answer 2

You could grab the Frame and div you are wanting to manipulate and pass it into a variable.

var statusText = top.frames["treeStatus"].document.getElementById('statusText');

Then you can do anything you want to it through jQuery.

$(statusText).whatever();

Though sometimes you just can't get around having to use frames, keep in mind that the <frame> tag is obsoleted in HTML5. If you ever plan on moving up to HTML5, you'll have to use iFrames.

Answer 3

You need to supply a reference to the frame you what to access:

$("some selector", top.frames["treeStatus"]))

Answer 4

I have nested frames. In my case, to make it work i used command:

var statusText = 
top.document.getElementById("treeStatus").contentDocument.getElementById("statusText");

Then, as Charles already answered, you can do anything you want to it through jQuery:

$(statusText).whatever();

Answer 5

https://jamesmccaffrey.wordpress.com/2009/07/30/cross-frame-access-with-jquery/

    $(document).ready(function(){
     $("#Button1").click(function(){
      $(parent.rightFrame.document).contents().find(‘#TextBox1’).val(‘Hello from left frame!’);
     });
    });

But I used :

    $.post("content_right.php",{id:id},function(data)
     $(parent.frames["content_right"].document.body).html(data) ;
    });