When I apply the following JS code snippets, my output is incorrect or does not display at all. Below are the codes in question:
if (location.href != "website.com/page1" || "website.com/page2")
{
element.style.backgroundColor='none';
}
Alternatively with != and !==
if (location.href != "website.com/page1" || location.href != "website.com/page2")
{
element.style.backgroundColor='none';
}
This is how I am integrating it with other code (simplified)
<script>
var element = document.getElementbyId('idElement');
if (location.href != "website.com/page1")
{
element.style.backgroundColor='blue';
}
if (location.href != "website.com/page2")
{
element.style.backgroundColor='green';
}
//THIS IS WHERE I INSERT THE CODE
if (location.href != "website.com/page1" || "website.com/page2")
{
element.style.backgroundColor='none';
}
</script>
Nothing changes or the element malfunctions on different pages. What could be the issue?
Additional Information: I am designing a Tumblr theme where certain posts will have different characteristics when viewed on various pages. The code needs to be placed at the top.
A Suggested Solution That Worked:
<script>
window.onload = function ()
var element = document.getElementbyId('idElement');
if (location.href != "website.com/page1" && location.href != "website.com/page2")
{
element.style.backgroundColor='none';
}
if (location.href == "website.com/page1")
{
element.style.backgroundColor='blue';
}
if (location.href == "website.com/page2")
{
element.style.backgroundColor='green';
}
</script>