Javascript 如何滚动焦点到具有相同类名或相同属性的特定div

如何滚动关注具有相同类名或相同属性的特定div，当单击li have class name list1时，滚动需要关注div class list1

<ul>
<li class="list1">list1</li>
<li class="list2">list1</li>
<li class="list3">list1</li>
</ul>
<div class="list1"></div>
<div class="list2"></div>
<div class="list3"></div>

列表1
列表1
列表1

您好，您可以尝试此解决方案

<ul>
<li class="list1"><a href="#list1">list1</a></li>
<li class="list2"><a href="#list2">list2</a></li>
<li class="list3"><a href="#list3">list3</a></li>
</ul>
<div id="list1">list1</div>
<div id="list2">list2</div>
<div id="list3">list3</div>

清单1
清单2
清单3

检查此解决方案。这肯定会对你有帮助

<script>
jQuery(document).ready(function(){      
jQuery('ul li').click(function(){
        var myClass = jQuery(this).attr("class");
        jQuery("html, body").animate({ scrollTop: jQuery('div.'+myClass).offset().top }, 1000);         
        return false;
    });
});
</script>
<ul>
  <li class="list1">list1</li>
  <li class="list2">list2</li>
  <li class="list3">list3</li>
</ul>
<div class="list1">list1</div>
<div class="list2">list2</div>
<div class="list3">list3</div>

jQuery（文档）.ready（函数（）{
jQuery（'ul li'）。单击（函数（）{
var myClass=jQuery（this.attr（“类”）；
动画（{scrollTop:jQuery（'div.+myClass）.offset（）.top}，1000）；
返回false；
});
});

列表1
列表2
列表3

清单1
清单2
清单3

试试这个，它适合我

$（文档）.ready（函数（）{
$（“.menu li”）。单击（函数（）{
var activeLink=$（this.attr（'class'）；
var activeElementPosition=$（'div.+activeLink）.position（）；
$（'body'）。设置动画({
scrollTop:activeElementPosition.top
}, 300);
});
});


列表1
列表2
列表3

请写下您迄今为止尝试过的内容。@Makwana Ketan no friend我正与jquerysome issue合作第二次单击它重新聚焦Li在我这边工作正常。在div中添加大的内容，这样可以更好地分析。thanxat在滚动结束时，重新聚焦div没有正常工作，这意味着单击'li.list3'，'div.list3'没有滚动到视图端口的顶部？