Javascript 使用RegExp查找、复制和粘贴标记内容

Javascript 使用RegExp查找、复制和粘贴标记内容,javascript,html,regex,Javascript,Html,Regex,我有一个很长的HTML文件,我需要在其中进行一个相对简单的替换,然而,这不能通过简单的查找/替换来实现。我想知道RegExp是否能帮我做这项工作 下面是HTML片段: <div class="panelHeader"> <span class="QN_header">Info1</span> <span class="QT_header">Info2</span> </div>

我有一个很长的HTML文件,我需要在其中进行一个相对简单的替换,然而,这不能通过简单的查找/替换来实现。我想知道RegExp是否能帮我做这项工作

下面是HTML片段:

<div class="panelHeader">
        <span class="QN_header">Info1</span>
        <span class="QT_header">Info2</span>
    </div>                                          

<div id="QXXXX" class="panelContent">
    <div class="Question">                      
        <span class="QNumber"></span>
        <span class="QText"></span>
    </div>
  <!-- some more tags here -->
</div>

信息1
信息2
因此,最后应该是这样的:

<div class="panelHeader">
        <span class="QN_header">Info1</span>
        <span class="QT_header">Info2</span>
    </div>                                          

<div id="QXXXX" class="panelContent">
    <div class="Question">                      
        <span class="QNumber">Info1</span>
        <span class="QText">Info2</span>
    </div>
  <!-- some more tags here -->
</div>

信息1
信息2
信息1
信息2
我需要的是:

  • 复制Info1
  • 将其插入
  • 复制Info2
  • 将其插入
    如果可以在几次迭代中实现,那没关系;比在整个文件中手动复制/粘贴要好得多

    提前谢谢

    更新: 下面是整个可重复的代码。然后它会重复自己

    <div class="panelHeader">                       <!-- BEGIN OF PANEL HEADER -->              
        <span class="QN_header"></span>
        <span class="QT_header"></span>
    </div>                                          <!-- END OF PANEL HEADER -->
    
    <div id="QXXXX" class="panelContent">           <!-- BEGIN OF CONTENT-->
        <div class="Question">                      
            <span class="QNumber"></span>
            <span class="QText"></span>
        </div>
    
        <div class="Guidance"><p></p></div>
        <div class="Response">
            <div class="responseControls">
                <label><input type="radio" name="RadioXXXX" value="Y" id="RXXXXY" onchange='radioChange(this, "XXXX")' />Yes</label>
                <label><input type="radio" name="RadioXXXX" value="N" id="RXXXXN" onchange='radioChange(this, "XXXX")' />No</label>
                <label><input type="radio" name="RadioXXXX" value="NS" id="RXXXXNS" onchange='radioChange(this, "XXXX")' />Not Seen</label>
                <label><input type="radio" name="RadioXXXX" value="NA" id="RXXXXNA" onchange='radioChange(this, "XXXX")' />Not Applicable</label>
            </div>
            <div class="responseDetails">
                <div class="Observation">
                    <label for="ObsXXXX">Observation:</label>
                    <textarea name="observation" id="ObsXXXX" rows="6" disabled ></textarea></div>
                <div class="DueDate">
                    <label for="DueDateXXXX">Due date:<br /></label>
                    <input name="DueDate" class="DueDate_in" type="text" id="DueDateXXXX"/>
                </div>
    
                <div class="actions">
                    <label for="paXXXX">Actions required to correct and/or prevent this observation:</label>
                    <textarea name="actions" id="paXXXX" rows="6"></textarea>
                </div>
            </div>                                  <!-- End of ResponseDetails -->
        </div>                                      <!-- End of Response -->
    </div>                                          <!-- END OF CONTENT -->
    
    
    

    对 不 不见 不适用 观察: 截止日期:
    纠正和/或防止这种观察所需的措施:
    使用类似jQuery的东西可能比使用正则表达式更有意义。您可以使用以下方法复制示例中的值:

    $('.panelHeader').each(function() {
        var header = $(this);
        var qn = header.find('.QN_header').text();
        var qt = header.find('.QT_header').text();
        var content = header.next('.panelContent');
        content.find('.QNumber').text(qn);
        content.find('.QText').text(qt);
    });
    

    如果他们只是在一长串中系统地重复,请尝试以下方法:

    var panelHeaders = document.querySelectorAll('.panelHeader');
    var panelContents = document.querySelectorAll('.panelContent');
    for (var i=0;i<panelHeaders.length;i++) {
        panelContents[i].querySelector('.QNumber').innerHTML = panelHeaders[i].querySelector('.QN_header').innerHTML;
        panelContents[i].querySelector('.QText').innerHTML = panelHeaders[i].querySelector('.QT_header').innerHTML;
    }
    
    var panelHeaders=document.querySelectorAll('.panelHeader');
    var panelContents=document.querySelectorAll('.panelContent');
    
    对于(var i=0;i

    如果有多个部分,如何知道哪个
    QN_头属于哪个
    QNumber
    ?这是一个网站吗?为什么不直接使用jquery?@davidkonrad-它们在彼此之后重复-这是一个调查问卷。在第一个QN_头之后是第一个QNumber ETCI,在周围有一个包装e> panelHeader
    panelContent
    ?规则1:不要使用正则表达式解析HTML。规则2:如果要使用正则表达式解析HTML,请参阅规则1我在标记中看不到jQuery:)我不打算使用正则表达式!这是一次性的工作-我必须使用jQuery吗?这个答案不需要jQuery。它至少需要IE8。这不是jQuery,它是所有现代浏览器都支持的纯javascript-不需要库。将脚本放在底部,重新加载页面-使用chrome->view source获得修改后的cContent(如果上面的脚本对页面结构有效,则不能确定,但请这样认为)