js实现页面图片消除效果

前两天测试的时候发现自己对js还不是太熟悉,所以今天上传的了这篇文章,重新写了一下js模块里面的东西。

核心还是这一部分:

i = 0 last = null function clickDisappear(obj){ if(i==0 && last==null){ i =1 last=obj } else{ if(obj != last){ if(obj.src == last.src){ obj.style.display='none' last.style.display='none' } i = 0 last = null } } }

全部代码:

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> img{ margin: 9px; float: left; width: 32px; height: 32px; } </style> <script type="text/javascript"> // DOM模型:文档对象模型 i = 0 last = null function clickDisappear(obj){ if(i == 0 && last == null){ last = obj i = 1 }else{ if(obj != last){ if(obj.src == last.src){ obj.style.display = 'none' last.style.display = 'none' } i = 0 last = null } } } </script> </head> <body > <table cellpadding="0" cellspacing="1" > <caption>图片消除</caption> <thead> <tr valign="middle" > <!--<th colspan="2">1</th>--> <th>1</th> <th>2</th> <th>3</th> <th>4</th> <th>5</th> <th>6</th> <th>7</th> <th>8</th> <th>9</th> <th>10</th> </tr> </thead> <tbody > <tr valign="middle" > <td><img src="https://www.jb51.net/img/bg-0092.gif"></td> <td><img src="https://www.jb51.net/img/bg-0704.gif"></td> <td><img src="https://www.jb51.net/img/bg-0704.gif"</td> <td><img src="https://www.jb51.net/img/bg-0884.gif"</td> <td><img src="https://www.jb51.net/img/bg-0884.gif"</td> <td><img src="https://www.jb51.net/img/bg-0092.gif"</td> <td><img src="https://www.jb51.net/img/bg-0704.gif"</td> <td><img src="https://www.jb51.net/img/bg-0884.gif"</td> <td><img src="https://www.jb51.net/img/bg-0884.gif"</td> <td><img src="https://www.jb51.net/img/bg-0092.gif"</td> </tr> </tbody> <tfoot></tfoot> </table> </body> </html>

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:http://www.heiqu.com/a35d8cd9908a51b4f1fc94222e538fd7.html