Question

我正在尝试编写javascript，将所有链接转换为页面上的文档（PDF，DOC等），以在链接左侧显示链接到该页面的Google Docs查看器的图标。

为此，我使用了this userscript的来源。修改后的来源如下：

(function(){
var docLinks = document.links;
var fileTypes1 = ["doc","pdf","docx","xls","xlsx","ppt","pps","pptx","eps","ps","tif","tiff","ai","psd","pages","dxf","ttf","xps","odt","odp","rtf","csv","ods","wpd","sxi","sxc","sxw","zip","rar"];
var doCheck = true;
var dov_host =/(docs\.google\.com|sourceforge\.net|adf\.ly|mediafire\.com|springerlink\.com|ziddu\.com|ieee\.org|issuu\.com|asaha\.com|office\.live\.com|facebook\.com|[a-z]+\.wikipedia\.org)$/;

checkLinks();
setupListener();

function checkLinks()
{
    var supportedFileFormat=0;
    for (var i = 0; i < docLinks.length; ++i) 
    {
        supportedFileFormat=0;
        if (!((docLinks[i].host).match(dov_host)) && !docLinks[i].docView)
        {
            for (var i2 = 0; i2 < fileTypes1.length; i2++) {
                var url = stripQuery(docLinks[i]);
                url=url.toLowerCase();
                if (endsWith(url, '.' + fileTypes1[i2]))
                {
                    changeLink(docLinks[i], 1, fileTypes1[i2]);
                    break;
                }
            }
        }
        docLinks[i].docView=true;
    }
}


    function endsWith(str, suffix) 
{
    return str.indexOf(suffix, str.length - suffix.length) !== -1;
}

function changeLink(link, fileTypeCategory, fileExtension)
{
    var viewLink = document.createElement('a');
    if(fileTypeCategory)
    {
        viewLink.href = "https://docs.google.com/viewer?url="+encodeURI(link);
    }
    viewLink.title="View " + fileExtension.toUpperCase();
    var icon = document.createElement("img");
    if (fileExtension === "zip" || fileExtension === "rar")
    {
        icon.src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABYAAAAWCAYAAADEtGw7AAAAAXNSR0IArs4c6QAAAAZiS0dEAP8A/wD/oL2nkwAAAapJREFUOMvVlT9u1EAUhz/bs/baqzWLIlAQEhWXoKBBKUPHEXIERIE4Aceg5QSIE6TiAKGgoiAIWG2w45l58yhMQogzxsufgteMNG/m937zvScN/G+RABy+fH4/pPoa1SJ2ME0zAEKQETFtFH1w79HTQwPQ2c2TxXJZzMsyeinL+5y37TCp/XLatlVzcvIMeJi8evF4YZwcr27eLtM0iQoX1QqA7uuXK/MKhBBYH79v/Sy7YWS92U/zuRMvpVwor5fczMoUAGvdKNvgg5Om2Te2aw/yRV1b6y6oXVIFlJ6x+y6sMc4mr+3m84Epl9f3dnbvkJdLTF5iiorM5D+1NwEWq1uQJNQ7u5wDSxIURewp4lq8bXFdg/huzxRVTVVlQAOuwdmPXPXYYt4Xaz8djY5YPoOiuoYREZwb54YqIn0HvBtHASAiGBF/fnhI9kd8ePcmOmZDYY8JUxzHHhJRDmeOnXeTnEwtJ+Ix4mWAIn5l2qb4M8fOMxnghOgdyzaOdaJwjPFWLIaJXzrW6f2KOfag+gdzsCVj/c1ivWMf3jbrzd2//DEd/bM/7xs/1vtqqeVVjgAAAABJRU5ErkJggg==";
    }
    else if (fileExtension === "xls" || fileExtension === "xlsx" || fileExtension === "ods" || fileExtension === "csv" || fileExtension === "sxc")
    {
        icon.src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABYAAAAWCAYAAADEtGw7AAAAAXNSR0IArs4c6QAAAAZiS0dEAP8A/wD/oL2nkwAAAlhJREFUOMu9k8trE1EUxr/JLSadUGLpwug2iKAx4iJZZIyu/QOycNlVV4JZKAgm6couxBDcuHChFHcqBR810IXaMEk3aU1r6yugtT5hQsDUZKYzd66LJNM7eUwIiAeGuWfOOb85850zAtpWLBYZRjBCyAaAC5FIZLNfXOgcZFlm4XB4KJAxBkVR0Gw2Ua1WG4ZhzEiSdL87b4wvME0TqqoOhf+u13HY7wdjTFQU5U6hUDgajUbTA8GdezKZdASrqopsNgufzwdVVT2NRuOKLMs+SZIu9YBN0wRjzHrB1cvTAIC5G3cxN33Mgn74quCg6Mb4uAeEEGiaBsMwPABm8vn8aiwWm+/pmAfvaXULRne/Wee68gNThyax9egiBMGF2y+BeDwOr9froZTeAzDf03GnawC4eeuhBbv2YJcTYgKAAYC0pi8AgUAAuq6jVqsJfTXmO54933o++xxIp/fnsr62jNDpsyCkBU6lUhBFEW63G5VKBUPB5Y/f25EjKK++sgq2P21ZOYIg2IbqcrnQd3idCwCC/gkAwEIFCJ46Az6P9xcev4Cu6yCEWLWOHZvaHrpX0cnnax3XrbxTbUemsL62bBV8+fx2IHhgx/xWBCcPAACe/rRLwRiz+U8W8z21/08K/q1vfu3/IBuv85wU7/qC+cE7SyG2VmfxD3AiJNkgvP8sJztL0T08QdNHlmJgx5RSK7hZa2tM7FLsbL+3ATpNUUoHD4//nNAYbW0FA46fjNpAvJ9bWhkuBR+8zs5ZSZlMxgbOLa2MPjwASCQSGNUc97hUKuFf2V/eJ+rGq5ffUwAAAABJRU5ErkJggg==";
    }
    else if (fileExtension === "ppt" || fileExtension === "pps" || fileExtension === "pptx" ||  fileExtension === "odp" || fileExtension === "sxi")
    {
        icon.src = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABYAAAAWCAYAAADEtGw7AAAAAXNSR0IArs4c6QAAAAZiS0dEAP8A/wD/oL2nkwAAAu5JREFUOMvdlM9PE1EQx7/z3tvXxbJtKaAXCSqYeNDERkyIEoN6MCJ6IQZjwsGDhoQYD95MPHrzygnCzb/AM+GgieGHeNAQU3+0FaEJWiE+fvQtu/s8uK2Utvjj6EsmeZud+ezMd2YW+G/P0NBQ9PrgwPif+lPpMjo6Oi6lFPUcgyCwVle/dTc3tzyr5+O6rhoZGbkLAGWQlLK/q6vrwB8kc6Tei7m5uc8AKsFKqdj8/DyIyPyLVMYYKKXipecyuLGx8XZnZ+eEMUYaYyCEgJQSQghwzsE5BxGBMQYiKt8BgDGGtbW1zdnZ2ZtVYNu2c47jmEQigWg0CpHPg7JZGKVAnANNTTAdHUBzM7TWUErBmJ/FJRIJAAhs285VgQEgmUyaGOegBw9AmczPEhmAgEAwABGCVArs/n1YlvVrAoiqpKkAExEKr19DZrNIRPch6PWACxJvFo9gPtsNs1HEwdkpnP7+Hetal+Mcx/k92LMs5FdXoY4W0HDZhetGEG35AJ7O4FFhEFd5E04Rwff9isbtCeacB62pFJYHBrC5NgWx/gZbfhHrGxq+TuJY8StSZ0+gIRaDEWJnHDjnQV2wMUZwznFyeBha34JSCnJ7A0mHcGXQwQ3HgRACrutWZLx72SrAvu8TANJaI5/PV/lvbysopWrOcDwer0pS7NA3VtJZSvlXy1GaCsZYQz2NKRKJoLW19a/AUsrS4sia4HQ6jba2tq2dXTbG+EQUGGPI87yIZVnF3WClFOVyOaumFFrr55lMpjsTLsbus7KycuDdx/TY2e6ea4wx7XneZg1Jlmt2clfHePhh0dt75lBTy/6HgrFeve0+fjnzamJpaWkDgAfAB2D2HJEQJkuWSh1vb2s/fA8E51NmcWxhYeFjz7meS/FYbKDo6qczL2aeFAqFdQBuaH49MAGIhGCrr7/vTuFL4eX09PR7AKz0z7dt25y/eK7fLfpvJycnp0Oo3pk57dFsFlbAw3sZHJofWlAr+Adp9B0P+gw3HwAAAABJRU5ErkJggg==";
    }
    else if (fileExtension === "tif" || fileExtension === "tiff" || fileExtension === "dxf")
    {
        icon.src = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABYAAAAWCAYAAADEtGw7AAAAAXNSR0IArs4c6QAAAAZiS0dEAP8A/wD/oL2nkwAAAQtJREFUOMvVVUuOhSAQrIaOizmPB3DjjV270XgB995jRuiazWh8fvDpuHkkJECni6IoGuDTmlRV9e2cCySzp0BJmoqIK8vyy3sPkiA5BW+Pm6YJCgDOOeR5jizLoKrr3QEA4zgihHDKtq5rAIAuk4uiAEnEGOduZogxQkTm8V43MwzDMGPp8hje+xlEROCcA0mIyCHYcr6U4wU4hJBMPFpbA5PcAqcSzzbbZQzgbaCj+KkUd1jHGF9cpABgZhs33GH+r8s7c4WZpYGvOuLy5V2x30bjIykedUUKaB1/6+UBQN/3yQKjqvDeb2vvXwnYlaJt22Q5XM6P1ifLAoCStK7rwmM/h8jPRPiz2i+SVyUPSyFlKgAAAABJRU5ErkJggg==";
    }
    else if (fileExtension === "pdf")
    {
        icon.src = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABYAAAAWCAYAAADEtGw7AAAAAXNSR0IArs4c6QAAAAZiS0dEAP8A/wD/oL2nkwAABCFJREFUOMuFlW2IVFUYx3/nvszMvXtn32YXDbUyA11bSd3R1toP4ZcyUQj6sJ+EygQLgiKCqC8RQkEUYRKICWYvsoH2Laks6D1fKsOVSGv9Erbtzs7s7MydmXvPSx9md2bHHenA4R4O9/x4zvP8/88RzI8/tq01C2sE7ZaNkdzxMOHGe0rxld/3bHj2hVNtfmmeGx9ea2478BZYAmG14owxoA04LqmNWa5MXCOdyTD9z3XM2W+PbHrymSduBDsLC6kFQmhKn3yIcGyEZTWgRipwU3Tuf554ZhrGL9KxYxdRb4bclpG9F44dGdy85/F7hRCNW1uLwRiN7adwAg8n7eN0duAEHu7yZXQ+/SKiq4fCO69j9WbwfZ8gCAiCAL3+7uELHxwfHxsbs9uAQRiNnUpg+ynctI+b9kisXoP32HMQpCm/+wZxIcf1ag3HcUin0wRBgOu6mLUDA7cLPluaCiMwSoJlIWwL4bqIwa0wtB2jJKXjB5ma+JNCKUQ6LidPngQgvHyJuXM/sWZ4G5ns1u3nz5/3s9ls2ADHGkwUYWKJzvRj3b8bvepOwulJZk4cZu7aBLIaYbSgb+Uq+ubPVacnmQ1LpIRF6bUDJF551V5SvHLQTem+nZg71hHFMbVzPxB/OobO59GxxEQS46bqKlkYiSTCGPq9FH9PzzAyMjK3JBWV1eso5HIwk0P9/CPq3DdoGYPUGCXRsUJ0dKG1bkoxkcBog4qiFtU7i4snJ69TPXMaffkiplJZOIpRGqM1RoOFaI3YTWC0xoljYi3a67jyxWmi779eajcDRps6UNgtYLunh27LwVcaqWkfsT88gjN+iSg3tZgJxmDm4ZawcV2XZDKJ53n4t65iyvMolst1L9wIjo0gM7SFzoH1lN87SvTd12hj0Kbha4QxJHozdK5Y0XKhSm8fUSlEmia4xXm1X39BhRW8R/eR3P0IJtYIqRFS1QsYa4ztorVuzCiKmOnuwVRrxDdLxdyJj6hNTOCPjpLauQttWZTfP95sRAa0pkUVk5OTiP5lBFevonS7iI1AhVVkqUzxyFGKh94m8cAOkg/tQkUSFan6V6p6YzKGYrFIGIZkBtZhVWPiRWJp6RWyXKkDYkn58zPMHTuGNzqKsynbhMcSrTVSSnK5HLZt0ze0GVWttRTPalpaIMPqougUcx+fIvzyK4Kn9kNPpg41Aq01+XyeKIro7u6GZJJ42fL2YKkhLoXNK8/P/JsHUbNF0vv2oiKFcV2UUhQKBZLJJL7v1/M/eFeLjltyXC5XqcSKaqSozc9KqcrUocO42c2owQ1UYs3s7CxKKbq6uhrq6MhuIjY3cd7UXA3LSi4x3szZ3wiu/oW380HyFy8TFYt4nkcq1WxIqZW3tETcYLzcP2RaNv7nQW37cAIv/XtBAPwHt7pWqMK3XG0AAAAASUVORK5CYII=";
    }
    else
    {
        icon.src = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABYAAAAWCAYAAADEtGw7AAAAAXNSR0IArs4c6QAAAAZiS0dEAP8A/wD/oL2nkwAAAxJJREFUOMu1lT1rI1cUhp/51jjyDpGyxCxGYHATcGPjJrYhdpkulf9E2vyB/IN0IVvmJ2yR3sRR5WIJhDWGLbwYBYQtxfpAM/fjnBSylBh5vKTIhYHLcN9zn3nfc+/A/zSCxeT3N6+/SoixzeakWt8aPieaTCYfTk5O3EcL//Hm9df58P0v8fq6+vWXdvz5l9M6gXMuNcbceu+/OTw8fFu3LgYQJ3nYyPTTrXagzU762cZWWicYDod47z/p9/u/drvdbw8ODn5+al0I4I1BrUPtBDFjvPe1j3OOdrtNq9VqRlH0Y7fb/a6W2HsPzoEqqgqqXF1d0ev1aLfb3N3dkWUZcRwzGAw4PT2lLEuMMWvT6fT78/Pz8dHR0U8rxHiPOoeqLIsnSUKe56RpSp7nNBoNsixDVel2uwwGA0SEKIrWgB/Ozs6+WCHGe8RY1FRIalER+v0+o9GI0Wj06BOjKKLX6zEcDul0OjSbTYwxgTFmF3j32IrKoMYgVYU2HKpKp9NhPB4DkGUZzjnieM6hqqRpyosXL1hbW2M8HrvZbMaTxFpZpCoRa0GVy8tLnKtv1ePjYwBEhCRJ5jmtFgaxc2JxjkCV3d1drLXEcYwx5rEojuchPwwRqesKh5p/iIN5KMtFeZ6viMuyJAxD0jRFRJ4m9sYglUGqEn1ou4uLi2etWGy4v7//iH7FYyqDlBFqLaEq29vbTCYT8jxnNpsRRRFhGGKtJcsykiSh3W6jqvXEeD8/eQ/EqsrNzQ2TyYQoilZEAM1mk1artfBYa4nVWigVjENE2NnZ+ejVKCIEQYCIrGQwL+zm7RaUHpxHVLm+vub29haAoii4v79/JCyKgjzP2dzcRFVrwvMeTEUwCxHrlkc6yzKAR/PFSJKEKIrQxf3ytBUgxhKWIM6jqgwGA6bT+bU8nU5XvC7Lkr29vSVtbXhSWagA4xERNjY2loWDICDLMqy1y85oNBpLX2uJvalQYwlLIXjoiqIoKIri2fAWBWs9Ni9fvXe//RVc38dY907+fPXW/Jcfp4g0gyC4/fe7vwHKzB9BstqVUgAAAABJRU5ErkJggg==";
    }
    icon.style.marginLeft = "3px";
    viewLink.appendChild(icon);
    viewLink.setAttribute("target", "_blank");
    link.parentNode.insertBefore(viewLink, link.nextSibling);
}

function setupListener()
{
    document.addEventListener('DOMNodeInserted',function(e)
    {
        if (doCheck)
        {
            doCheck = false;
            setTimeout(function(){checkLinks();doCheck = true;}, 1000);
        } 
  },false);
}

})();

但是，此脚本会在链接右侧添加图标，而不是左侧。我有什么方法可以做到这一点吗？

提前致谢，

Answer 1

尝试使用ViewLink.prepend(icon)代替ViewLink.appendChild(icon)

编辑：将viewLink.title="View " + fileExtension.toUpperCase();放在函数中的ViewLink.appendChild（icon）下面。

将图像放置到某些链接

1 个答案: