你能用CSS设置破碎的链接吗？

Question

是否可以使用不同的颜色为断开的链接（即，尝试链接到您网站上不存在的页面的链接）设置样式？例如。工作链接是蓝色的，断开的链接是红色的吗？

或者，如果不是CSS，是否可以通过JavaScript识别它们，然后再设置样式？ （jQuery不适用于我。）

Answer 1

参考您可能想查看此帖子：Javascript: Check if server is online?

您可以使用javascript检查网站是否已启动/关闭。使用此功能，您可以确定链接是否良好，并使用与不良链接不同的类显示链接。

Answer 2

不，你不能用CSS设置断开的链接。在某个代理尝试访问该链接之前，浏览器不知道链接是否已损坏。

你可以想象写一些Javascript，试图获取文档中每个链接的每个页面，然后，当某些链接失败时，它可以动态地将链接的样式更改为其他内容。但是，这可能是一个非常糟糕的主意，因为它可能会浪费大量带宽并浪费一些CPU（在移动设备上尤为重要）。

而且，更进一步的是某些链接到其他域，浏览器可能会禁止您的Javascript直接获取这些页面（同源安全限制），因此您可能甚至无法使用Javascript。< / p>

可扩展的系统可以让您的服务器在某个时间间隔（可能每隔几天）检查您在页面中使用的链接，将该信息保存在本地数据库中，然后您可以添加一个类在呈现页面时链接（服务器端），然后CSS规则可以不同地设置链接的样式。此外，服务器不受同源限制，因此您没有在服务器端执行此限制。确定离线时有很多问题需要注意，因为主机可能暂时停机，只能从互联网上的特定路线下降等等......

Answer 3

CSS本身无法识别链接是否损坏，没有。

但是，假设您有其他方法可以确定链接是否已损坏，是的，您可以向已损坏的类添加一个类，并为这些类提供一个独特的CSS样式，以便直观地指示它们。

如何自动确定断开的链接将是另一个问题，在网络上的各个地方都可以很好地覆盖。例如，在JS here和PHP here中。我强烈建议建立一个不会尝试确定每个访问者每次访问的每个链接的系统，而是一个可能每周检查一次网站上所有链接的系统，并更新网站上的链接以及额外的{{{ 1}}类附加到它们或类似的东西。