Элементы jQuery Wrap, созданные методом .Each в Div - PullRequest
1 голос
/ 20 ноября 2010

Я хочу обернуть элементы, созданные методом .each в div.

Вот мой код:

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script type="text/javascript">
  $(document).ready(function() {
    $.ajax({
      type: "GET",
      url: "xml/timeline.xml",
      dataType: "xml",
      success: parseXML
    });

    function parseXML(xml) {

      $(xml).find("Year").each(function() {
        var year = $(this).attr("year");
        $(".timeLineWrapper").append('<h2 class="timeYearHead">' + year + "</h2>");
        $(this).find("Event").each(function() {
          var event = $(this).text();
          $(".timeLineWrapper").append('<p>' + event + '</p>');
        }); // close find Event
      }); // close find Year
    } // close parseXML   
  }); // Close docDotReady
</script>

Основная идея состоит в том, чтобы создать заголовок для каждого года и под ним перечислить события для каждого года, число которых будет варьироваться.Я хочу обернуть события в div после того, как они были проанализированы из файла XML.Как мне это сделать?

1 Ответ

0 голосов
/ 22 ноября 2010

Вот мой текущий скрипт:

  <script type="text/javascript">

    $(document).ready(function(){
        $.ajax({
            type: "GET",
            url: "xml/timeline.xml",
            dataType: "xml",
            success: parseXML
        });

        function parseXML(xml){

            $(xml).find("Year").each(function(){
                var year = $(this).attr("year");            
                $(".timeLine").append('&lt;li class="timeYear"&gt;&lt;h2 class="timeYearHead"&gt;' + year + "&lt;/h2&gt;&lt;/li&gt;");   
                $(this).find("Event").each(function(){  
                    var event = $(this).text();             
                    $(".timeLine").append('&lt;li class="timeEvent"&gt;' + event + '&lt;/li&gt;');
                }); // close find Event
            }); // close find Year
        } // close parseXML   
    }); // Close docDotReady

    </script>

Вот вывод HTML, который он производит:

<ul class="timeLine">
    <li class="timeYear">
        <h2 class="timeYearHead">1950</h2>
    </li>
    <li class="timeEvent">
        One
    </li>
    <li class="timeEvent">
        Two
    </li>
    <li class="timeEvent">
        Three
    </li>
    <li class="timeEvent">
        Four
    </li>
    <li class="timeYear">
        <h2 class="timeYearHead">1951</h2>
    </li>
    <li class="timeEvent">
        Five
    </li>
    <li class="timeEvent">
        Six
    </li>
    <li class="timeEvent">
        Seven
    </li>
    <li class="timeYear">
        <h2 class="timeYearHead">1952</h2>
    </li>
    <li class="timeEvent">
        Eight
    </li>
    <li class="timeEvent">
        Nine
    </li>
    <li class="timeEvent">
        Ten
    </li>
    <li class="timeEvent">
        Eleven
    </li>
    <li class="timeEvent">
        Twelve
    </li>
</ul>

Обычно я пытаюсь проанализировать этот XML-файл:

<?xml version="1.0"?>
<Years>
    <Year year="1950">
        <Events>
            <Event>
                One
            </Event>
            <Event>
                Two
            </Event>
            <Event>
                Three
            </Event>
            <Event>
                Four
            </Event>
        </Events>
    </Year>
    <Year year="1951">
        <Events>
            <Event>
                Five
            </Event>
            <Event>
                Six
            </Event>
            <Event>
                Seven
            </Event>
        </Events>
    </Year>
    <Year year="1952">
        <Events>
            <Event>
                Eight
            </Event>
            <Event>
                Nine
            </Event>
            <Event>
                Ten
            </Event>
            <Event>
                Eleven
            </Event>
            <Event>
                Twelve
            </Event>
        </Events>
    </Year>
</Years>

Моя цель состоит в том, чтобы создать в нем XML-файл для каждого года в файле XML с подсписком для каждого списка событий, соответствующих этому году, и для каждого события в этом списке.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...