javascript - .prepend 不是函数

标签 javascript jquery html function prepend

请考虑以下示例代码:

<!DOCTYPE html>
<html>
    <head>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
        <script>
            $(document).ready(function(){
                $("#btn1").click(function(){
                    var btn = document.createElement("BUTTON");     
                    btn.prepend("<b>Prepended text</b>. ");
                });
            });
        </script>
    </head>
    <body>
        <p>This is a paragraph.</p>
        <button id="btn1">Prepend text</button>
    </body>
</html>

上面的代码在控制台中抛出如下错误:

btn.prepend is not a function

为什么会出现这个错误?请提出解决方案。谢谢你

最佳答案

请不要关注 W3School 的低质量文章。对于您的解决方案:

  • btn 不是 jQuery 对象。它是一个 JavaScript HTMLElement
  • .prepend() 函数是一个 jQuery 函数。

你的代码现在应该是:

$(document).ready(function(){
  $("#btn1").click(function(){
    var btn = $(this);
    btn.prepend("<b>Prepended text</b>. ");
  });
});

工作片段

$(document).ready(function(){
  $("#btn1").click(function(){
    var btn = $(this);
    btn.prepend("<b>Prepended text</b>. ");
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>This is a paragraph.</p>
<button id="btn1">Prepend text</button>

请参阅上面的工作片段。点击 Run Code Snippet 并点击里面的按钮。

关于javascript - .prepend 不是函数,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36059045/

相关文章:

javascript - 清除密码字段

html 搜索表单 - 对齐提交按钮

javascript - 有没有办法将多个事件添加到 $ ("body").on() 以便在更改列表或单击按钮时起作用

Jquery 滚动图像在 IE 中不起作用

javascript - 如何将 HTML 文件添加到 GitHub 存储库?

jquery - 通过缓动水平滑动 div

asp.net - 尝试通过ajax访问Web服务时出现HTTP 500错误

javascript - 如何将 Promise 的结果传递给 AngularJS 中的 Controller

javascript - 如何循环遍历深层嵌套的 json 对象

javascript - 如何将经度和纬度转换为街道地址