javascript - 令人困惑的 jQuery 行为

标签 javascript jquery html google-chrome xhtml

我有一个基本的 HTML 页面,仅包含:

<body id="body">
<script src="js/jquery-2.0.3.js"    type="text/javascript"></script> 
<script src="js/three.min.js"       type="text/javascript"></script> 
<script src="js/stats.min.js"       type="text/javascript"></script> 
<script src="js/application.js"     type="text/javascript"></script>
</body>

作为index.html的主体页面,以及application.js的内容在哪里是:

function init() {
    var container = $('div');
    container.attr('id', 'container');
    $('body').append(container);
    alert('Container: ' + $('#container').length);
}

$(function() {
    init();
});

所以这显然是一些非常基本的代码,我创建一个 div 并将其附加到正文。然而,alert调用我返回0当我通过 chrome 检查 DOM 树时,没有添加 div。

当我将脚本文件添加到 <body> 的底部时标签,并调用 init()来自 jQuery ready() block ,为什么会发生这种情况?看起来是一个基本且简单的任务。

注意:Chrome 的控制台中没有抛出任何错误

最佳答案

您的线路var container = $('div');不是创建一个DIV,而是选择一个。如果您想创建一个容器,请执行 var container = $('<div></div>');

因此,您当前的代码返回一个空的 jQuery 对象,但您没有注意到,因为 jQuery 与它们配合得很好,并且什么也不做。

关于javascript - 令人困惑的 jQuery 行为,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18300509/

相关文章:

javascript - 如何使用jquery从多个数据中获取单个数据值

jquery - CSS 宽度 : calc(100% -100px); alternative using jquery

javascript - 使用 locationProvider 时,刷新浏览器网页不会在 ui-router 中加载

html - CSS/HTML 错误菜单

html - 轻松定位比其他图像高两倍的图像

javascript - AJAX:我如何绑定(bind) KeyUp 上的自动完成功能才能使用键盘键

javascript - jQuery 从 name[] 获取选中的复选框

javascript - 从 Vue 应用程序外部访问 Vue 方法或事件

javascript - Angular : "TypeError: Cannot read property ' insertBefore' of null"while using Slick Slider

javascript - 如何使用 JavaScript 查找 Flash 内容?