jquery开关灯案例_JSjQuery实现简单的开关灯效果【案例】本⽂实例讲述了JS/jQuery实现简单的开关灯效果。分享给⼤家供⼤家参考，具体如下：
实现效果:
html结构只有两个button标签
jquery翻书效果开灯
关灯
⽅法⼀:⽤原⽣js来做
//1.获取页⾯元素
var ElementById('left');
var ElementById('right');
//注意获取body的⽅式有两种
//第⼀种：直接使⽤document的点语法
//var body1=document.body;
// console.log ( body1 )
//第⼆种：通过标签名来获取，但要注意去标签名后要添加下标，因为⽤标签名获取的是数组
var ElementsByTagName('body')[0]//因为通过标签名获取的是数组,⼀定要求取下标才可以
console.log ( body )
//2.注册事件
left.οnclick=function ( ) {
body.style.backgroundColor="white";
}
right.οnclick=function ( ) {
body.style.backgroundColor = "black";
}
⽅法⼆:⽤JQuery来做
$ ( function () {
//获取按钮们
var buttons=$('button');
//2.开灯
$ (buttons[ 0 ]).click(function () {
$('body').css("backgroundColor",'white');
})
// $ ( 'body' ).css('backgroundColor','white')
//3.关灯
buttons[ 1 ].οnclick=function ( ) {
$('body').css('backgroundColor','black');
}
} )
希望本⽂所述对⼤家JavaScript程序设计有所帮助。

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。