Question

Repro步骤：

打开this link
在搜索栏右侧的放大镜上检查元素
查看某些属性是从名为default.css
在页面上查看来源
ctrl + F“deafult.css”
未找到短语
打开每个JavaScript文件来查找它（你不必费心去做。请相信我已经做过了。）

default.css在哪里？我知道它被发现here，但它在RMC的网站上被引用了哪些？

Answer 1

查看代码，我看到了班级名称.gsc-search-box，然后我对该班级名称进行了Google搜索并找到了此SO question。这导致我找到了Google自定义搜索框，您可以在此处详细了解： https://www.google.com/cse/

Answer 2

来自Googles Custom Search Engine CSS。

此产品的说明为located here

Answer 3

答案简短：

它来自this javascript file。

答案越长：

如果您查看Google Chrome开发者工具，您会看到以下“发起人”列：

enter image description here

如果将鼠标悬停在该网址上，您会看到以下内容：

google.(anonymous function).d   @    jsapi?autoload={"modules"%3A[{"name"%3A"search"%2C"version"%3A"1.0"%2C"callback"%3A"__gcse.scb"%2C"…:21
(anonymous function)            @    ?file=search&v=1.0&hl=en&async=2&style=https%3A%2F%2Fwww.google.com%2Fcse%2Fstyle%2Flook%2Fv2%2Fdef…:10

所以基本上它是由Google CSE的d函数加载的。

如果我们仔细观察，我们会看到：

google[z].d = function(a, b, c) {
            if (c) {
                var e;
                "script" == a ? (e = h.createElement("script"), e.type = "text/javascript", e.src = b) : "css" == a && (e = h.createElement("link"), e.type = "text/css", e.href = b, e.rel = "stylesheet");
                (a = h.getElementsByTagName("head")[0]) || (a = h.body.parentNode.appendChild(h.createElement("head")));
                a.appendChild(e)
            } else
                "script" == a ? h.write('<script src="' + b + '" type="text/javascript">\x3c/script>') : "css" == a && h.write('<link href="' + b + '" type="text/css" rel="stylesheet"></link>')
        };

将其添加到标题的位置。

如果我们查看(anonymous function)，我们会发现以下内容：

google.loader.writeLoadTag("css", "https://www.google.com/cse/style/look/v2/default.css", true);

它来自哪里。

但是CSE在哪里添加了？！

您正在查看的HTML页面的源代码：

<script>
  (function() {
    var cx = '018180480343835782597:0w0lu0vrv_i';
    var gcse = document.createElement('script');
    gcse.type = 'text/javascript';
    gcse.async = true;
    gcse.src = (document.location.protocol == 'https:' ? 'https:' : 'http:') +
        '//www.google.com/cse/cse.js?cx=' + cx;
    var s = document.getElementsByTagName('script')[0];
    s.parentNode.insertBefore(gcse, s);
  })();
</script>

这个CSS文件来自哪里？

3 个答案:

答案简短：

答案越长：