日期:2014-05-16 浏览次数:20429 次
<div>
<span class='red'>test0<span class='line'>test1</span></span><span class='blue'>test2</span>
</div>
隐藏标签变成这样的:
<div>
<!--<span class='red'>-->test0<!--<span class='line'>-->test1<!--</span>--><!--</span>--><!--<span class='blue'>-->test2<!--</span>-->
</div>
显示标签去除各标签的 <!-- -->
如果用 $('span').removeAttr("class"); 那么恢复显示时需要全部从服务器去取,不建议.
请问用jquery如何实现注释掉标签呢?
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.9.0.min.js"></script>
<script type="text/javascript">
$(function () {
//获取注释的HTML
var html = $('#div1').html();
//把注释替换掉
var html2 = html.replace(/<!--([\s\S]*?)-->/g , '$1');
//将注释替换后的HTML添加到div2中
$('#div2').html(html2);
})
</script>
<span style="font-size: 16px;"><div>
<span class='red'>test0<span class='line'>test1</span></span><span class='blue'>test2</span>
</div></span>
<span style="font-size: 18px;">隐藏标签变成这样的:</span>
<span style="font-size: 16px;"><div id="div1">
<!--<span class='red'>-->test0<!--<span class='line'>-->test1<!--</span>--><!--</span>--><!--<span class='blue'>-->test2<!--</span>-->
</div></span>
<span style="font-size: 18px;">显示标签去除各标签的 <!-- --></span>
<div id="div2"></div>
<span style="font-size: 18px;">如果用 $('span').removeAttr("class"); 那么恢复显示时需要全部从服务器去取,不建议.
请问用jquery如何实现注释掉标签呢?</span>
<style>
.red{color:red}
.line{display:block;}
.blue{color:blue}
</style>
<script src="http://www.coding123.net/js/jquery.js"></script>
<span style="font-size: 16px;"><div id="dv1">
<span class='red'>test0<span class='line'>test1</span></span><span class='blue'>test2</span>
</div></span>
<input type="button" value="隐藏" onclick="toggle(this)"/>
<script>
function toggle(btn){
var hide=btn.value=='隐藏';
$('#dv1 span').each(function(){
&nb