我如何删除一个ID和添加一个不同的ID到我的导航ul

Question

我想给我的导航列表加上一个不同的ID。

我做错了什么？

您可以在jQuery中添加和删除ID吗?还是需要使用JavaScript？

 $(window).scroll(function () {
        if ($(document).scrollTop() == 0) {
            $('#logo_top').removeClass('remove-logo');
        } else {
            $('#logo_top').addClass('remove-logo'); 
        }
    });
    $(function(){
        $('#navi').data('size','big');
    });

    $(window).scroll(function(){
        if($(document).scrollTop() > 0)
        {
            if($('#navi').data('size') == 'big')
            {
                $('#navi').data('size','small');
                $('#navi').stop().animate({
                    height:'58px'
                },600);
                $('#navi-top ul').remove();
                $('#navi-top-small ul').add(); 
            }
        }
        else
        {
            if($('#navi').data('size') == 'small')
            {
                $('#navi').data('size','big');
                $('#navi').stop().animate({
                    height:'122px'
                },600);
            }  
        }
    });

这是我的网站的html，我试图针对ul有什么建议吗？

<div id="navi-top" class="push-off-right-s">
    <ul>
        <li><a href="#">The Group</a></li>
        <li><a href="#" class="active">Working Together</a></li>
        <li><a href="#">Paymaster</a></li>
        <li><a href="#">Claybrook</a></li>
        <li><a href="#">Vote for a sidekick</a></li>
    </ul>
</div>

Answer 1

应该使用元素id来标识元素。如果您想动态地更改CSS，那么应该使用class。请参阅Difference between id and class in CSS and when to use it

所以这些线

$('#navi-top ul').remove();
$('#navi-top-small ul').add();

应该是这样的

$('#navi-top').addClass('navi-top-small');

CSS：

.navi-top-small ul {
    margin: -32px 0 0 0;
}

然后，根据您的需要，您可能希望在removeClass('navi-top-small')子句中添加一个else。

Answer 2

ID是通过将ID作为参数传递而设置的属性值：

$('#navi-top ul').attr('id','your value');