通过jquery动态隐藏id

Hide id dynamically by jquery

本文关键字：id 隐藏 动态 jquery 通过      更新时间：2023-09-26

我有三个3div 

<div id= "product_1"></div>
<div id= "product_2"></div>
<div id= "product_3"></div>
<div id= "product_4"></div>
<div id= "product_5"></div>

我正在动态地改变id 

var hotelCode = "CUNMXHIDD,CUNMXMAYA,CUNMXDSAN"
var splittedHotelCode = hotelCode.toString().split(',');
jQuery.each(splittedHotelCode, function(i, hotelCode) {
 $("#product_"+ i).attr("id","product_"+ hotelCode);
});

在此之后，我想隐藏未被索引的div product_4和product_5

现在DOM是

<div id= "product_CUNMXHIDD"></div>
<div id= "product_CUNMXMAYA"></div>
<div id= "product_CUNMXDSAN"></div>
<div id= "product_4"></div>
<div id= "product_5"></div>

我不想硬编码。是否可以通过Jquery隐藏它们

可以使用数组的length和slice方法。

$('div[id^=product]').slice(splittedHotelCode.length).hide();
  1. 跟踪索引以保留最后一个索引
  2. 使用:gt()选择并隐藏所有id以product_
    3. 开头的元素
var hotelCode = CUNMXHIDD,CUNMXMAYA,CUNMXDSAN
var splittedHotelCode = hotelCode.toString().split(',');
var lastIndex = 0;
jQuery.each(splittedHotelCode, function(i, hotelCode) {
 $("#product_"+ i).attr("id","product_"+ hotelCode);
 lastIndex = i;
});
$('[id^="product_"]:gt('+lastIndex+')').hide();
相关文章：