javascript - 当内容为空但超链接处于活动状态时删除元素

Question

我有一个 ul 列表，其中包含超链接和文本。我想使用 javascript 删除任何具有超链接但后面没有实际文本的 li。

<ul>
<li><a href="http://x.x.com/employee/ts2"</a>ts2</li>
<li><a href="http://x.x.com/mission_support"</a></li> <---**problem LI**
<li><a href="http://x.x.com/News"</a>News</li><br>
</ul>

如何使用 javascript"<li><a href="http://x.x.com/mission_support"</a></li>"从 ul 中删除该行？我已经尝试了其他人在这个网站上询问的多个 jquery 示例，无论出于何种原因，我的网站都忽略了 jquery。我希望javascript会产生更好的结果。

注意：这不应被视为重复的问题，因为我明确要求在 Javascript 中而不是在 Jquery 中获得此结果。

任何帮助表示赞赏。

编辑：我更新了我的 ul & li 以便它们是有效的 html。我认为下面发布的 jQuery 示例或 javascript 示例都不起作用的原因是超链接介于两者之间

所以从某种意义上说，元素不是空的。如果是这种情况，如果没有任何以下文本，我该怎么做：

<li><a href src='www.test.com'></a>LINK NAME</li>

谢谢！

Answer 1

首先编写一个有效的 HTML 代码。我已经为你做了。这是JavaScript解决方案

http://jsfiddle.net/alaminopu/ttvv9/

HTML：

<ul id="links">
<li><a href='www.link.com'>Link #1</a></li>
<li><a href='www.zoo.com'>Link #2</a></li>
<li><a href='www.fox.com'></a></li>
</ul>

Javascript：

var ul = document.getElementById("links");
var li =ul.getElementsByTagName("li")[2];
li.parentNode.removeChild(li);

Answer 2

var el = document.getElementsByTagName('li');
for (var i = 0; i < el.length; i++) {
    if(el[i].innerHTML == "")
    {                       
        el[i].parentNode.removeChild(el[i]);
    }
};

这将删除所有此类空节点。