Setting a value of an iframe in the parent This code works on Chrome 58 but it makes me feel dirty:

parent.parent.parent.document.F1.document.getElementById("txtNewDrugAction").value = "foobar"


F1 is the name of the iFrame where the text box resides.

I am setting the value of an input box from a modal popup window (via jQuery UI).  I've tried to use selectors etc, but to no avail.  I feel like there would be a hugely easier way to do this that would also be more resilient to changes in the DOM but I can't see it just yet...

I also wind up writing code like this (again, functional, but awful):

window.top.document.getElementById("F1").contentWindow.document.getElementById("txtRefresh") = "foobar"


I'm maintaining a legacy application. Please nobody think that something that uses frames is being created in 2017, especially not by me.
The simplest would be to use window.top if F1 is part of the top-most window, or possibly go top down window.top.someframe.someotherframe.F1.

An alternative might be to write a helper something like:

function getFrame(name) {
  var current = this;
  while (current) {
    if (current.document[name])
      return current.document[name].document;
    current = current.parent;
  }
  return undefined; // not found
}