创建唯一ID并在html中分配它们以供使用Javascript

时间:2017-07-16 05:35:19

标签: javascript

我目前正在尝试在html中创建唯一的ID。 但是,我不确定下面的代码是否正在创建unqiue id并在html中分配给元素本身或仅创建unqiue id。 请帮帮我。如果没有在html中分配它们,我该怎么做呢?

var abcElements = document.querySelectorAll('.like');

    for (var i = 0; i < abcElements.length; i++){

    abcElements[i].id = 'like_' + i;
    alert(abcElements[i].id);
}

更新: 我在

中包含了所有相关代码
<td><a onclick="return confirm(this)"><input class="switch" data-toggle="toggle" data-on="like" data-off="unlike" data-onstyle="danger" data-width="90" data-height="30" type="checkbox"></a></td>

    <td style="display:none;"><div class="like">${like}</div></td>

的Javascript

var abcElements = document.querySelectorAll('.switch');
                     var status = document.querySelectorAll('.like');
                     alert(status.length);
                       for (var i = 0; i < abcElements.length; i++) 
                       {

                            abcElements[i].id = 'switch_' + i;
                            alert(abcElements[i].id);

                            for (var j = 0; j < status.length; j++) 
                            {
                                status[j].id = 'like_' + j;

                                var statusText = $('#'+status[j].id+'').html();
                                alert(statusText);
                                if(statusText == 'true' )
                                { 
                              $('#'+abcElements[i].id+'').bootstrapToggle('on'); 
                                } 


                            }

                        }  

2 个答案:

答案 0 :(得分:0)

根据您的代码,我认为这是您想要的?

$("table tr").each(function(row) {
  var $row = $(this);
  var statusText = $row.find(".like").html();
  console.log("status: " + statusText);
  if (statusText == "true") {
    // $row.find("input.switch").bootstrapToggle('on');
    $row.find("input.switch").prop("checked", ($row.find(".like").html() === "true"));
  }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<table>
  <tr>
    <td>
      <span><input class="switch" type="checkbox">switch 1</span>
    </td>
    <td style="display:none;">
      <div class="like">false</div>
    </td>
  </tr>
  <tr>
    <td>
      <span><input class="switch" type="checkbox">switch 2</span>
    </td>
    <td style="display:none;">
      <div class="like">true</div>
    </td>
  </tr>
</table>

答案 1 :(得分:0)

我意识到我正在为各个div分配id。我只需将其中一个循环移到外面即可。