How can I check if text content on page changed?-CodePudding

I want to check if the text content in the var cart changes its on this page: https://www.supremenewyork.com/shop/all

let cart = document.getElementById('items-count').textContent;

console.log(cart);
cart.addEventListener('change', function() {
 console.log("cart");
 window.location.replace("http://stackoverflow.com");
});

I get this error

Uncaught TypeError: cart.addEventListener is not a function at chrome-extension://ljhadajgdcijdfoopfbkjibfebkilieh/supreme.js:11:6

The script starts when I enter the page.

I already tried to Monitor it with a while loop like in the following code but then the website freezes and I cant use it anymore until the var change

let carted = 0
let cart = document.getElementById('items-count').textContent;
while (carted < 1 ) {
console.log(cart);
if (cart.length > 2) {
    cart   ;
    window.location.replace("http://stackoverflow.com");
    }
}

CodePudding user response：

All you need is to remove .textContent because you add the event on the element itself

let cart = document.getElementById('items-count');

console.log(cart);
cart.addEventListener('change', function() {
 console.log("cart");
 window.location.replace("http://stackoverflow.com");
});

CodePudding user response：

If you want to add a listener, you can't do it to textContent.

let cart = document.getElementById('items-count'); //.textContent

console.log(cart);
cart.addEventListener('change', function() {
 console.log("cart");
 window.location.replace("http://stackoverflow.com");
});

If you need that value, you can store it on another variable:

var content = cart.textContent

CodePudding user response：

You could

var item = document.getElementById('items-count');
item.addEventListener("change", DoStuff);
function DoStuff(){
//do what do you want to do.
}