Javascript 隐藏和替换html内容和数据属性值

我正在处理一个无序列表，该列表是动态输出的，并且已经填充了一个“数据值”的数据属性。我无法控制后端的输出。我需要隐藏一些列表元素并更改其中一个元素的数据属性。因此，作为一个例子，我有以下html（不是实际数据！）：

---

这段代码是我想说的话，做了我想做的事，但它看起来真的很凌乱和冗长。有更好的方法吗？

根据建议，您可以将前两行链接起来，并将其分成两行：

$（文档）.ready（函数（）{
$（'.下拉菜单li[data-value=“1996”]'）.html（'YYYY'）.attr（'data-value'，'YYYY'）；
$（'.dropdown menu li[data value=”“]）.addClass（'hideMe'）；
});

.hideMe{
显示：无；
}

您可以链接

.html（）

和

.attr（）

调用，但除此之外，没有什么可以改进的，我不会称之为混乱/冗长。你有3个操作要做，还有3行代码让它们发生：）Rory说的也是。如果要保存第二次查找，可以将元素存储为变量。噢！那好吧：-）谢谢大家！

<ul class="dropdown-menu">
    <li data-value="1996"><a href="javascript:;">1996</a></li>
    <li data-value="1997"><a href="javascript:;">1997</a></li>
    <li data-value="1998"><a href="javascript:;">1998</a></li>
    <li data-value="1999"><a href="javascript:;">1999</a></li>
    <li data-value=""><a href="javascript:;">2000</a></li>
<ul>

window.onload = function(){
    $('.dropdown-menu li[data-value="1996"]').html('YYYY');
    $('.dropdown-menu li[data-value="1996"]').attr('data-value', 'YYYY');
    $('.dropdown-menu li[data-value=""]').addClass('hideMe');
}