jQuery before（）输出为字符串而不是HTML

Question

我正在尝试使用一些简单的jQuery在Gravity Forms上的输入之前注入一些HTML。

这是我的代码：

var formInputs = jQuery( "form li input" )

formInputs.each(function( index ) {
  this.before('<h1>Hello, world!</h1>');
});

这是每个输入的样子

与重力形式有某种形式的冲突吗？

编辑 ：我尝试更换

this.before('<h1>Hello, world!</h1>');

与

this.before(jQuery('<h1>Hello, world!</h1>'));

相反，我得到jQuery对象

Answer 1

jQuery.each()方法中的this引用的是JavaScript对象，而不是该元素的jQuery对象，因此，如果要在该元素上使用任何jQuery方法，则必须将其与jQuery包装在一起。

var formInputs = jQuery( "form li input" )

formInputs.each(function( index ) {
  jQuery(this).before( document.createTextNode('<h1>Hello, world!</h1>') );
});

如果要转义html并以纯文本格式输出，那么document.createTextNode方法可以为您提供帮助。 将您的代码更新为以下代码。

var formInputs = jQuery( "form li input" )

formInputs.each(function( index ) {
  jQuery(this).before( document.createTextNode('<h1>Hello, world!</h1>') );
});

Answer 2

你有尝试过吗？

jQuery('<h1>Hello World!</h1>').insertBefore(this);

https://jsfiddle.net/r181ohtj/