Get Dom Content of Cross-Domain Iframe

Get DOM content of cross-domain iframe

You can't. XSS protection. Cross site contents can not be read by javascript. No major browser will allow you that. I'm sorry, but this is a design flaw, you should drop the idea.

EDIT

Note that if you have editing access to the website loaded into the iframe, you can use postMessage (also see the browser compatibility)

Get Cross-Domain iFrame content

Short of requesting it via a proxy on your own server, you can't.

The same origin policy prevents it (and for good reason; I would be very unhappy if you loaded my banking site in your iframe and read all my account details)

Get CSS attributes of an element inside iframe with cross domain

If the domain of the iframe is not the same as the domain of the parent page, you will not be able to manipulate its content or get info about it due to the same origin policy

If they're different domains but you have control over its content (that is, you can add code to it), you can use Postmessaging to do what you are trying to do. Simply add a listener within the iframe's content which tells it when to fire off this change.

From looking at the domain however (gamespot) I imagine this is not your page so there isn't much you can do

Can not access iframe elements of cross domain using postmessage

Simply, How can I access child window's element from top window with different domain?

You can't. You can only post messages between the documents.

So if you want to do something with an element on the other page then you need:

Send a message asking for that thing to be done to that element
Write code to listen for that message and do that thing

For example

Parent page

<!DOCTYPE html>
<meta charset="utf=8">
<title>Parent</title>
<script>
    addEventListener(
      "message",
      function(e) {
        if (e.origin !== "http://localhost:8080") {
          return;
        }
        if (e.data.message === "Ready and waiting") {
            console.log("Message recieved from child iframe");
            // Now we know the document has loaded into the frame and is ready to recieve messages. 
            document.querySelector("iframe").contentWindow.postMessage({
                message: "Remove",
                selector: "#b"
            },
            "http://localhost:8080")
        }
      }
    );
</script>
<iframe src="http://localhost:8080/frame.html"></iframe>

Framed page

<!DOCTYPE html>
<meta charset="utf=8">
<title>Child</title>
<div id="a">A</div>
<div id="b">B</div>
<div id="c">C</div>
<script>
    window.parent.postMessage({ message: "Ready and waiting" }, "http://localhost:8081");

    addEventListener(
        "message",
        function(e) {
            if (e.origin !== "http://localhost:8081") {
                return;
            }
            console.log("Message recieved from child iframe", e.data);
            if (e.data.message === "Remove") {
                document.querySelector(e.data.selector).remove();
            }
        }
    );
</script>

Cross domain iframe issue

If you don't have control over the framed site, you cannot circumvent the cross-domain policy.

If you have control over both sites, you can use the postMessage method to transfer data across different domains. A very basic example:

// framed.htm:
window.onmessage = function(event) {
    event.source.postMessage(document.body.innerHTML, event.origin);
};

// Main page:
window.onmessage = function(event) {
    alert(event.data);
};

// Trigger:
// <iframe id="myframe" src="framed.htm"></iframe>
document.getElementById('myframe').contentWindow.postMessage('','*');

Get Dom Content of Cross-Domain Iframe