html 使用JSON获取Gravatar图像//演示：http：//jsfiddle.net/eqpdd5c5/ // Gravatar配置文件：https：//en.gravatar.com/zu

Posted

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了html 使用JSON获取Gravatar图像//演示：http：//jsfiddle.net/eqpdd5c5/ // Gravatar配置文件：https：//en.gravatar.com/zu相关的知识，希望对你有一定的参考价值。

<head>
<script>
    function getData() {
        var json = {
            "entry": [{
                "id": "11014108",
                    "hash": "9db0054df76cc4b80888ff713527a652",
                    "requestHash": "zulhfreelancer",
                    "profileUrl": "http:\/\/gravatar.com\/zulhfreelancer",
                    "preferredUsername": "zulhfreelancer",
                    "thumbnailUrl": "http:\/\/0.gravatar.com\/avatar\/9db0054df76cc4b80888ff713527a652",
                    "photos": [{
                    "value": "http:\/\/0.gravatar.com\/avatar\/9db0054df76cc4b80888ff713527a652",
                        "type": "thumbnail"
                }],
                    "name": {
                    "givenName": "Zulhilmi",
                        "familyName": "Zainudin",
                        "formatted": "Zulhilmi Zainudin"
                },
                    "displayName": "Zulhilmi Zainudin",
                    "aboutMe": "Pereka grafik &amp;amp; pembangun laman web. Mempunyai kepakaran di dalam bidang rekaan grafik dan pembangunan laman web berasaskan sistem WordPress. Pengasas projek Bina Blog Dot Com Sendiri.",
                    "currentLocation": "Kuantan, Malaysia",
                    "urls": [{
                    "value": "http:\/\/www.binablogdotcomsendiri.com\/",
                        "title": "Bina Blog Dot Com Sendiri"
                }, {
                    "value": "http:\/\/www.binablogdotcomsendiri.com\/blog\/",
                        "title": "Bina Blog Dot Com Sendiri"
                }, {
                    "value": "http:\/\/zulhilmizainudin.com\/live\/",
                        "title": "Personal Blog"
                }]
            }]
        }

        // get thumbnailUrl from the JSON
        var thumbnailUrl = json.entry[0].thumbnailUrl;

        // construct image URL
        var imgUrl = '<img src="' + thumbnailUrl + '">';

        // put data into div id #img
        var imgDiv = document.getElementById("img");
        imgDiv.innerHTML = imgUrl;

        // construct image URL custom size
        var imgSize = 200; // change image size here
        var imgUrlcustomsize = '<img src="' + thumbnailUrl + '?s=' + imgSize + '">';

        // put data into div id #imgcustomsize
        var imgDivcustomsize = document.getElementById("imgcustomsize");
        imgDivcustomsize.innerHTML = imgUrlcustomsize;

    }
</script>
</head>
<body onload="getData()">
    <div id="img"></div>
    <br>
    <div id="imgcustomsize"></div>
</body>

以上是关于html 使用JSON获取Gravatar图像//演示：http：//jsfiddle.net/eqpdd5c5/ // Gravatar配置文件：https：//en.gravatar.com/zu的主要内容，如果未能解决你的问题，请参考以下文章

PHP 获取Gravatar图像

Gravatar json配置文件请求403被禁止

Gravatar 不再在 https 上工作

Gravatar：有默认图片吗？

css Gravatar作为全屏背景图像

使用gravatar生成头像