前言

之前有人对必应壁纸下手了，获取了必应壁纸的链接，将其用于博客背景上面，但是，刷新之后不能更换，这不就浪费了必应每日的六张壁纸图片吗？

前段时间有人做出了可以刷新更换的必应壁纸的JS代码，我将其经授权之后拿来使用，并且有所改动，但忘记了来源。

如果相关代码有侵权，请联系删除

$(document).ready(function () {
    /**
     * 获取Bing壁纸
     * 原先 YQL 已经无法提供服务了
     * 改用 JsonBird：https://bird.ioliu.cn/
     * 
     */
    var url = 'https://bird.ioliu.cn/v1/?url=https://www.bing.com/HPImageArchive.aspx?format=js&idx=0&n=8';
    var imgUrls = JSON.parse(sessionStorage.getItem("imgUrls"));
    var index = sessionStorage.getItem("index");
    var $back = $('#back');
    if(imgUrls == null){
        imgUrls = new Array();
        index = 0;        
        $.get(url,function (result) {
            images = result.images;
            for (let i = 0; i < images.length; i++) {
                const item = images[i];
                imgUrls.push(item.url);
            }
            var imgUrl = imgUrls[index];
            var url = "https://www.bing.com"+imgUrl;
            $back.css("background", "linear-gradient( rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5) ),url('"+url+"') center center no-repeat #666");
            $back.css("background-size", "cover");
            sessionStorage.setItem("imgUrls",JSON.stringify(imgUrls));
            sessionStorage.setItem("index",index);
            });
    }else{
        if(index == 7)
            index = 0;
        else
            index++;
        var imgUrl = imgUrls[index];
        var url = "https://www.bing.com"+imgUrl;
        $back.css("background", "linear-gradient( rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5) ),url('"+url+"') center center no-repeat #666");
        $back.css("background-size", "cover");
        sessionStorage.setItem("index",index);
    }
})
let tags = document.querySelectorAll("#tag_cloud-2 a");
let infos = document.querySelectorAll(".badge");
let colorArr = ["#428BCA", "#AEDCAE", "#ECA9A7", "#DA99FF", "#FFB380", "#D9B999"];
tags.forEach(tag => {
    tagsColor = colorArr[Math.floor(Math.random() * colorArr.length)];
    tag.style.backgroundColor = tagsColor;
});
infos.forEach(info => {
    infosColor = colorArr[Math.floor(Math.random() * colorArr.length)];
    info.style.backgroundColor = infosColor;
});

使用

如何使用呢？

将该代码引入网页，在网站的中插入以下代码

<div id="back" class="background-img"></div>

之后给该背景加一个CSS样式：

.background-img
{
    z-index: -3;  /*图层优先级*/
    position: fixed;  /*位置*/
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;  
    filter: blur(1px);  /*模糊度*/
}

这样就可以使用了

必应往期图片站

或许你想更多了解必应以往的壁纸图片，那么我在网上寻找以后发现这样一个网站，挺好的分享给大家：
必应每日高清壁纸 - 精彩，从这里开始

CSS插入其余背景

但是你不想使用必应壁纸，想使用别的图片作为壁纸，那怎么办？

插入以下代码：

body
{
    background-image:url('此处填写链接或者相对路径');
}

你还可以增加其余的参数，比如模糊度、位置等参数