使用javascript从Google图片中获取随机图片

htm*_*123 17 html javascript image

我对我的网站有这样的想法,每次访问该页面时,背景都会有所不同.我希望从Google图像中获取任何图片,并使用Javascript将其作为我网站的背景.

基本上每次刷新页面时,脚本都会从Google图像中获取随机图片并将其作为背景或者至少下载图片.

我该怎么做,或者甚至可能吗?

小智 23

它可以通过Google Images完成,但需要进行大量自定义,因此脚本的行为符合您的预期(包括设置延迟以处理速率限制; Google对API的每个搜索请求的速率限制为64项)这里是基本的使用Google Images api的示例:

<html>
<head>
    <title></title>
    <script src="https://www.google.com/jsapi"></script>
    <script type="text/javascript">
    google.load('search', '1');
    google.setOnLoadCallback(OnLoad);
    var search;

    //i suggest instead of this to make keywords list so first to pick random keyword than to do search and pick random image
    var keyword = 'mountains';

    function OnLoad()
    {
        search = new google.search.ImageSearch();

        search.setSearchCompleteCallback(this, searchComplete, null);

        search.execute(keyword);
    }

    function searchComplete()
    {
        if (search.results && search.results.length > 0)
        {
            var rnd = Math.floor(Math.random() * search.results.length);

            //you will probably use jQuery and something like: $('body').css('background-image', "url('" + search.results[rnd]['url'] + "')");
            document.body.style.backgroundImage = "url('" + search.results[rnd]['url'] + "')";
        }
    }
    </script>
</head>
<body>

</body>
</html>
Run Code Online (Sandbox Code Playgroud)

但是我可以建议:来自flickr的随机图像,这是另一个基本代码(天空是极限):

<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>
Run Code Online (Sandbox Code Playgroud)

  • 不再工作,因为响应“此 API 不再可用”。信息。 (3认同)