0

次のようにコーディングされた垂直メニューがあるとします。

<ul class="sub-menu">
 <li id="menu-item-1" class="menu-item">
  <a href="/page1">Page1</a>
 </li>
 <li id="menu-item-2" class="menu-item">
  <a href="/page2"> </a>
 </li>
 <li id="menu-item-3" class="menu-item">
  <a href="/page3">Page3</a>
 </li>
</ul>

ご覧のとおり、page2へのアンカー要素にはテキストが含まれていません。したがって、メニューから非表示にします。だから私はこのようなことをするjavascriptソリューションを探しています：

if (content of anchor tag equals " ") then 
set anchor's parent list element css to visiblity:hidden;

リストIDは自動的に生成され、時間の経過とともに変更される可能性があるため、これではdocument.getElementByIdを使用できないことに注意してください。では、アンカータグのコンテンツにアクセスして、正しいリストアイテムのCSSを設定するにはどうすればよいですか？

ありがとう。

4

4 に答える 4

2 
var link=document.getElementsByTagName("a");
for(var i=0;i<link.length;i++)
if(link[i].innerHTML.replace(/^\s+|\s+$/g, "")==='')
link[i].parentNode.style.display="hidden";

ワーキングデモ

于 2012-07-25T07:22:06.693 に答える
1

getElementByTagName('li')使用してからテストできますclass="menu-item'

このサンプルを参照してください。

于 2012-07-25T07:23:05.923 に答える
0

このようなものを使用できます..

$('.sub-menu a').each(function () {
    if (this.innerHTML == " ") {
        this.parentNode.style.visibility = 'hidden';
    }
})
于 2012-07-25T07:26:53.707 に答える
0

jQuery を使用している場合は、次のようなことができます。

$("li").each(function() { 
  if ($(this).find("a").text() == "") 
    {
     $(this).css('display','none');
    }
});
于 2012-07-25T07:21:45.610 に答える