Question

+ function Engine() {

    var createObject = function(elemClass, height, width){

        this.element = document.createElement('div');

        $(this.element).addClass(elemClass)
        $(this.element).css('height', height);
        $(this.element).css('width', width);

    };

    var box1 = new createObject('box', 200, 400);

    $('body').append(box1.element);

}();

为什么以下代码不会出错？但它也不会在body标签中创建div。让我们假设身体是空的。任何帮助将不胜感激。

谢谢，

Answer 1

为什么以下代码不会出错？

三个可能的原因：代码没有运行，没有错误，或者你没有看到它。我猜第二个。

但它也不会在body标签中创建div。

也许是因为在代码运行时没有<body>元素可以匹配您的选择器。 $('body')可以是一个空集合，jQuery也不会对它产生影响。

请查看Why does jQuery or a DOM method such as getElementById not find the element?出于确切原因和一些解决方案，其中最简单的方法是使用jQuery()：

$(function Engine() {
    …
    $('body').append(box1.element);
});

Answer 2

这取决于您放置脚本代码的页面中的位置。

如果它在body元素内，则文档已经包含一个body元素，$('body')返回它，一切正常。

如果它在head元素中，则在脚本运行时主体尚不存在， $('body')返回一个空集合，并将div附加到任何内容中。

你没有错误，因为在这种情况下jquery不会抛出错误。

如果要在head元素内编写脚本，请将其包装在document.ready call：

中

<script>
+ function Engine() {
      $(document).ready(function(){
        var createObject = function(elemClass, height, width){

            this.element = document.createElement('div');

            $(this.element).addClass(elemClass)
            $(this.element).css('height', height);
            $(this.element).css('width', width);

        };

        var box1 = new createObject('box', 200, 400);

        $('body').append(box1.element);

     });

}();
</script>

它会起作用。

Javascript OOP，不会给我一个错误但代码不起作用

2 个答案: