我如何获得单独的li文本而不是内部HTML

How do i get the li text alone not inner HTML too

本文关键字：内部 HTML 文本 li 何获得 单独      更新时间：2023-09-26

我有一个类似的html：

   <ul id="NameList">
        <li><span>Name1<span>100</span></span></li>
        <li><span>Name2<span>200</span></span></li>
        <li><span>Name3<span>300</span></span></li>
    </ul>

我需要将html转换为json对象

所以我尝试了这个方法

 var items = [];
        $('ul#NameList').children().each(function () {
            var data1, data2;
            var $this = $(this);
            $this.children().each(function () {
                data1 = $(this).html();
                $child1 = $(this);
                $child1.children().each(function () {
                data2 = $(this).html();
                });
            });
            var item = { data1: data1, data2: data2 };
            items.push(item);
        });

在输出中，data1具有类似于Name1<span>100</span> 的值

但我需要单独的Name1，而不是内部的Html <span>100</span>

我需要这样的输出：

  items = [{data1:'Name1',data2:'100'},{data1:'Name2',data2:'200'},{data1:'Name3',data2:'300'}];

但现在我得到的输出是这样的：

items = [{data1:'Name1<span>100</span>',data2:'100'},{data1:'Name2<span>200</span>',data2:'200'},{data1:'Name3<span>300</span>',data2:'300'}];

编辑：

我也试过这个

data1 = $(this).text();

但它给出的输出是这样的：

items = [{data1:'Name1100',data2:'100'},{data1:'Name2200',data2:'200'},{data1:'Name3300',data2:'300'}];

它也需要innerhtml的文本！！

有人能帮忙解决这个问题吗？

试试这个：-更换

data1 = $(this).html();
data2 = $(this).html();

带有

 data1 = $(this).text().replace($(this).find('span:first').text(),'');
 data2 = $(this).text();

演示

替换：

data1 = $(this).html();
...
data2 = $(this).html();

带有

data1 = $(this).text().replace($(this).find('span:first').text(),'');
...
data2 = $(this).text();

它将只返回不带html标记的文本。

var items = [];
        $('ul#NameList').children().each(function () {
            var data1, data2;
            var $this = $(this);
            $this.children().each(function () {
                data1 = $(this).html();
                data1 = data1.find("span").remove();
                $child1 = $(this);
                $child1.children().each(function () {
                data2 = $(this).html();
                });
            });
            var item = { data1: data1, data2: data2 };
            items.push(item);
        });
相关文章：