将 body 的背景设置为随机 google 图片

Question

如您所见，我有这段代码，我想运行搜索我 select 的 keyword，在本例中是 "mountains"。

这段代码的作用是 -> 它搜索给定 keyword 的图像 -> 然后检查它接收到的数据中的随机图像 -> 然后将背景图像设置为随机图像图片。

但是当我运行这段代码时，它似乎没有给我想要的结果。

<html>
<head>
    <title></title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
    <script type="text/javascript">

    var keyword = "mountains";

    $(document).ready(function(){

        $.getJSON("http://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=?",
        {
            tags: keyword,
            tagmode: "any",
            format: "json"
        },
        function(data) {
            var rnd = Math.floor(Math.random() * data.items.length);

            var image_src = data.items[rnd]['media']['m'].replace("_m", "_b");

            $('body').css('background-image', "url('" + image_src + "')");

        });

    });
    </script>
</head>
<body>

</body>
</html>

所以我的问题是：我可以将 api.flickr.com 更改为 google 搜索 api，以便我的图片搜索结果得到改进并设置为背景吗？

如果，那又怎样？

已经感谢您的支持！

Answer 1

这是你要求的

Example

但在运行此代码段之前，首先在 Google 上为此创建一个 API 键和一个自定义搜索引擎，您将需要它的 ID。此外，在您创建自定义引擎后，您需要启用 "Image search" 选项。

将var API_KEY = "your_api_key"替换为Google

提供的密钥

和var ENGINE_ID = "your_engine_id"也使用Google提供的id。

链接如下：

API 控制台

Google API console

自定义搜索引擎

https://cse.google.com/all

将 body 的背景设置为随机 google 图片

set background of the body to a randomized google image

javascript

jquery

google-search-api