使用javascript/jquery添加/删除特定的html [英] add/remove specific html using javascript/jquery

问题描述

我有这样的代码:

<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"属性.

  • I want to check that first line tag has an article="start" attribute and last line tag has an article="end" attribute.

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

    I want to find are there any two same tags near like that (minding only attribute):

    <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="..."具有相同的值和标签的奇数:

    OR article_con="..." has same value and odd number of tag:

    <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>
    

  推荐答案

  $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');
  }
  

  检查此JSFiddle演示

  Check this JSFiddle Demo

  您可以更改HTML代码，并检查其是否如您所愿. 尝试添加或删除开始和结束标签，以及添加或删除具有重复属性的标签，然后检查代码.

  You can change the HTML code and check if it's works as you want or not. Try to add or remove start and end tags and add or remove tags with repeated attributes and check the code.

  这篇关于使用javascript/jquery添加/删除特定的html的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！