I have dynamically displayed content in DIVS, and I want to block certain DIVS from appearing. The code looks like this:
<div class = "DivStyle" id="computer">
<img src = "computer,jpg">
</div>
<div class = "DivStyle" id="harddisk">
<img src = "harddisk.jpg">
</div>
<div class = "DivStyle" id="cable">
<img src = "cable.jpg">
</div>
etc.
How can I block the div tabled "harddisk" above from appearing using Javascript? Essentially I want to say "If ID = harddisk then display=none".
Thanks in advance!
Using plain javascript, this will hide your div:
document.getElementById('harddisk').style.display = "none";
A full example of where to locate the javascript:
<html>
<head></head>
<body>
<div class = "DivStyle" id="computer">
<img src = "computer,jpg">
</div>
<div class = "DivStyle" id="harddisk">
<img src = "harddisk.jpg">
</div>
<div class = "DivStyle" id="cable">
<img src = "cable.jpg">
</div>
<script>
document.getElementById('harddisk').style.display = "none";
</script>
</body>
The script must be executed after the DOM is loaded, move the code inside this block, like this
(function() {
document.getElementById('harddisk').style.display = "none";
})();
if you are using an updatepabel use this one :
var pageRequestManager = Sys.WebForms.PageRequestManager.getInstance();
pageRequestManager.add_endRequest(function () {
document.getElementById('harddisk').style.display = "none";
});
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.