for div where background-image url is equal to url or where img src url is equal to url, change to different url in javascript. configure via variables in javascript

You can achieve this by using the querySelectorAll method to select all the div elements with a background-image property or img elements with a src property that matches the specified URL. Then, you can loop through the selection and update the URL with the new value.

Here's an example code snippet that demonstrates this approach:

index.tsx
// Define the old and new URLs as variables
const oldUrl = 'oldImageUrl';
const newUrl = 'newImageUrl';

// Select all div and img elements with respective url
const divsToUpdate = document.querySelectorAll(`div[style*="background-image"][style*="${oldUrl}"]`);
const imgsToUpdate = document.querySelectorAll(`img[src*="${oldUrl}"]`);

// Loop through divs and update the background image
divsToUpdate.forEach(div => {
  div.style.backgroundImage = div.style.backgroundImage.replace(oldUrl, newUrl);
});

// Loop through images and update the image source
imgsToUpdate.forEach(img => {
  img.src = img.src.replace(oldUrl, newUrl);
});
635 chars
18 lines

In this code, we first define the old and new URLs using variables. We then select all of the div and img elements that have the old URL in either the background-image or src property using the querySelectorAll method.

We loop through each selection using the forEach method and update the background-image or src property using the replace method to replace the old URL with the new URL.

Note that the querySelectorAll method returns a NodeList, so we can use the forEach method to loop through each element.