将id值从css类提取到javascript变量

我有一个ul菜单，我想从中检索某些信息：

<ul id="form_builder_sortable" class="sortable rightDiv session1">
    <li class="draggable ui-state-highlight item id10" name="Maths">Maths<button onclick="deleteElement(event)" class="delbtn">&times</button></li>
</ul>

我有一个javascript函数：

function getSessionDatas()
{
    var sessions = [];
    $('.rightDiv').each(function(index)
    {
        var session = $.trim($(this).text().slice(0, -1)).split("×");
        var sessionData = [];
        for (var i = 0; i < session.length; i++)
        {
            var s = {
                subjectOrder: i,
                subjectID: subs[session[i]]
            };
            sessionData.push(s);
        }
        var ses = {
            sessionNo: index,
            sessionData: sessionData
        };
        sessions.push(ses);
    });
}

在这里：

---

我想根据项目的类别分配主题id，在本例中，类别中有一个id10。在这种情况下，如何将subjectID指定为10？

我建议您使用data-*前缀自定义属性，该属性可以使用方法检索

$'.rightDiv li'.eachfunctionindex{ var id=$this.data'id' console.logid }; 数学与时代 英语与时代

---

您可以获取li元素的类，并找到与idXX匹配的类

var regexId = /id([0-9]+)/gi
$('.rightDiv').each(function( index ) {
 //do some stuff
  $(this).find("li").each(function(){
      var classes = $(this).classes.split(/\s+/); // get the classes in an array
      for(var c in classes){
        c = classes[c]; //one classe
        var regexExec = regexId.exec(c);
        if(regexExec  && regexExec.length > 1){
                var id = regexExec[1];
               //do your stuff with the id 
               break;
           }
      }
   }
}

---

虽然这不是一种特别好的方法，但只要能够预测特定的模式，就可以从元素的类中检索特定的类名。例如，在本例中，所需的类名以id字符串开头：

---

每个rightDiv中是否有多个li？在这种情况下将分配哪个id值？@gurvinder372是的，将有多个li，id值将不同。它将是中主体的iddatabase@DaniM每个li是否具有不同的id值？如果是这样，将数据id属性添加到li而不是ul，原则上这将起作用-只是一个小小的更改。感谢您的努力，我不得不接受另一个答案，但这也非常好：谢谢David，感谢您花了这么多时间。我接受了上面的答案，因为它更容易让我理解，再次感谢！我认为应该是document.querySelector'form\u builder\u sortable>li:first child'，'id'次要语法error@Satpal：你当然完全正确；谢谢，这就是通过电话回答的结果…>。

var regexId = /id([0-9]+)/gi
$('.rightDiv').each(function( index ) {
 //do some stuff
  $(this).find("li").each(function(){
      var classes = $(this).classes.split(/\s+/); // get the classes in an array
      for(var c in classes){
        c = classes[c]; //one classe
        var regexExec = regexId.exec(c);
        if(regexExec  && regexExec.length > 1){
                var id = regexExec[1];
               //do your stuff with the id 
               break;
           }
      }
   }
}

// elem:   a single node reference, the element from which
//         you want to retrieve a specific class-name;
// prefix: String, the string with which the required
//         class-name(s) begins.
function retrieveClassByPrefix(elem, prefix) {

  // either elem, or prefix, are undefined or otherwise
  // falsey we quit here:
  if (!elem || !prefix) {
    return false;
  }

  // otherwise we convert the classList of the element into
  // an Array, using Array.from() on the result returned from
  // elem.classList, and then use Array.prototype.filter()
  // to filter the Array:
  return allClasses = Array.from(elem.classList).filter(

    // currentClass - using an Arrow function - is a reference
    // to the current class-name of the Array of class-names over
    // which we're iterating; if the currentClass String begins
    // with the supplied String ('prefix') then that class-name
    // is retained in the Array:
    currentClass => currentClass.startsWith(prefix)
  );

}

let idClassName = retrieveClassByPrefix(
  document.querySelector('#form_builder_sortable > li:first-child'), 'id'
);