skip to Main Content

basically I have an iframe inside my main.html which shown inside.html file, and what I want is when clicking elements from inside the iframe, it change the outside elements.

I’m very new to javascript, and here’s what I tried. It doesn’t work obviously. The text didn’t change, it still says "click the link". Maybe I’m just missing something? Did I understand how it works wrong?

in the script.js file:

  function changeText(){
    document.getElementById("text").innerHTML = "clicked";
  }

in the inside.html file,

the iframe change into click.html as intended but the text outside didn’t change:

   <a href="clicked.html" onclick="changeText()"><p>this</p></a>
   <script src="script.js"></script>

in the main.html file:

   <p id="text">click the link</p>
   <iframe src="main.html" name="mainframe"></iframe>
   <script src="script.js"></script>

2

Answers


  1. When calling functions the way you want in JavaScript, you use functionName. This basically just executes the function.
    When you use it this way: functionName(), JavaScript tries to get the return value, and overwrite current value, which in this case does nothing.

    For further explanation, functionName() in JavaScript is used this way:

    int x = 0;
    
    x = someFunc(x);
    
    function someFunc(int x){
        return x++;
    }
    

    Here, the X variable will be overwritten with x+1.

    Login or Signup to reply.
  2. when you switch from one html page to another html page, the page refreshes and the executed javascript function is not visible because the changes will be visible only before the page refresh.So, try using the function in the tag with id "text".

    <p id="text" onclick="changeText()">click the link</p>

    like this, so clicking on "click the link" the text will change to "clicked".

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search