将 jQuery 函数 insertBefore() 转换为 before() 以附加隐藏的输入答案

【问题标题】：Convert jQuery function insertBefore() to before() for appending a hidden input将 jQuery 函数 insertBefore() 转换为 before() 以附加隐藏的输入
【发布时间】：2019-08-27 19:18:19
【问题描述】：

我有一个代码块，它使用 jQuery 附加由 attr() 函数创建的隐藏字段（具有适当的属性）。我目前正在使用insertBefore()函数如下图：

$('<input>').attr({
    name: 'token',
    type: 'hidden',
    value: 'value',
}).insertBefore( $('#form_id :submit') );

这正确地在我的#form_id 表单的submit 按钮之前附加了一个新的隐藏DOM 输入元素，但我想改用before()，因为在定义内容之前选择我的目标对我来说似乎更具可读性.

【问题讨论】：

标签： javascript jquery hidden-field

【解决方案1】：

就在上面发布我的问题之前，我又尝试了一次从头开始使用before()，不知何故我这次成功了。所以我决定发布我的问题和答案（解决方案），希望它可以帮助其他人在未来尝试做同样的事情：

$('#form_id :submit').before(
    $("<input>", {
        name: 'token',
        type: 'hidden',
        value: 'value',
    })
);

这段代码实际上返回了一个新的 DOM 输入元素，该元素在我们传递的 {} 对象中设置了属性。这个返回的元素是我们需要传递给before() 的content 参数，以便在选择器中的元素之前插入我们的隐藏字段，在本例中是我们ID 的submit 按钮。

【讨论】：

这两种插入方式的区别在文档中有清楚的说明
@charlietfl 我们知道这一点，但他们的<p>Test</p> 的基本示例严重缺乏。此外，文档没有显示如何插入动态创建的元素，这就是我上面解释的内容。
很好...创建一个元素也是jQuery 101
@charlietfl 这样一来我的贡献就变得不那么有价值了吗？嗯。

【解决方案2】：

也许这会对你有所帮助。

$('#form_id').before('<input type="text" name="token" value="value" />');

【讨论】：

我已经在我的回答中提供了解决方案，当您的属性是动态值（变量）而不仅仅是静态 HTML 标记时，这是一种更好的方法，但无论如何谢谢。