let myObject = { /* insert your object content here */ }
// Check if the 'visible' property in the object is set to 'true' or not
// and adjust the visibility of an element accordingly
if (myObject.visible == 'true') {
someElement.style.opacity = '1'
} else {
someElement.style.opacity= '0'
}
In the code snippet above, someElement
represents an HTML element tied to your object properties.
Take a look at the Fiddle below for a demonstration of modifying and toggling visibility based on an object property value.
let myObject = { a: '1', b: '3', c: '5', d: '7', visible: 'true' }
let someElement = document.getElementById('specificDiv');
let button = document.querySelector('button');
someElement.textContent = myObject.a + myObject.b + myObject.c + myObject.d;
function confirmVisibility(){
if (myObject.visible == 'true') {
someElement.style.opacity = '1'
} else {
someElement.style.opacity= '0'
}
}
function adjustVisibility(){
if (myObject.visible == 'true') {
myObject.visible = 'false'
} else {
myObject.visible = 'true'
}
confirmVisibility()
}
button.addEventListener('click', adjustVisibility);
#specificDiv {padding: 5px; background-color: green;}
<button>
Click Me
</button>
<div id="specificDiv"></div>
Explore jsFiddle: https://jsfiddle.net/yjpv1s13/