为什么使用jQuery来获取CSS assets?

内容来源于 Stack Overflow,并遵循CC BY-SA 3.0许可协议进行翻译与使用

  • 回答 (2)
  • 关注 (0)
  • 查看 (22)

Chrome开发工具截图:

我想知道,正如问题所述:为什么jQuery会获取我的CSS assets?

CSS工作表与通常一样包括在内;<link rel="stylesheet"><head>标签。然后,jQuery和jQueryUI将作为最后包含在正文中。

当我转到相应的行(6128)时,它显示了这个函数:curCSS。我真的找不到关于它的任何东西,只是它被jQueryUI所使用,而且它已经被降级了。

jQuery         v1.11.1
Google Chrome  v39.0.2171.65 (64-bit)

EDIT 1:

这些asset是由jQueryUI使用。他们只是一些我的内容的背景图片和字体。


EDIT 2:

我已经注释掉jQueryUI,重新加载了页面(Ctrl+F5),现在它们仍然被加载,但是现在在第3580行上有了一些内容。

**jQuery.js snippet removed for brevity**

当我也注释掉jQuery时,它们将像平常一样加载。


EDIT 3:

为了澄清为什么我只加载jQuery+UI而没有加载其他脚本:

我在我的基本模板中包含了jQuery+UI,并且加载了另一个根本不使用jQuery的页面。我去调试那个页面,发现jQuery正在做一些奇怪的事情:

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>Pagetitle</title>

    <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no"/>

    <link rel="stylesheet" href="css/jquery-ui.min.css"/>
    <link rel="stylesheet" href="css/fonts.css"/>
    <link rel="stylesheet" href="css/style.css"/>
</head>
<body>
    <div style="font-family: ArialNarrowBold">CONTENT</div>

    <script type="text/javascript" src="js/jquery/jquery.js"></script>
    <script type="text/javascript" src="js/jquery/jquery-ui.js"></script>
</body>
</html>

现在Chrome开发工具如下所示:

ArialNarrowBold字体在fonts.css.如你所见,除了包含jQuery和jQuery-UI之外,页面上没有进一步的脚本。即使我把jquery-ui.min.css这个保持不变。

即使我将字体加载到style块,jQuery仍然希望自己加载它。

<style type="text/css">
    @font-face {
        font-family: 'ArialNarrowBold';
        src: url('fonts/ArialNarrowBold.eot');
        src: url('fonts/ArialNarrowBold.eot?#iefix') format('embedded-opentype'),
             url('fonts/ArialNarrowBold.woff') format('woff'),
             url('fonts/ArialNarrowBold.ttf') format('truetype');
        font-weight: normal;
        font-style: normal;
    }
</style>
提问于
用户回答回答于

这无疑是ChromeDevTools中的一个回归。我只是使用ChromeCanary和Chromium进行了两次检查,而且我无法在任何一个浏览器上复制这种情况。

在你提交错误报告之前,请检查你是否在最新版本的Chrome上,如果没有,看看是否有帮助。

用户回答回答于

当我使用jQuery添加一些图像src属性时,我也得到了相同的结果。如果你注意到写入该信息的列是“Initiator“:

Chrome似乎在该专栏中跟踪导致请求开始的脚本。也许你正在用jQuery加载一些html,其中包含CSS,或者任何与CSS没有链接的asset。

$(img).attr('src', 'image.png');

//OR
$(div).load('/load/index.html');

将导致铬控制台上的那种信息。

扫码关注云+社区