Changing `src` attr of script tag does not do anything

Coding Help
1

Hello everyone, I am trying to click a button to change the src attribute of a script tag on my website.


//paperTarget was previously defined 
 theme.addEventListener("click", () => {
    console.log("click");
    paperTarget.src = "js/darkbackground.js"
  });

When I tested this, the src tag does change, but nothing happens to my site.
I then tried this:

 theme.addEventListener("click", () => {
    console.log("click");
    paperTarget.remove();
    newScript.src = "js/darkbackground.js";
    document.body.appendChild(newScript);
  });

Again, the code changed but nothing changed on the client side.

What am I doing wrong?

Here is my repo: https://glitch.com/edit/#!/folded-paperjs-test

2

It sounds like both of your code samples “work” in that they incorporate the darkbackground.js file into your site.

I guess you were hoping that the new implementation of tool.onMouseMove would be used once darkbackground.js is on the page. I can only suggest that you might need to put that event-handler-attachment in a function and call it after you replace the script, something like:

function setTool(){
tool.onMouseMove = function(event) {
  var rad = Math.random() * 40; //new rand number every event fired
  var color = {
      hue: Math.random() * 360,
      saturation: 1,
      brightness: 1,
  }
  createStar([event.point.x, event.point.y], rad, color);
};
}

and

 theme.addEventListener("click", () => {
    console.log("click");
    paperTarget.src = "js/darkbackground.js";
    setTool();
});

My best guess :slight_smile:

3 Likes