Question

我想删除一些html，因为我实际上无法访问HTML文件。这是因为它是一个CMS，所以可以通过DOM操作代码吗？

以下是我刚刚编写的代码示例，如何删除frmMain [第一个表单标记]，但是通过DOM保留第二个标记？

我知道您无法在<form>内嵌套<form>。

<form id="frmMain" >

<form class="2ndform"></form> 

</form>

Answer 1

您可以保存第二种形式的参考：

var second_form = $( '.2ndform' ).remove()

然后删除第一个表单

$( '#frmMain' ).remove()

最后在任何地方重新填写第二张表格

$( '.other_wrapper' ).append( second_form );

作为最后一点说明：

你不能拥有以数字开头的html类。请参阅this
你不能有嵌套表格。请参阅this

Answer 2

使用.unwrap：

$('.2ndform').unwrap();

Docs

或简单的JavaScript：

var el = document.getElementById('frmMain');
var newcontent = el.outerHTML.replace(el.outerHTML, el.innerHTML);

document.body.innerHTML = newcontent;

Answer 3

如前所述，您不能在表单中包含表单。当浏览器解析HTML时，它将尽其所能地修复它。此行为未指定，并且不一定是相同的跨浏览器。因为我好奇，我做到了：

<form id="frmMainA">
    <form class="2ndForm">
    </form>
</form>
<form id="frmMainB">
    <form class="2ndForm">
        <input type="text"/>
    </form>
</form>
<form id="frmMainC">
    <input type="text"/>
    <form class="2ndForm">
        <input type="text"/>
    </form>
</form>

在Chrome中运行时，它会吐出：

<form id="frmMainA">
 </form>

<form id="frmMainB">
    <input type="text">
</form>

<form id="frmMainC">
    <input type="text">
    <input type="text">
</form>

它在FF和IE10中做了同样的事情。这意味着当JS在现代浏览器中运行时，您将只有#frmMain，并且不会有.2ndForm到unwrap。如果您需要表单包含课程.2ndForm，则可以将其添加到#frmMain。

var form = document.getElementById('frmMain');
form.className = form.className + ' 2ndForm');

或者

$('#frmMain').addClass('2ndForm');

通过DOM操纵

3 个答案: