使用 Jquery 在页面加载时设置元素 ID？答案

【问题标题】：Set element ID on page load with Jquery?使用 Jquery 在页面加载时设置元素 ID？
【发布时间】：2013-12-05 11:16:02
【问题描述】：

假设我有一些这样的 HTML 元素：

<div id="wrapper">
    <ul>
        <li><a>Parent 1</a>
            <ul>
                 <li><a>Child 1</a></li>
                 <li><a>Child 2</a></li>
                 <li><a>Child 3</a></li>
            </ul>
        </li>
        <li><a>Parent 2</a>
            <ul>
                 <li><a>Child 1</a></li>
                 <li><a>Child 2</a></li>
                 <li><a>Child 3</a></li>
            </ul>
        </li>
    </ul>
</div>

当 $(document) 准备好时，如何为#wrapper 中的第一个 UL 元素设置 ID？？

提前致谢！

【问题讨论】：

标签： jquery set attr pageload document-ready

【解决方案1】：

试试:firstlike

$('#wrapper ul:first').attr('id', 'customeId');

或者你可以试试:eq(0)like

$('#wrapper ul:eq(0)').attr('id', 'customeId');

甚至（可能）你也可以试试.eq(0)like

$('#wrapper ul').eq(0).attr('id', 'customeId');

确保您在DOM 上准备好此脚本

$(document).ready(function(){
    $('#wrapper ul:first').attr('id', 'customeId');
});

请更正您的 html，因为它在关闭 ul 时会中断

【讨论】：

【解决方案2】：

像这样。

Live Demo

$(document).ready(function(){
    $('#wrapper ul:first').attr('id', 'yourid');
});

你的html也是无效的，你错过了结束的ul

<div id="wrapper">
    <ul>
        <li><a>Parent 1</a>
            <ul>
                 <li><a>Child 1</a></li>
                 <li><a>Child 2</a></li>
                 <li><a>Child 3</a></li>
            </ul>    
        </li>
        <li><a>Parent 2</a>
            <ul>
                 <li><a>Child 1</a></li>
                 <li><a>Child 2</a></li>
                 <li><a>Child 3</a></li>
            </ul>     
        </li>
    </ul>
</div>

【讨论】：

【解决方案3】：

   $(document).ready(function () {
    $("#wrapper").children("ul").attr("id", "myid");
   });

【讨论】：

【解决方案4】：

使用.attr

$("#wrapper ul:first").attr("id","id");

【讨论】：