jQuery将html作为文本而不是DOM对象插入

Question

我正在尝试使用jQuery插入一个DOM元素，但它仍然以文本形式插入。

var newImg = "<h1>Hi</h1>";
    $("li").each(function myFn(){
        this.addEventListener("mouseover", function myFn2 () {
                             this.before(newImg);
                              })
    });

Answer 1

如果您console.log(this)，您应该发现它不是事件处理程序中的jQuery对象。在使用before方法使用jQuery方法之前，您需要使用$（）包装它。

$(this).before(newImg);

＆＃13;

＆＃13;

var newImg = "<h1>Hi</h1>";
$("li").each(function myFn() {
  this.addEventListener("mouseover", function myFn2() {
    $(this).before(newImg);
  })
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul>
  <li>Wee</li>
</ul>

＆＃13;

＆＃13;

＆＃13;