jquery 从动态元素中获取动态ID

sulc1iza  于 2023-05-06  发布在  jQuery
关注(0)|答案(3)|浏览(291)

我有一个动态ID的div元素。

<div id="parent">
    <div id="elmn1"></div>
    <div id="id-has-changed"></div>
    <div id="elmn3"></div>
    <div id="elmn4"></div>
    <div id="id-has-changed-by-user-from-input-field"></div>
</div>

所有元素id(#parent除外)都可以由用户从输入字段编辑,因此#parent的最后一个子元素可以由用户设置新的id。
我想检查id的最后一部分中具有最大数字(4)的元素,并想在下一个id中添加一个新元素。

var nextId = "elmn" + (numberOfLastElement + 1);
var newElmn = document.createElement("div");

newElmn.id = nextId;
document.getElementById("parent").appendChild(newElmn);

在这种特殊的情况下,新元素将具有id="elmn5"
我的问题是,如何获得numberOfLastElement

piztneat

piztneat1#

更新

Final version of Fiddle

var myEl = document.getElementById('parent').children;
var highest = null;
var idName= null;

if (myEl){

for (var ii=0;ii<myEl.length;ii++){
     
     var temp = myEl[ii].getAttribute('id');
    
    
    var intval = temp.match(/\d+/g)
     
    
    if (intval !=null){
        
        if(intval>highest){
            
         
            highest = intval;
            idName = temp;
        }
        
        
    }
  

  }

}

console.log(idName);

留下下面的代码查看历史信息

这是一个working JSFiddle

var myEl = document.getElementById('parent').children;
var count = 0;
      if (myEl) {
            var match = 'elmn';
            for (var ii = 0; ii < myEl.length; ii++) {
                var temp = myEl[ii].getAttribute('id');
                if (temp.indexOf(match) == 0) {
                    count++
                }
            }
        }
        alert('count is ' + count);
xmakbtuz

xmakbtuz2#

逻辑是这样的:
获取所有具有id="elmnx"的元素,其中x= 1,2等。$("[id*='elmn']")
干掉最后一个。last()
获取其ID。attr('id')
子字符串以获取末尾的数字。substring(4)
将其设置为int,以便您可以添加+1。parseInt()
尝试:

var numberOfLastElement=parseInt($("[id*='elmn']").last().attr('id').substring(4));
2w2cym1i

2w2cym1i3#

类似这样的情况,假设所有适用的ID都有elmn前缀:

function MaxElemNo() {
  var prefix = "elmn";
  var parent = document.getElementById("parent");
  var elements = parent.querySelectorAll("[id^='"+ prefix + "']");
  var lastElemNo = 0;
  for (var i=0; i<elements.length; i++) {
     var el = elements[i].id;
     var num = + el.substring(prefix.length, el.length);
     lastElemNo = Math.max(lastElemNo, num) 
  }
  return lastElemNo;  
}    
console.log(MaxElemNo());

JS Fiddle

相关问题