Call for a 'function' within a specific variable?

Ayin Kim 2021. 9. 23. 23:33

The core of this post is; how to call the function within the variable that has been already declared at the top.

Note: JS interacts to HTML. It reads the HTML document, then gives some change to it.

<!DOCTYPE html>
<html>
  <head>
    <title>How to call function within the variable?</title>
    <meta charset="UTF-8" />
  </head>

  <body>
    <div class="world">
      <h2>Hello, World!</h2>
    </div>
    <script src="src/index.js"></script>
  </body>
</html>

const greetingWord = document.querySelector(".world:first-child h2");

const wrapperTrigger = {

// function functionName() {
   greetingWord.innerText = "example one to display"
}

   functionName: function() {
      greetingWord.innerText = "example one to display"
   },

   functionNameTwo: function() {
      greetingWord.innerText = "nothing different"
   }

};

// greetingWord.addEventListener("fullscreenchange", functionName);
greetingWord.addEventListener("fullscreenchange", wrapperTrigger.functionName);
greetingWord.addEventListener("blur", wrapperTrigger.functionNameTwo);

Reference: MDN