万网云服务器网站上线,html5企业网站带后台,织梦确定网站风格,上海免费模板建站有时候需要添加CSS样式和移除CSS样式#xff0c;如添加display属性#xff0c;设为隐藏。有时候需要移除display属性。
一、jQuery移除CSS样式的两种方法
注意#xff1a;当其中一种不支持时#xff0c;就尝试另一种#xff1a;
$(#show).removeAttr(如添加display属性设为隐藏。有时候需要移除display属性。
一、jQuery移除CSS样式的两种方法
注意当其中一种不支持时就尝试另一种
$(#show).removeAttr(style);
$(#show).attr(style,);二、JS/jQuery添加或移除CSS样式
//通过JS添加样式移除样式
document.getElementById(tab1).style.displaynone;
document.getElementById(tab1).removeAttribute(style);//通过jQuery添加样式移除样式
// $(#tab1).css(display,none);
// $(#tab1).removeAttr(style,);三、实例
!doctype html
html
headmeta charsetutf-8title信息管理/title!--通知ie使用最新内核--meta http-equivX-UA-Compatible contentIEedge!--响应式约束缩放--meta nameviewport contentwidthdevice-width, maxinum-scale1,user-scalableno,initial-scale1link relstylesheet hrefhttps://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css script srchttps://cdn.bootcss.com/jquery/2.1.1/jquery.min.js/scriptscript srchttps://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js/scriptstylebody{ background:#eee;}#main{ max-width:640px; font-family:微软雅黑; }/*头部*/.tou{ background:#fff; margin-top:20px; padding-top:13px; padding-bottom:13px;}/*头部左边*/.tou .tou-left{ margin-left:15px;}.tou .tou-left a{}.tou .tou-left img{ width:78px; height:78px;}/*头部右边*/.tou .tou-right{ position:relative; float:left; margin-left:20px;}.tou .tou-right h3{ font-size:18px; margin-top:3px; margin-bottom:8px;}.tou .tou-right p{ font-size:14px; color:#999; margin-bottom:5px;}.tou .tou-right .self-depart{ margin-bottom:0px;}/*采集和已采集连接*/.self-nav{ margin-top:20px; background:#fff; ;}.self-nav .col-xs-6{ padding-left:0; padding-right:0; margin-left:0; margin-right:0; }.self-nav .btn{ padding-top:10px; padding-bottom:10px;}/*采集列表*/.self-menu{ margin-top:20px; background:#fff;border-top:1px solid #fff; border-bottom:1px solid #fff; }.self-menu .self-menu-cont li{ border-bottom:1px solid #eee;}.self-menu .self-menu-cont li .self-danger{ background:#C00;}/*底部技术支持*/.self-footer{ margin-top:20px; background:#fff; padding-top:13px; padding-bottom:13px; }.self-footer p{ margin-bottom:0; font-size:12px; color:#666; text-align:center;}/style
/head
bodydiv class container idmain!--头部--div classrow toudiv class pull-left tou-lefta href./img src classimg-responsive//a/divdiv class tou-righth3张三/h3p微信号zhangsan/pp classself-depart部门安全部/p/div/div!--banner--div classrow self-navdiv classcol-xs-6a href#tab1 classbtn btn-block btn-default data-toggletab idsend onclickhiddenTag()信息列表/a/divdiv classcol-xs-6a href#tab2 classbtn btn-block btn-default data-toggletab onclickshowTag()添加信息/a/div/div!--菜单列表--div classrow self-menuul classnav nav-pills nav-stacked self-menu-cont tab-pane active fade in idtab1lia href信息列表span classbadge pull-right10/span/a/lilia href消息列表span classbadge pull-right10/span/a/lilia href留言列表span classbadge pull-right10/span/a/lilia href传达列表span classbadge pull-right10/span/a/lilia href通知列表span classbadge pull-right10/span/a/li/ulul classnav nav-pills nav-stacked self-menu-cont tab-pane fade idtab2 styledisplay:nonelia href添加信息/a/lilia href添加消息/a/lilia href添加留言/a/lilia href添加传达/a/lilia href添加通知/a/li/ul/div/div
/body
scriptfunction hiddenTag(){//通过JS添加样式移除样式document.getElementById(tab1).style.displayblock;document.getElementById(tab2).style.displaynone;//通过jQuery添加类选择器和移除类选择器$(#add).removeClass(btn-primary);$(#add).addClass(btn-default);$(#send).removeClass(btn-default);$(#send).addClass(btn-primary);//通过jQuery添加样式移除样式// $(#tab1).css(display,block);// $(#tab2).css(display,none);}function showTag(){//通过JS添加样式移除样式document.getElementById(tab1).style.displaynone;document.getElementById(tab2).removeAttribute(style);//通过jQuery添加类选择器和移除类选择器$(#send).removeClass(btn-primary);$(#send).addClass(btn-default);$(#add).removeClass(btn-default);$(#add).addClass(btn-primary);//通过jQuery添加样式移除样式// $(#tab1).css(display,none);// $(#tab2).removeAttr(style,);}
/script
/html