创建脚本时，您经常会发现有一些用户“事件”，例如用户将鼠标移到某个元素上或单击要让脚本作出反应的特定元素。你这样做的方式是通过使用事件处理程序。
在本教程中，我们将学习如何让脚本对使用布尔值的单个元素上的两个不同的函数进行反应。
布尔值是1（True）或0（False），看看如何在javascript中声明布尔值，参见下面的代码段
var bool1 = true;
var bool2 = false;
现在在本教程中，我们将制作一个可以使用单个按钮切换的滑动div。
现在，让我们来构建我们简单的滑块系统，使一个新的文件slider.html并键入下面的代码到你的HTML文件。
slider.html
slider
click me
让我们以上面的HTML代码的形式创建一个新的文件style.css并添加以下代码（更好地尝试键入下面的代码，而不是进行复制和粘贴）
style.css
#slider{width:200px;height:200px;background:red;margin:auto;font-family:verdana;color:white;transition:0.2s;}
#button{width:90px;padding:10px;color:green;border:5px solid green;margin:10px auto auto auto;font-family:verdana;text-align:center;cursor:pointer;}
现在是一段时间了，我们将添加我们的JavaScript代码，这将执行上述的滑动操作div
script.js
var button = document.getElementById("button");
var slider = document.getElementById("slider");
var click = false;
button.onclick = function(){
if(click==false){
slider.style.height = 0;
click = true;
}else{
slider.style.height = 200+"px";
click = false;}
}
上面的脚本使用布尔选择一个单独的动作，这个动作是在true和false的基础上完成的。
请参阅上述代码
谢谢你的阅读
了解更多资讯请关注我的微信公众号：芒果web；或者微信搜索javascriptes6关注我们
将您的查询和反馈发送到微信公众号或在我们的QQ群634109637群交流。您也可以在下面评论您的问题。
另外，别忘了订阅我们的简书。
如果你喜欢这篇文章，那么请分享一下，帮助我们成长。
网友评论