html中如何用js来写一个判断，就像是java中的if一样。

如何用**js写一个判断语句**，当网页缩小到一定程度的时候让**a标签隐藏**。我自己的想法是**判断浏览器的宽度**，然后把**opacity变为0.0**，但是我现在不会自己写js，我还没学过js，而且这个东西比较急，所以拜托各位**大佬**了~~~

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
</head>
<style>
.im{
width:300px;
height:376px;
}
#a{
position: fixed;
left: 0;
top: 28%;
}
</style>
<body>
<a id="a" ><img src="../test.jpg" /></a>
</body>
<script>

</script>

</html>

初始效果

图片说明

想要在网页缩小的时候隐藏图片

图片说明

我给你提供两种方法，第一种只是用CSS3中的媒体查询，第二种用javascript，由于你不怎么会js，我都有注释，希望帮到你
第一种（CSS3媒体查询）：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        a {
            display: block;
            width: 300px;
            height: 300px;
            background: red;
        }
        @media all and (max-width: 600px) {
            a {
                display: none;
            }
        }
    </style>
</head>
<body>
    <a href="#"></a>
</body>
</html>

第二种（JavaScript方法）：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        a {
            display: block;
            width: 300px;
            height: 300px;
            background: red;
        }
    </style>
</head>
<body>
    <a href="#"></a>
    <script>
        window.onload = function() { // 页面加载完后执行以下函数
            let a = document.querySelector("a");
            window.onresize = function() { // 这个函数在浏览器的窗口大小改变时触发
                if(window.outerWidth < 600) { // 判断浏览器的窗口宽度是否小于600
                    a.style.display = "none";
                }
            }
        }
    </script>
</body>
</html>