jQuery - 追加和删除HTML代码

Question

在jQuery中，如何将HTML行添加到某些HTML中，以及删除HTML行？

这是前面的代码：

<div class="form-group">
    <label class="control-label col-md-2" for="txtCvc">Cvc</label>
    <div class="col-md-10">
        <input class="form-control text-box single-line" id="txtCvc" name="Cvc" type="text" value="" />
    </div>
</div>

这是后面的代码：

<div class="form-group">
    <label class="control-label col-md-2" for="txtCvc">Cvc</label>
    <div class="col-md-10">
        <input class="form-control text-box single-line" id="txtCvc" name="Cvc" type="text" value="" />
        <span class="field-validation-error" data-valmsg-for="txtCvc" data-valmsg-replace="true">Test message.</span>
    </div>
</div>

我需要添加这行代码：

<span class="field-validation-error" data-valmsg-for="txtCvc" data-valmsg-replace="true">Test message.</span>

另外，相反。 如何删除这行代码？

这是前面的代码：

<div class="form-group">
    <label class="control-label col-md-2" for="txtCvc">Cvc</label>
    <div class="col-md-10">
        <input class="form-control text-box single-line" id="txtCvc" name="Cvc" type="text" value="" />
        <span class="field-validation-error" data-valmsg-for="txtCvc" data-valmsg-replace="true">Test message.</span>
    </div>
</div>

这是后面的代码：

<div class="form-group">
    <label class="control-label col-md-2" for="txtCvc">Cvc</label>
    <div class="col-md-10">
        <input class="form-control text-box single-line" id="txtCvc" name="Cvc" type="text" value="" />
    </div>
</div>

对不起，我忘了提到我是jQuery的初学者。 我正在查看追加和删除功能。 提前致谢。

Answer 1

只需使用.append（）和.remove（）方法。

Answer 2

如果你使用show（）和hide（）来表示错误信息会更合适

$('.field-validation-error').show();

用于显示消息和

$('.field-validation-error').hide();

隐藏它，使用if else来检查你的状况。

Answer 3

如果您知道要显示/隐藏验证消息的输入字段元素，则可以使用after方法添加消息：

$field.after('<span class="field-validation-error" data-valmsg-for="txtCvc" data-valmsg-replace="true">Test message.</span>');

并remove以删除它：

$field.next('.field-validation-error').remove();

所以$field可以是这样的：

var $field = $('#txtCvc');