滚动到特定的<li>
元素可以通过JavaScript实现。这里有一个简单的示例,展示了如何使用JavaScript滚动到具有特定文本内容的<li>
元素:
function scrollToLI(text) {
const listItems = document.getElementsByTagName('li');
for (let i = 0; i< listItems.length; i++) {
if (listItems[i].innerText === text) {
listItems[i].scrollIntoView({ behavior: 'smooth' });
break;
}
}
}
scrollToLI('特定的文本');
在这个示例中,我们首先获取了所有<li>
元素,然后遍历它们,检查它们的文本内容是否与我们要查找的文本相匹配。如果找到了匹配的元素,我们使用scrollIntoView()
方法将其滚动到视图中。
请注意,这个示例仅适用于具有固定高度的容器,因为在滚动时,元素会被平滑地滚动到视图中。如果您的容器具有可变高度或者您希望立即跳到指定的<li>
元素,您可以将{ behavior: 'smooth' }
替换为{ behavior: 'auto' }
。
如果您需要在特定的容器中滚动到<li>
元素,请将document.getElementsByTagName('li')
替换为yourContainerElement.getElementsByTagName('li')
,其中yourContainerElement
是您要在其中滚动的容器元素。
领取专属 10元无门槛券
手把手带您无忧上云