使用javascript / jquery添加/删除特定的html

时间:2014-08-17 11:54:09

标签: javascript jquery html

我有这样的代码:

<div id="sd">

    <dc_title article="start" check_zone="true" a_type="cover" cid="#P1_001"></dc_title>
    <p article_con="1.1" cid="#P1_013"></p>
    <p article="start" a_type="advertisement" cid="#P2_001"></p>
    <p article_con="2.1" cid="#P2_004"></p>
    <p article_con="2.1" cid="#P3_001"></p>
    <p article_con="2.1" cid="#P3_005"></p>
    <p article_con="2.1" cid="#P4_001"></p>
    <p article="end" cid="#P4_002"></p>
    <dc_title article="start" check_zone="true" a_type="tableOfContents" cid="#P5_001"></dc_title>
    <dc_title article="start" check_zone="true" create_section="true" a_type="article" cid="#P14_001"></dc_title>
    <p article_con="14.1" cid="#P14_040"></p>
    <p article_con="14.1" cid="#P16_005"></p>
    <p article="end" cid="#P16_018"></p>

</div>

并且有3个特殊属性:

article="start"
article_con="...."
article="end"
  • 我想检查第一行标记是否具有article="start"属性,而最后一行标记是否具有article="end"属性。

  • 我想找到附近有两个相同的标签(仅限于属性):

    <p article="end" cid="#P4_002"></p>
    <p article="end" cid="#P4_002"></p>
    

    OR

    <p article="start" cid="#P4_001"></p>
    <p article="start" cid="#P4_002"></p>
    

    OR article_con="..."具有相同的值和奇数的标记:

    <p article_con="2.1" cid="#P3_001"></p>
    <p article_con="2.1" cid="#P3_002"></p>
    <p article_con="2.1" cid="#P3_003"></p>
    

1 个答案:

答案 0 :(得分:1)

$sdChilds = $( "#sd" ).children();
if (($sdChilds.first().attr('article') == 'start') && ($sdChilds.last().attr('article') == 'end')){
    alert('Yes, first and last tags are Start and End');
}else{
    alert('No, first and last tags are not Start and End');
}

var prevArticle = '*';
var prevArticleCon = '*';
var i = 0;
var j = 0;
$("p, dc_title" ).each(function(){
    if (($(this).attr('article') == prevArticle) && (prevArticle != null)){
        i++;
    }
    if (($(this).attr('article_con') == prevArticleCon) && (prevArticleCon != null)){
        j++;
    }
    prevArticle = $(this).attr('article');
    prevArticleCon = $(this).attr('article_con');
});
if (i > 0){
    alert('Yes, you have '+ i + ' extra element with same article attribute');
}
if (j > 0){
    alert('Yes, you have '+ j + ' extra element with same article_con attribute');
}

<强> Check this JSFiddle Demo

您可以更改HTML代码并检查它是否可以正常工作。 尝试添加或删除开始和结束标记,添加或删除具有重复属性的标记并检查代码。