<ul class="sellerDetails sellerdetailsData " data-bind="attr: { id: 'sellerdetailsData-' + $index()}">
<li><span class="buyerprocess-sprite seller-name"></span>
<p class="leftfloat">
<span data-bind="attr: { id: 'seller-Person' + $index()}" class="seller-Person">
</span>
<br />
<span data-bind="attr: { id: 'seller-Name' + $index()}" class="seller-Name font13 text-light-grey">
</span>
</p>
</li>
<li><span class="buyerprocess-sprite seller-masking-no"></span>
<p class="leftfloat">
<span data-bind="attr: { id: 'seller-Contact' + $index()}" class="seller-Contact">
</span>
</p>
</li>
<li><span class="buyerprocess-sprite seller-email"></span>
<p class="leftfloat">
<span data-bind="attr: { id: 'seller-Email' + $index()}" class="seller-Email"></span>
</p>
</li>
<li><span class="buyerprocess-sprite seller-address"></span>
<p class="leftfloat">
<span data-bind="attr: { id: 'seller-Address' + $index()}" class="seller-Address">
</span>
</p>
<p>
<span class="font10 text-light-grey margin-left10">Your contact details have been shared
with the seller</span></p>
</li>
</ul>
我对这个 html 结构有一些疑问:
- 我们为每个 li 元素提供 ID。我们有20个这样的li元素。有人评论说,由于 ID 是全局存储的,这种方法会创建太多 ID,从而进一步妨碍 ID 查找。
- 如果我们不在每个 li 的每个元素级别使用 ID,而是通过类访问,它可以正常工作,但我觉得速度会更慢。
例如,如果我使用 ['seller-Person' + $index()] 单击 span,并且我必须访问 'seller-Name' + $index(),我们有两个选项:
- $('#seller-Name' + $(this).attr('id'))
- 或者 $(this).parents(.buyerprocess-sprite).find('.seller-Name')
我觉得第一个更清晰,应该更快。
我们如何决定哪种方法更好?
最佳答案
如果您使用 jquery,则可以通过 css 引用访问所有这些单独的 li 元素。这意味着您根本不需要使用 ID。
这是一个例子:
$("li:nth-child(2)").text("updated");
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul>
<li>one</li>
<li>two</li>
</ul>
关于javascript - 对多个 li 元素使用类与 id 示例 20 使用 knockout 和 jQuery,性能和可维护性哪个更好?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35332213/