摘要:<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>jQuery属性操作</ti
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>jQuery属性操作</title> <script src="jquery-3.3.1.min.js"></script> <style> .show{ background-color:silver; width: 200px; margin: 0 auto; text-align: center; } .operate{ /* width: 200px;*/ height: 20px; margin: 10px auto; text-align: center; } .a{ background-color: #0000FF; font-size: 40px; } </style> </head> <body> <div class="show">操作</div> <div class="operate"> <input id="cz" type="button" value="操作"> </div > <script> $('document').ready(function () { $('#cz').click(function () { var bt= $('#cz').attr('value'); if(bt == '操作'){ $('.show').addClass('a'); $('#cz').attr('value','已添加了'); $('.show').html('<h1>我这是改变了 html</h1>') }else { $('.show').removeClass('a'); $('#cz').attr('value','操作'); $('.show').text('qweqweqwe'); } }) }) </script> </body> </html>