在JavaScript中的DOM节点中搜索和替换

我正在创建一个表单并希望能够根据需要使用JavaScript复制某些DIV。但是，我需要替换某段文本的多个实例。像这样与评论由功能代码代替：在JavaScript中的DOM节点中搜索和替换

<body> 

    <div id="duplicate"> 
     <p>Section_1 of form</p> 
     <a href="javascript:add_section()">Add A Section</a> 
    </div> 

    <script type="text/javascript"> 
    <!-- 
     var num_sections = 1; 
     function add_section() 
     { 

     var orig_div=document.getElementById("duplicate") 
     var copy_div=orig_div.cloneNode(true); 

     //Change every "Section_1" in copy_div to "Section_"+num_sections 

     footer = document.getElementById("footer"); 
     document.body.insertBefore(copy_div,footer); 

     } 

    //--> 
    </script> 

    <div id="footer"></div> 

</body>

使用JavaScript，什么是替代的Section_1每个实例时，这些实例都在节内的每个输入标签优雅的方式？

我正在CMS的范围内工作，所以我不能使用更强大的处理语言来实现它。

来源

2013-03-27 Dave

您可以在DOM节点上调用getElementsByTagName以获取由标记标识的某些元素组。

var num_sections = 1; 
window.add_section = function() { 
    var orig_div=document.getElementById("duplicate") 
    var copy_div=orig_div.cloneNode(true); 

    //Change every "Section_1" in copy_div to "Section_"+num_sections 
    num_sections++; 
    var p = copy_div.getElementsByTagName('p')[0]; 
    p.innerHTML = p.innerHTML.replace('Section_1', 'Section_' + num_sections); 

    var footer = document.getElementById("footer"); 
    document.body.insertBefore(copy_div,footer); 
};

这里的jsFiddle

来源

2013-03-27 17:40:05

裹周围的替代路线循环，这就是我一直在寻找。我将不得不重复每个标签类型的代码段，但幸运的是，在这种情况下，这不会成为问题。 – Dave 2013-03-27 18:09:39

也感谢链接到jsFiddle。看起来像一个有用的工具。 – Dave 2013-03-27 18:10:37

@Dave也许你可以使用'p.innerHTML.replace（/ Section_1/g，'Section_'+ num_sections）'来摆脱你提到的循环。 – 2013-03-27 18:20:56

在JavaScript中的DOM节点中搜索和替换

回答

相关问题