在js中无法获取多个id值为demo的问题

spark无与伦比

于 2018-08-14 17:50:21 发布

阅读量1k

点赞数

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/weixin_38420342/article/details/81671508

本文探讨了HTML和CSS在构建网页时的重要性和应用方法，详细解释了如何使用这两种技术来创建美观且功能丰富的网站。通过实例演示，读者可以深入理解如何通过HTML结构化网页内容，以及如何利用CSS样式提升用户体验。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

例如代码中：

<script>
$(document).ready(function(){
  $("#demo").hover(function(){
    $("h1").css("background-color","yellow");
    },function(){
    $("h1").css("background-color","pink");
  });
});
</script>
</head>
<body>
<div id="demo">
<h1>酷炫模板 全新体验电商轻松走入微信</h1>
</div>
     
<div id="demo">
<h1>二维码轻松一扫有效统计粉丝来源.</h1>
</div>
 
<div id="demo">
----------------------
</div>

无法让第二个id=demo的div中的内容改变，这是为什么呢？

原因如下：

一个页面中元素的ID要保持唯一，你可以用class，name等其他属性表示
比如用class=“demo”
$(document).ready(function(){
  $(".demo").hover(function(){
    $("h1").css("background-color","yellow");
    },function(){
    $("h1").css("background-color","pink");
  });
});