Question

我有以下问题：

我正在解析大型xml文档，然后我自动为<h1>和<p>生成ID号，标题以10开头，段落以3000开头

我想知道的是，是否有办法计算标题数量并隐藏它们除了前12个。

我不想输入

$('#11').hide();

每个id。

这是我所写的有效并创建标题ID的内容，然后我需要为前12个提供不同的样式。问题是删除或隐藏其他＆＃34;项目＆＃34;十二号之后。

$(xml).find('Item').each(function () {

            if ($(this).attr('headline') > '') {
                var headline = $('<h1></h1>').appendTo(default_slide);
                headline.attr('id', headline_counter);
                headline.addClass('sa-l');
                headline_counter++;

                headline.append($(this).attr('headline'));


                if ($('<h1 id="10">')) {
                    $('#10').attr('style', 'top:10px;left:80px;font-weight: 500; text-align: center;width:340px;font-size:60px;color:#1d1d1d;text-shadow: 5px 5px 5px #ccc;white-space: nowrap;');
                }

Answer 1

根本不需要id，如果您愿意避免使用伪选择器，可以使用:gt pseudo-selector或slice method。

Live Example of Both（source）

使用:gt：

$("p:gt(11)").hide();

:gt表示＆＃34;大于＆＃34;并使用从零开始的索引。所以上面会隐藏第十三个（索引12），跳过前十二个。（显然h1 s的相似之处。）

如果您在相关段落中添加了一个类，这显然会效果最佳，因此您可以更有效地定位它们：

$("p.some-class:gt(11)").hide();

使用slice，它接受开始和（可选）结束索引以从jQuery集中进行选择：

$("p").slice(12).hide();
// Or of course
$("p.some-class").slice(12).hide();

那些以第十三个元素（索引11）开头的切片。

附注：如果您使用以数字开头的id值，则它们的CSS选择器难以编写。例如，#11是一个无效的CSS选择器。它是可能的，但您必须使用真正难以阅读的转义符。 id="11"中的更多内容，但#\31\31的正确选择器为"#\\31\\31"，当然如果您要将其放在JavaScript字符串中，则必须转义反斜杠，所以它变成id="3172"。非常明显，特别是如果您正在处理"#\\33\\31\\37\\32"（作为JavaScript字符串）{{1}}。 the spec

Answer 2

您需要使用gt选择器来定位索引大于：

的元素

$("h1:gt(11)").hide();

注意:: gt选择器的索引从0开始

Answer 3

$("p:gt(11)").hide();是正确的解决方案。

Answer 4

 $( "h1" ).each(function(index) {
   if ( index > 11 ) {
      $(this).hide();
   }
});

这是jQuery的另一种方式。

用jQuery删除id

4 个答案: