Javascript 添加在jquery中不起作用的属性

当窗口大小小于768像素时，我需要使用jqueny向

元素添加
href
属性

        <ul class="menu-link">
            <!--<li><a class="" href="#">HOME</a></li>-->
            <li><a id="#about-us" >ABOUT US</a></li>
            <li><a id="#contact" >CONTACT</a></li>
        </ul>

jQuery(document).ready(function ($) {
      var windowSize = $(window).width(); // 
            if (windowSize < 768) {
                //add attr
                $("#about-us").attr("href", "#about-us");
                $("#contact").attr("href", "#contact");
    }
});


关于我们
接触

jQuery（文档）.ready（函数（$）{
var windowSize=$（window）.width（）；//
如果（窗口大小<768）{
//添加属性
$（“关于我们”）.attr（“href”，“关于我们”）；
$（“联系人”）.attr（“href”，“联系人”）；
}
});

它不起作用是因为某种原因吗？我是不是做错了什么来展示@pattmorter所指出的

HTML:


关于我们
接触


JS:

jQuery（文档）.ready（函数（$）{
var windowSize=$（window）.width（）；//
如果（窗口大小<768）{
//添加属性
$（“关于我们”）.attr（“href”，“关于我们”）；
$（“联系人”）.attr（“href”，“联系人”）；
}
});
首先，您需要从ids中删除
#
：

<li><a id="#about-us" >ABOUT US</a></li>
<li><a id="#contact" >CONTACT</a></li>

关于我们
接触

应该是

<li><a id="about-us" >ABOUT US</a></li>
<li><a id=contact" >CONTACT</a></li>

关于我们

---

您还有

id=“#关于我们”

和

id=“#联系”

。它应该是

id=“about us”

和

id=“contact”

为什么不使用媒体查询？使用媒体查询，我必须重复整个html代码两次。出于这个原因，我想使用jquery。“它不起作用是因为某些原因我做错了什么”是的，我确信这就是它不起作用的原因。谢谢，我刚刚犯了一个愚蠢的错误。。。没有注意到我正在添加

#

，带有

id=#关于我们

。。过度工作的压力…我想我们都经历过。。。干杯

<li><a id="#about-us" >ABOUT US</a></li>
<li><a id="#contact" >CONTACT</a></li>

<li><a id="about-us" >ABOUT US</a></li>
<li><a id=contact" >CONTACT</a></li>

$(function() {
  $(window).on('resize', function() {
    var add_remove = $(window).width() < 768; 
    $("#about-us").attr("href", add_remove ? "#about-us" : "");
    $("#contact").attr("href", add_remove ? "#contact" : "");
  });
  $(window).trigger('resize');
});