我有一个链接：<a href="http://www.example.com">Hello</a>。
当有人点击链接时，我想通过 JavaScript 检查 href 属性指向的页面是否存在。如果页面存在，浏览器将重定向到该页面（本例中为“www.example.com”），但如果该页面不存在，浏览器应重定向到另一个 URL。
【问题讨论】：
标签： javascript hyperlink
这取决于页面是否存在于同一个域中。如果您试图确定外部域上的页面是否存在，它将无法工作——浏览器安全性会阻止跨域调用（同源策略）。
如果它是在同一个域上但是，你可以像 Buh Buh 建议的那样使用 jQuery。尽管我建议执行 HEAD 请求而不是 GET 请求，但默认的 $.ajax() 方法会执行 - $.ajax() 方法将下载整个页面。执行 HEAD 请求只会返回标题并指示页面是否存在（响应代码 200 - 299）或不存在（响应代码 400 - 499）。示例：
$.ajax({
type: 'HEAD',
url: 'http://yoursite.com/page.html',
success: function() {
// page exists
},
error: function() {
// page does not exist
}
});
【讨论】：
一个很好的解决方法是代理。如果您无权访问服务器端，则可以使用 YQL。访问：http://developer.yahoo.com/yql/console/
从那里您可以执行以下操作：select * from htmlstring where url="http://google.com"。您可以使用他们在该页面上的“REST 查询”作为代码的起点。
这里有一些代码可以接受完整的 URL 并使用 YQL 来检测该页面是否存在：
function isURLReal(fullyQualifiedURL) {
var URL = encodeURIComponent(fullyQualifiedURL),
dfd = $.Deferred(),
checkURLPromise = $.getJSON('http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20htmlstring%20where%20url%3D%22' + URL + '%22&format=json');
checkURLPromise
.done(function(response) {
// results should be null if the page 404s or the domain doesn't work
if (response.query.results) {
dfd.resolve(true);
} else {
dfd.reject(false);
}
})
.fail(function() {
dfd.reject('failed');
});
return dfd.promise();
}
// usage
isURLReal('http://google.com')
.done(function(result) {
// yes, or request succeded
})
.fail(function(result) {
// no, or request failed
});
看起来 Yahoo 已弃用“从 html 中选择 *”，尽管“从 htmlstring 中选择 *”确实有效。
【讨论】：
基于 XMLHttpRequest 的文档：
function returnStatus(req, status) {
//console.log(req);
if(status == 200) {
console.log("The url is available");
// send an event
}
else {
console.log("The url returned status code " + status);
// send a different event
}
}
function fetchStatus(address) {
var client = new XMLHttpRequest();
client.onreadystatechange = function() {
// in case of network errors this might not give reliable results
if(this.readyState == 4)
returnStatus(this, this.status);
}
client.open("HEAD", address);
client.send();
}
fetchStatus("/");
但这仅适用于与当前 URL 位于同一域中的 URL。您希望能够 ping 外部服务吗？如果是这样，您可以在服务器上创建一个简单的脚本来为您完成工作，然后使用 javascript 来调用它。
【讨论】：
如果在同一个域中，可以用 xmlhttprequest 对象 [ajax] 发起头部请求并检查状态码。
如果它在另一个域中，则向服务器发出 xmlhttprequest 并让它进行调用以查看它是否已启动。
【讨论】：
为什么不在网络服务器上创建一个自定义的 404 处理程序？这可能是更“好熊”的方式。
【讨论】：
如果你乐于使用 jQuery，你可以做这样的事情。 当页面加载时，对每个链接进行 ajax 调用。然后只需替换所有失败的链接的href。
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script type="text/javascript">
<!--
$.fn.checkPageExists = function(defaultUrl){
$.each(this, function(){
var $link = $(this);
$.ajax({
url: $link.attr("href"),
error: function(){
$link.attr("href", defaultUrl);
}
});
});
};
$(document).ready(function(){
$("a").checkPageExists("default.html");
});
//-->
</script>
【讨论】：
HREF 指向外部域，所有链接都将获得其他页面地址。
$.ajax({
url: "http://something/whatever.docx",
method: "HEAD",
statusCode: {
404: function () {
alert('not found');
},
200: function() {
alert("foundfile exists");
}
}
});
【讨论】：
由于同源政策，您将无法使用 ajax 调用来 ping 网站。 最好的方法是使用图像，如果您知道您正在调用的网站有一个 favicon 或某种图标可以抓取，您可以使用 html 图像标签并使用 onerror 事件。
例子：
function pingImgOnWebsite(url) {
var img = document.createElement('img');
img.style.visibility = 'hidden';
img.style.position = 'fixed';
img.src = url;
img.onerror = continueBtn; // What to do on error function
document.body.appendChild(img);
}
【讨论】：
另一种方法是使用 PHP。
你可以添加
<?php
if (file_exists('/index.php'))
{
$url = '/index.php';
} else {
$url = '/notindex.php';
}
?>
然后
<a href="<?php echo $url; ?>Link</a>
【讨论】：
how to check... using *JavaScript* - 不是 PHP。不是 ASP.NET - JavaScript。代码可能是正确的，但与这个问题无关..