从Javascript中的HTML字符串中删除空节点

从Javascript中的HTML字符串中删除空节点,javascript,html,dom,Javascript,Html,Dom,我正在开发一个HTML模板,我必须通过javascript从HTML字符串中删除一些文本。问题是,当HTML字符串中的内部内容被删除时,空标记有时会保留在HTML字符串中 <ul> <li><strong style="font-size: 10pt;"></strong><span style="font-size: 10pt;"> </span></li> </ul> <p><s

我正在开发一个HTML模板,我必须通过javascript从HTML字符串中删除一些文本。问题是,当HTML字符串中的内部内容被删除时,空标记有时会保留在HTML字符串中

<ul>
<li><strong style="font-size: 10pt;"></strong><span style="font-size: 10pt;"> </span></li>
</ul>
<p><span>. Nunc sodales ullamcorper purus, in pharetra quam dictum at. Nullam iaculis, ex ut gravida commodo, nisi odio volutpat sapien, ut mattis eros est vel turpis. Nunc at eros quis nisl efficitur sagittis. Aliquam sed risus nec ex suscipit placerat. </span></p>
<ul>
<li>In hac habitasse platea dictumst. In congue velit sodales ipsum tincidunt, et ullamcorper massa consectetur.</li>
<li>Nulla id ex eu elit congue consequat at ut odio. Nullam risus lorem, auctor ac nibh sed, suscipit condimentum augue.</li>
</ul>
。Nunc sodales ullamcorper purus,在pharetra quam dictum at。纳拉姆·伊库利斯,前孕妇康茂德,尼西·奥迪奥·帕特·萨皮恩,前马蒂斯·厄洛斯·伊斯特·维利·图皮斯。阿基提斯之神的修女。不合格品不合格品

  • 在hac habitasse Plateum,一句名言。在康格维利特苏打酒店,以及乌兰科尔帕酒店
  • 在ut odio的欧盟精英会议上,无需任何身份证明。纳拉姆·里苏斯·洛雷姆,拍卖人ac·尼布·塞德,主食调味品奥古斯
正如您在第一个ul标签中看到的,它里面有多个空标签,我想删除这些标签,否则它会创建一个空白的项目符号列表项

var tempDiv = document.createElement('div');
tempDiv.innerHTML = str;
str = CleanChildren(tempDiv);

function CleanChildren(elem)
                {
                    var children = elem.childNodes;
                    var len = elem.childNodes.length;
                    document.getElementById("remarksContinue").innerHTML = "No of Child Node :: " + len;
                    for (var i = 0; i < len; i++)
                    {
                        var child = children[i];

                        if(child.hasChildNodes())
                            CleanChildren(child);
                        else
                            elem.removeChildNode(child);

                    }

                    return elem.innerHTML;
                }
