Network Security Internet Technology Development Database Servers Mobile Phone Android Software Apple Software Computer Software News IT Information

In addition to Weibo, there is also WeChat

Please pay attention

WeChat public account

Shulou

How to implement javascript to hide div by clicking the button

2025-02-24 Update From: SLTechnology News&Howtos shulou NAV: SLTechnology News&Howtos > Development >

Share

Shulou(Shulou.com)06/03 Report--

This article focuses on "how to achieve javascript by clicking the button to hide div", interested friends may wish to take a look. The method introduced in this paper is simple, fast and practical. Next let the editor to take you to learn "how to achieve javascript click button to hide div" bar!

Methods: 1, use the "button object .onclick = function () {}" statement to bind the button to the click event handler function; 2, in the handler function, add the "div object .style.display =" none "statement; 3, click the button to trigger the handler function, which executes the statement to hide div.

The operating environment of this tutorial: windows7 system, javascript1.8.5 version, Dell G3 computer.

Javascript implements the click of a button to hide div

Get the click event according to the id button and add the event handler

Function my (id) {return document.getElementById (id);} my ("btn"). Onclick=function () {my ("dv") .style.display = "none";}

A little more complicated, if the div is displayed, click the button to hide; if the div is hidden, click the button to show.

Function my (id) {return document.getElementById (id);} my ("btn"). Onclick=function () {if (this.value= = "Hidden") {my ("dv") .style.display = "none"; this.value= "Show" } else if (this.value= = "show") {my ("dv") .style.display = "block"; this.value= "hide";}} at this point, I believe you have a deeper understanding of "how to achieve javascript by clicking the button to hide div". You might as well do it in practice! Here is the website, more related content can enter the relevant channels to inquire, follow us, continue to learn!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.

Views: 0

*The comments in the above article only represent the author's personal views and do not represent the views and positions of this website. If you have more insights, please feel free to contribute and share.

Share To

Development

Wechat

© 2024 shulou.com SLNews company. All rights reserved.

12
Report