如何将新元素插入'这'子元素Jquery

How to insert new element to 'this' child element Jquery?

本文关键字:元素 Jquery 插入 新元素      更新时间:2023-09-26

我已经嵌套了for循环。第一个是从XML文件中获取问题和答案,内部循环是添加属于头部问题的子问题。。。我的代码:

  for (var i = 0 ; i < size; i++) {
        var question = xml.find('row').eq(i).find('question').text();
        var sizeQ = xml.find('row').eq(i).find('question_down').size();
        var answer = xml.find('row').eq(i).find('answer').text
        $('.faq_row').append(" <div class='faq_details'> <li class='faq_quest' > <a class='faq_row_question'>" + question +
            "<div class='faq_triangle_down'> </div></a> <div class='faq_inside_question'> <p class='faq_answer'>" + answer + "</p> <div class='faq_sub_questions'> </div> </div> </li> </div> <br>"); //here i get question and answer for the question
        for (var j = 0; j < sizeQ; j++) {
            var subquestion = xml.find('row').eq(i).find('question_down').eq(j).text();
            $('.faq_sub_questions').append("<a class = 'faq_sub_question_link'>" + subquestion + "</a> <br class='faq_br'>"); // here i get all sub questions
        }
    }

我的问题是,所有的子问题都写入同一个类"faq_sub_questions",在第一个问题中,我看到了XML文件中的所有子问题,我想为每个问题添加自己的子问题。。。有什么建议吗?

尝试将您的faq_details元素存储在变量中,然后使用此变量使用find方法标记当前行faq_sub_questionsdiv,最后附加您的div链接faq_sub_question_link:

//Store your faq_details in variable
var faq_details = $(" <div class='faq_details'> <li c.....");
$('.faq_row').append( faq_details );
//Then use this variable to targer the current row
faq_details.find('.faq_sub_questions').append("<a class = 'faq_sub_question_link'>...

希望这能有所帮助。

您可以每次创建并引用一个新的父元素,如下所示:

  for (var i = 0 ; i < size; i++) {
        var question = xml.find('row').eq(i).find('question').text();
        var sizeQ = xml.find('row').eq(i).find('question_down').size();
        var answer = xml.find('row').eq(i).find('answer').text
        // here define `parenter` variable
        var parenter = $(" <div class='faq_details'> <li class='faq_quest' > <a class='faq_row_question'>" + question +
            "<div class='faq_triangle_down'> </div></a> <div class='faq_inside_question'> <p class='faq_answer'>" + answer + "</p> <div class='faq_sub_questions'> </div> </div> </li> </div> <br>");
        // here append using the new variable name
        $('.faq_row').append( parenter ); //here i get question and answer for the question
        for (var j = 0; j < sizeQ; j++) {
            var subquestion = xml.find('row').eq(i).find('question_down').eq(j).text();
            // here again append to new parent variable instead
            parenter.children(".faq_sub_questions").append("<a class = 'faq_sub_question_link'>" + subquestion + "</a> <br class='faq_br'>"); // here i get all sub questions
        }
    }