格式错误的HTML：如何才能不显示一个空的li元素

上一颗子弹我有一个是创建一些HTML /输出从Flash应用程序&我需要显示/呈现在Firefox浏览器。格式错误的HTML：如何才能不显示一个空的li元素

的HTML格式错误，所以它会吐出空利元件&列表没有UL或醇元素，但它会吐出里元件。

是否有一个CSS标志或任何方法来显示li元素，如果li元素为空（请参阅代码空下面的代码示例）？

如果锂元素没有的innerText，那么就说明子弹。但是我不希望它这样做，我希望它不会显示子元素中是否存在innerText。有没有办法做到这一点，而不必解析HTML？

// example of badly formed HTML output from flash 
<textformat leading="2"> 
    <li> 
     <font style=" font-family: 'arial'; font-size: 14px; color: #FFFFFF; letter-spacing: 0px; "> 
      <b>Influence and Negotiation</b> 
      <font style=" font-size: 12px; color: #000000; "> 
      </font> 
     </font> 
    </li> 
</textformat> 

// sometimes I get an empty li element, which in Firefox shows the bullet. I want to NOT show the bullet/li element if it is empty 
<textformat leading="2"> 
    <li> 
     <font style=" font-family: 'arial'; font-size: 14px; color: #FFFFFF; letter-spacing: 0px; "> 
      <!-- empty li element --> 
     </font> 
    </li> 
</textformat>

来源

2011-11-20 Jake M

如果你想删除空li元素（其中“空”是指没有或只有空白的内容），你可以这样做：

function getText(el) { 
    if (typeof el.textContent == 'string') { 
    return el.textContent; 
    } 
    if (typeof el.innerText == 'string') { 
    return el.innerText; 
    } 
} 

var li, lis = document.getElementsByTagName('li'); 
var re = /^\s*$/; 

for (var i=0, iLen=lis.length; i<iLen; i++) { 
    li = lis[i]; 

    if (re.test(getText(li))) { 
    li.parentNode.removeChild(li); 
    } 
}

或者，你可以设置空LIS到：

list-style-type: none;

通过添加适当的类，但结果却可能是跨浏览器一致。有些会留下空的空间，有些会删除它。您也可以使用以下类别：

display: none;

要离开li，但不显示它并且没有空格。随你便。

来源

2011-11-21 00:08:40 RobG

不，没有办法。有:empty但如果有它下方的<font>元素不工作，并在CSS没有:has。您可以使用:has使用jQuery，不过，既然你已经标记它javascript我以为这是一个选项：

$('li:has(font:empty)').remove();

将这项工作？

来源

2011-11-20 23:42:45 Ryan

$(document).ready(function(){ 
    $('li').each(function(){ 
     if($(this).html().length == 0) 
      $(this).css('list-style-type','none')       
    }); 

});

http://jsfiddle.net/yU8aJ/

来源

2011-11-21 00:34:31 tuze

格式错误的HTML：如何才能不显示一个空的li元素

回答

相关问题