Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Wordpress swapping && for Html encoded in JS <script> tag

I want to implement a simple script onto the page using the HTML block with a JS function wrapped in a script tag.

But when it gets rendered, it takes the && operator and converts it to HTML character code for ampersands(&#038;&#038). I have tried minifying it, changing the conditional statement, but I cannot get it to run. I know the code is fine, because I tested it in the console and it works fine. I think there is just some sort of issue when Wordpress handles it.

At the moment, I cannot implement this using the functions.php file. Needs to be implemented onto the page.

Below is the code I am implementing

<script>
const mainNavLinks = document.querySelectorAll(".wp-block-senff-sticky-block ol li a");
      window.addEventListener("scroll", event => {
        let fromTop = window.scrollY - 600;
        mainNavLinks.forEach(link => {
          let section = document.querySelector(link.hash);
          if ( section !== null && section.offsetTop <= fromTop && section.offsetTop + section.offsetHeight > fromTop ) {
            link.classList.add("current");
          } else {
            link.classList.remove("current");
          }
        });
      });
</script>

Here is the output:

<script>
const mainNavLinks = document.querySelectorAll(".wp-block-senff-sticky-block ol li a");
      window.addEventListener("scroll", event => {
        let fromTop = window.scrollY - 600;
        mainNavLinks.forEach(link => {
          let section = document.querySelector(link.hash);
          if ( section !== null&&section.offsetTop <= fromTop&#038;&#038;section.offsetTop + section.offsetHeight > fromTop ) {
            link.classList.add("current");
          } else {
            link.classList.remove("current");
          }
        });
      });</script>
like image 221
novak1nt Avatar asked Jul 21 '26 16:07

novak1nt


1 Answers

In case anyone ever runs into this again, like I did today, I found a very quick & easy fix for it here:

You must add HTML comment tags after the script tag:

<script type="text/javascript">
<!--
myfunction();
//--></script>
like image 166
Marc Avatar answered Jul 23 '26 05:07

Marc