var tempDiv=document.createElement('div');
tempDiv.innerHTML=str;
str=清洁儿童(tempDiv);
子函数(elem)
{
var children=elem.childNodes;
var len=elem.childNodes.length;
document.getElementById(“remarkContinue”).innerHTML=“子节点编号::”+len;
对于(变量i=0;i
以上是我正在尝试使用的函数,但运气不佳。
提前感谢

此处不需要递归-只需检查外部元素的
textContent
,如果其
trim
med值是空字符串,请删除该元素:

const container=document.querySelector('div');
console.log(container.children.length);
Array.prototype.forEach.call(
容器,儿童,
节点=>{
如果(node.textContent.trim()='')node.remove();
}
);
console.log(container.children.length)

。Nunc sodales ullamcorper purus,在pharetra quam dictum at。纳拉姆·伊库利斯,前孕妇康茂德,尼西·奥迪奥·帕特·萨皮恩,前马蒂斯·厄洛斯·伊斯特·维利·图皮斯。阿基提斯之神的修女。不合格品不合格品

  • 在hac habitasse Plateum,一句名言。在康格维利特苏打酒店,以及乌兰科尔帕酒店
  • 在ut odio的欧盟精英会议上,无需任何身份证明。纳拉姆·里苏斯·洛雷姆,拍卖人ac·尼布·塞德,主食调味品奥古斯

此处不需要递归-只需检查外部元素的
textContent
,如果其
trim
med值是空字符串,请删除该元素:

const container=document.querySelector('div');
console.log(container.children.length);
Array.prototype.forEach.call(
容器,儿童,
节点=>{
如果(node.textContent.trim()='')node.remove();
}
);
console.log(container.children.length)

。Nunc sodales ullamcorper purus,在pharetra quam dictum at。纳拉姆·伊库利斯,前孕妇康茂德,尼西·奥迪奥·帕特·萨皮恩,前马蒂斯·厄洛斯·伊斯特·维利·图皮斯。阿基提斯之神的修女。不合格品不合格品

  • 在hac habitasse Plateum,一句名言。在康格维利特苏打酒店,以及乌兰科尔帕酒店
  • 在ut odio的欧盟精英会议上,无需任何身份证明。纳拉姆·里苏斯·洛雷姆,拍卖人ac·尼布·塞德,主食调味品奥古斯

还有另一种最简单的方法可以尝试。请参见下面的示例

$(文档).ready(函数(){
$(“div.myclass ul li”)。每个(功能(i){
if(this.innerText.trim()=“”){
这个。删除();
}
});
});

。Nunc sodales ullamcorper purus,在pharetra quam dictum at。纳拉姆·伊库利斯,前孕妇康茂德,尼西·奥迪奥·帕特·萨皮恩,前马蒂斯·厄洛斯·伊斯特·维利·图皮斯。阿基提斯之神的修女。不合格品不合格品

  • 在hac habitasse Plateum,一句名言。在康格维利特苏打酒店,以及乌兰科尔帕酒店
  • 在ut odio的欧盟精英会议上,无需任何身份证明。纳拉姆·里苏斯·洛雷姆,拍卖人ac·尼布·塞德,主食调味品奥古斯

还有另一种最简单的方法可以尝试。请参见下面的示例

$(文档).ready(函数(){
$(“div.myclass ul li”)。每个(功能(i){
if(this.innerText.trim()=“”){
这个。删除();
}
});
});

。Nunc sodales ullamcorper purus,在pharetra quam dictum at。纳拉姆·伊库利斯,前孕妇康茂德,尼西·奥迪奥·帕特·萨皮恩,前马蒂斯·厄洛斯·伊斯特·维利·图皮斯。阿基提斯之神的修女。不合格品不合格品

  • 在hac habitasse Plateum,一句名言。在康格维利特苏打酒店,以及乌兰科尔帕酒店
  • 在ut odio的欧盟精英会议上,无需任何身份证明。纳拉姆·里苏斯·洛雷姆,拍卖人ac·尼布·塞德,主食调味品奥古斯
var编号=1;
var clearnode=document.getElementById(“clearnode”);
函数removietem()
{
clearnode.removeChild(clearnode.children[0]);
}
函数removitemall()
{
var len=clearnode.children.length;
对于(var i=0;i
var编号=1;
var clearnode=document.getElementById(“clearnode”);
函数remo
var str = '<ul><li><strong style="font-size: 10pt;"></strong><span style="fontsize: 10pt;"> </span></li></ul><p><span>. Nunc sodales ullamcorper purus, in pharetra quam dictum at. Nullam iaculis, ex ut gravida commodo, nisi odio volutpat sapien, ut mattis eros est vel turpis. Nunc at eros quis nisl efficitur sagittis. Aliquam sed risus nec ex suscipit placerat. </span></p><ul><li>In hac habitasse platea dictumst. In congue velit sodales ipsum tincidunt, et ullamcorper massa consectetur.</li><li>Nulla id ex eu elit congue consequat at ut odio. Nullam risus lorem, auctor ac nibh sed, suscipit condimentum augue</li></ul>';

    var regex = /<[^/>]+>[ \n\r\t]*<\/[^>]+>/gim;
    while(regex.test(str)){
      str = str.replace(regex, "")
    }

    alert(str)
<p><span>. Nunc sodales ullamcorper purus, in pharetra quam dictum at. Nullam iaculis, ex ut gravida commodo, nisi odio volutpat sapien, ut mattis eros est vel turpis. Nunc at eros quis nisl efficitur sagittis. Aliquam sed risus nec ex suscipit placerat. </span></p><ul><li>In hac habitasse platea dictumst. In congue velit sodales ipsum tincidunt, et ullamcorper massa consectetur.</li><li>Nulla id ex eu elit congue consequat at ut odio. Nullam risus lorem, auctor ac nibh sed, suscipit condimentum augue</li></ul>