找到这种类型的标题,然后在该div上方添加一个新单词

时间:2015-06-05 05:45:39

标签: jquery html

<HTML>

<HEAD></HEAD>

<BODY BGCOLOR="#ffffff">


  <DIV>
    <H3 CLASS="Heading-1">First Level Heading</H3> 
    <DIV>
      <H4 CLASS="Heading-2">Second Level Heading</H4>
      <DIV>
        <H6 CLASS="Heading-3">Third Level Heading</H6>
        <P CLASS="Tab-Text-7">Some Text Here</P>
      </DIV>


      <DIV>
        <H6 CLASS="Heading-3">Third Level Heading</H6>
        <TABLE>
          <TR>
            <TD ROWSPAN="1" COLSPAN="1">
              Some Cotents Here
            </TD>
          </TR>
        </TABLE>
      </DIV>

      <DIV>
        <H6 CLASS="Heading-3">Third Level Heading</H6>
        <TABLE>
          <TR>
            <TD ROWSPAN="1" COLSPAN="1" class="green1">
              Some text goes here
            </TD>
          </TR>
        </TABLE>
      </DIV>


      <DIV>
        <H6 CLASS="Heading-3">Third level Heading</H6>
      </DIV>
      <DIV>
        <H6 CLASS="Heading-4">Fourth Level Heading </H6>
        Some Text Goes here
      </DIV>


      <DIV>
        <H4 CLASS="Heading-2">Second Level Heading</H4>
        <DIV>
          <H6 CLASS="Heading-3">Third Level Heading   </H6>
          <TABLE>
            <TR>
              <TD ROWSPAN="1" COLSPAN="1" class="blue1">
                SOme text goes here
              </TD>
            </TR>
          </TABLE>
        </DIV>
      </DIV> <DIV>
      <H6 CLASS="Heading-3">Third Level Heading</H6>
      Some text goes here
    </DIV>
  </DIV>
</BODY>

</HTML>

预期产出: -

<HTML>
<HEAD></HEAD>
<BODY BGCOLOR="#ffffff">

xxxxx

<DIV>
<H3 CLASS="Heading-1">First Level Heading</H3>  
<DIV>
<H4 CLASS="Heading-2">Second Level Heading</H4>
<DIV>
<H6 CLASS="Heading-3">Third Level Heading</H6>
<P CLASS="Tab-Text-7">Some Text Here</P>
</DIV>

xxxxx

<DIV>
<H6 CLASS="Heading-3">Third Level Heading</H6>
<TABLE>
<TR>
<TD ROWSPAN="1" COLSPAN="1">
Some Cotents Here
</TD>
</TR>
</TABLE>
</DIV>

xxxxx

<DIV>
<H6 CLASS="Heading-3">Third Level Heading</H6>
<TABLE>
<TR>
<TD ROWSPAN="1" COLSPAN="1"class="green1">   
Some text goes here
</TD>
</TR>
</TABLE>
</DIV>

xxxxx

<DIV>
<H6 CLASS="Heading-3">Third level Heading</H6>
</DIV>
<DIV>
<H6 CLASS="Heading-4">Fourth Level Heading </H6>
Some Text Goes here
</DIV>

xxxxx

<DIV>
<H4 CLASS="Heading-2">Second Level Heading</H4>
<DIV>
<H6 CLASS="Heading-3">Third Level Heading   </H6>
<TABLE>
<TR>
<TD ROWSPAN="1" COLSPAN="1" class="blue1">
SOme text goes here
</TD>
</TR>
</TABLE>
</DIV>

xxxxx

<DIV>
<H6 CLASS="Heading-3">Third Level Heading</H6>
Some text goes here
</DIV>
</BODY>
</HTML>

从上面代码我想搜索标题并放置&#34; XXXXX&#34;如果它包含任何子标题(即标题1包含标题2),那么那时它应该放置&#34; XXXXX&#34;父母标题上方的单词而不是子标题。(标题1是父母)

任何人都可以帮助我。

3 个答案:

答案 0 :(得分:2)

THIS就是你想要的。

1)JQuery检查文档中的每个标题 2)然后搜索父母之前是否有另一个标题 3)如果父母之前没有标题,则在该标题之前添加内容。

$(document).find('h1, h2, h3, h4, h5, h6').each(function() {
    if ($(this).parent().prev().is('h1, h2, h3, h4, h5, h6') != true) {
        $(this).parent().before('<p>xxxxxxx</p>');
    }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<DIV>
<H3 CLASS="Heading-1">First Level Heading</H3>  
<DIV>
<H4 CLASS="Heading-2">Second Level Heading</H4>
<DIV>
<H6 CLASS="Heading-3">Third Level Heading</H6>
<P CLASS="Tab-Text-7">Some Text Here</P>
</DIV>


<DIV>
<H6 CLASS="Heading-3">Third Level Heading</H6>
<TABLE>
<TR>
<TD ROWSPAN="1" COLSPAN="1">
Some Cotents Here
</TD>
</TR>
</TABLE>
</DIV>


<div>
<H6 CLASS="Heading-3">Third Level Heading</H6>
<TABLE>
<TR>
<TD ROWSPAN="1" COLSPAN="1"class="green1">   
Some text goes here
</TD>
</TR>
</TABLE>
</DIV>


<div>
<H6 CLASS="Heading-3">Third level Heading</H6>
<DIV>
<H6 CLASS="Heading-4">Fourth Level Heading </H6>
Some Text Goes here
</DIV></DIV>


<DIV>
<H4 CLASS="Heading-2">Second Level Heading</H4>
<DIV>
<H6 CLASS="Heading-3">Third Level Heading   </H6>
<TABLE>
<TR>
<TD ROWSPAN="1" COLSPAN="1" class="blue1">
SOme text goes here
</TD>
</TR>
</TABLE>
</DIV>


<DIV>
<H6 CLASS="Heading-3">Third Level Heading</H6>
Some text goes here
</DIV>

答案 1 :(得分:1)

我认为你需要这个代码

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<body>
  <DIV class="Find-Me">
    <H3 CLASS="Heading-1">First Level Heading</H3>  
    <DIV>
      <H4 CLASS="Heading-2">Second Level Heading</H4>
   <DIV>
   <H6 CLASS="Heading-3">Third Level Heading</H6>
   <P CLASS="Tab-Text-7">Some Text Here</P>
  </DIV>

  <DIV class="Find-Me">
   <H6 CLASS="Heading-3">Third Level Heading</H6>
   <TABLE>
     <TR>
      <TD ROWSPAN="1" COLSPAN="1">
       Some Cotents Here
      </TD>
     </TR>
   </TABLE>
</DIV>
  <script>
    function Insert() {
      $('<p>xxxx</p>').insertBefore('.Find-Me');
    }
    Insert();
    </script>
</body>

答案 2 :(得分:0)

$('body > div').has([class^='Heading-']).prepend('XXXXXX');