How To Access Iframe Content By Prototype

Extending Element

Element.addMethods('iframe', {
    document: function(element) {
    element = $(element);
    if (element.contentWindow)
        return element.contentWindow.document;
    else if (element.contentDocument)
        return element.contentDocument;
    else
        return null;
},
$: function(element, frameElement) { 
    element = $(element);
    var frameDocument = element.document();
    if (arguments.length > 2) {
        for (var i = 1, frameElements = [], length = arguments.length; i < length; i++)
            frameElements.push(element.$(arguments[i]));
        return frameElements;
    }
    if (Object.isString(frameElement))
        frameElement = frameDocument.getElementById(frameElement);
    return frameElement || element;
}
});

Examples:

var iframe = $('iframe'); 
  var iframeElement = iframe.$('iframeElement'); 
  Event.observe(iframeElement, 'mouseup', function(){ 
    console.log('yup'); 
});

Note:
$('iframe').$('iframeElement').update('some text');
-> error (no method)
[Element.extend is cannot be called on the iframe element
before it is returned]

Source: Google Groups

Unless otherwise stated, the content of this page is licensed under Creative Commons Attribution-ShareAlike 3.0 License