How to change web title while in object tag with javascript

Question

how to change title of web page with javascript from <object> tag?

this code from main.html that include <object>

<html>
  <head>
    <title>main title</title>
  </head>
  <body>
    <h1>home</h1>
    <div>
      <object type="text/html" data="home.html"></object>
    </div>
    <script src="script.js"></script>
  </body>
</html>

and in home.html i want change main.html <title> tag with home title by click a button

this code from my home.html

<html>
  <body>
    <button onclick="home();">change main title</button>
    <script src="script.js"></script>
  </body>
</html>

and this my javascript code

function home() {
  window.parent.title = "home title";
}

score 1 · Accepted Answer · answered Apr 20 '21 at 07:21

There are possibly two problems here:

First, title is a property of the document object, it isn't a global. So you need:

window.parent.document.title

Second, if you open the developer tools in your browser and look at the Console. You may see an error message along the lines of:

Uncaught DOMException: Permission denied to access property "title" on cross-origin object

Communicating across frames isn't possible unless you are loading them from the same origin using HTTP (or HTTPS).

Make sure your documents are loaded from a web server and not directly from your disk.

(Although see the postMessage API).

Thanks for your explanation, this is the best answer i'm looking for. It works perfectly when I run it on the web server — Ahmad Akbar Maulana, Apr 20 '21 at 08:19

score 0 · Answer 2 · answered Apr 20 '21 at 07:07

0

Try document.title = "".

Something tells me that your time spent on researching has been very limited, but here you go.

answered Apr 20 '21 at 07:07

Stone3m

89
2

That **won't work**. It changes the title of the document in the frame, not the the one in the parent window. – Quentin Apr 20 '21 at 07:15
@Quentin If I could downvote myself, I would. You are absolutely right! My answer causes a cross origin error. I saw the script.js being included in main.html, so I assumed it was alright. But this causes a `home is undefined` javascript error. Good catch! – Stone3m Apr 20 '21 at 08:34

score 0 · Answer 3 · answered Apr 20 '21 at 07:09

0

You can change web-page title via document.title

function home() {
  document.title = "home title";
}

answered Apr 20 '21 at 07:09

WasiF

26,101
16
120
128

That **won't work**. It changes the title of the document in the frame, not the the one in the parent window. – Quentin Apr 20 '21 at 07:15

score 0 · Answer 4 · answered Apr 20 '21 at 07:19

0

Use window.parent.document.title to access the title of the parent document. See this question.

answered Apr 20 '21 at 07:19

bluevulture

422
4
16

score -1 · Answer 5 · answered Apr 20 '21 at 07:22

-1

Maybe try this. Seems to be working here: link

function home() {
  window.document.title = "home title";
}

answered Apr 20 '21 at 07:22

Yana Trifonova

586
7
28

That **won't work**. It changes the title of the document in the frame, not the the one in the parent window. – Quentin Apr 20 '21 at 07:22

How to change web title while in object tag with javascript

5 Answers5