javascript - 如何使用 JavaScript 从页面获取具有特定类的动态加载的 HTML 标签？

Question

我正在使用 JavaScript 添加一些 HTML 标签，如下所示:

function createTag(text) {
    if (text != '') {
        text = text.replace(',', '');
        if (/^\s+$/.test(text) == false) {
            var tag = $('<div class="tags">' + text + '<a class="delete">X</a></div>');
            tag.insertBefore($('input.tag_list'), $('input.tag_list'));
            $('input.tag_list').val('');
        }
    }

我想获取 <div class="tags"> 中的值来自整个页面的标签。我该怎么做？

另外，如何限制这些类型的动态创建标签的数量？

Answer 1

选择标签并使用map() 函数返回一个数组。在提供给 map() 的函数中，从克隆的标记中删除 a。

var tags = $(".tags").map(function(){
    var clone = $(this).clone();
    $(clone).find("a").remove("a");
    return clone.text();
});

JS fiddle : http://jsfiddle.net/ELxW4/

通过将值包装在 span 标记中，您可以让生活变得更轻松:

<div class="tags"><span>javascript</span><a class="delete">X</a></div>
<div class="tags"><span>java</span><a class="delete">X</a></div>
<div class="tags"><span>jquery</span><a class="delete">X</a></div>

然后使用以下方法获取标签:

var tags = $(".tags").map(function(){
    return $(this).find("span").text();
});