"use strict";
document.querySelector("button").addEventListener("click",jsandcssreload);
function jsandcssreload(){
let d = (new Date()).getTime();
[...document.querySelectorAll("link")].forEach((elm)=>{
elm.href = elm.href.replace(/(\.css)\??[0-9]{0,}$/,".css?" + d);
});
[...document.querySelectorAll("script")].forEach((elm)=>{
elm.src = elm.src.replace(/(\.js)\??[0-9]{0,}$/,".js?" + d);
});
}
https://gist.github.com/taoka-toshiaki/a4b8312d69631a7d00e86d3b33839019
wordpressにも記載していきます。このコードはnoteにも記載したコードになります。即時関数を使用した形のプログラミングコードです。
document.getElementById("rectangle").innerHTML = (() => {
let color = ["#17dad1", "#2199ff", "#ff215e", "#21ffeb", "#21ff5b", "#8ba091", "#dab017", "#da17cb", "#ffffff"];
let str = "";
for (key in color) {
str += "<span style='color:" + color[key] + ";' class='color' data-color='" + color[key] + "'>■</span> ";
}
return str;
})();
let object = document.querySelectorAll(".color");
for (const key in object) {
if (Object.hasOwnProperty.call(object, key)) {
const element = object[key];
element.addEventListener("mouseover", function(e) {
document.body.style.backgroundColor = this.getAttribute("data-color");
});
}
}