javascript - 没有jquery的ajax请求头

Question

我创建了以下 JavaScript 函数来加载车辆的图像，或者加载备用图像（如果它不可用）。问题是这个页面是 1kb，同时它必须为这个功能加载整个 85+kb 的 jquery 库。所以我的问题是，有没有什么方法可以在不加载 jQuery 库的情况下完成同样的任务？

function GetImages() {
var Query = location.search;
//If query exists
if ((Query != "") && (Query != "?")){
var chunks = Query.split("=");
//If passed the right parameter
if (chunks[0] == "?unit") {
    var Unit = chunks[1];
    for (var i=1; i<11; i++) {
        var unitimageURL = "/pics/"+Unit+"-"+i+".png";
        $.ajax({
            type: 'HEAD',
            url: unitimageURL,
            async: false,

            success: function() {
                $('.pictures').append("<img src="+unitimageURL+" width=150 height=90 alt='Unit "+Unit+" Picture "+i+"'>&nbsp;");
                if ((i == 4) || (i ==8)) {
                $('.pictures').append("<br>");
                }

            },
            error: function() {

                $('.pictures').append("<img src=nopic2.png width=150 height=90 alt='Unit "+Unit+" Picture "+i+"'>&nbsp;");
                if ((i == 4) || (i ==8)) {
                $('.pictures').append("<br>");
                }
            }
        });
    }

}
}
else {
alert("No query");
}
}

Answer 1

是的，有一种方法——古老的好var oRequest = new XMLHttpRequest();方法！不要忘记设置所有需要的回调，检查响应状态，一切都会好起来的。要创建 HEAD 请求，只需将“HEAD”指定为.open()方法的参数。

您还需要document.createElement()将结果附加到您的页面（或者您也可以使用.innerHTML属性。

此外，像http://www.tutorialspoint.com/ajax/what_is_xmlhttprequest.htm这样的文档可能会很方便。