Javascript 在响应图像上显示/隐藏链接

我想知道如何根据浏览器的宽度显示或隐藏图像链接。例如，在桌面浏览器上不显示链接，只在智能手机上显示

我发现了第一种可能添加css类的方法：

 .nolink {pointer-events: none;
          cursor: default;}

在不应显示链接的每个@media屏幕上

但是你知道有没有其他方法可以做到这一点，而不是在每个@media屏幕中隐藏链接，只在最小宽度上添加一次

---

谢谢。

您将默认设置为文本，并将其更改为仅用于移动的链接

.nolink {
       pointer-events: none;
       cursor: default;
}

/* Smartphones (portrait and landscape) ----------- */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {


.nolink {
    /* Change back to default link style */
}

---

}

为什么不使用引导？他们已经有了预定义的类，比如隐藏的xs（不会在移动设备上显示）、隐藏的lg等。