Question

我的代码是这样的，所以当我把这个代码放在document.ready（）之外的主JS文件中时，它没有执行，我也尝试过提醒，但当我把它放在document.ready（）中时它正在发挥作用，它正在发生什么？

            var imageFile = $('img').attr('src');
        console.log(imageFile);
        var bgcolor = $('.man').css('background-color');
        console.log(bgcolor);

更新（来自评论）：

“我正在使用快捷方式......”

$(function () {
    $('.text').click(function () {
        $('span').css({
            "background-color": 'red',
            "color": 'black'
        });
    });
    $('div.man').click(function () {
        $('p').css('color', 'blue');
        $('ul.nav .check .inner').css('background-color', 'green');
        $('ul.nav .check').css('font-size', '40px');
    });
    $('a[href^= "mailto"]').css('text-decoration', 'none');
    $('body >div> p').click(function () {
        $('p').prepend("<h2>yeah its working,prepend</h2>");
        $('p').append('<h2>yeah its working,append</h2>');
    });
});

Answer 1

$(document).ready确保加载所有DOM结构，然后在其中执行代码。通过这种方式，我们将获得所有元素（在您的情况下为图像）对其进行操作，因此它适用于您的情况。

但是如果你不使用$(document).ready，那么不能保证所有DOM都准备就绪，如果你试图执行你的jQuery那么它可能会或者可能找不到你想要的html元素正在执行操作。

Answer 2

如官方网站所述

描述：指定DOM完全执行时要执行的函数   加载。

在文档“准备就绪”之前，无法安全地操作页面。   jQuery为您检测这种准备状态。代码包含在里面   $（document）.ready（）只会运行一次页面Document Object   Model（DOM）已准备好执行JavaScript代码。代码包括在内   在$（window）.load（function（）{...}）里面会运行整个   页面（图片或iframe），而不仅仅是DOM，已准备就绪。

了解更多信息： -

http://learn.jquery.com/using-jquery-core/document-ready/

当我在jquery中的document.ready（）之外编写代码时代码没有执行？

更新（来自评论）：

2 个答案: