Javascript 如何控制div的水平滚动？

我有一个固定大小的div，它会逐渐添加越来越多的内容，获得一个水平滚动条。我希望能够在任何时候强制滚动条向右移动，这样我就可以始终看到最新添加的内容，将较旧的内容向左移动。但是如果不使用jQuery，我似乎想不出一种方法来实现这一点。你可以使用父控制器上的方向，从右向左设置它

分区集装箱{ 宽度：400px； 高度：300px； 溢出-x：滚动； 方向：rtl； } 分区卷轴{ 宽度：1000px； 高度：300px； } 尝试将div的scrollLeft设置为scrollWidth

e、 g

document.getElementByIdbtnAdd.onclick=函数{ var divContent=document.getElementByIddivContent； divContent.innerHTML+=一些东西； divContent.scrollLeft=divContent.scrollWidth； }; divContent{ 溢出-x：自动； 溢出y：隐藏； 高度：50px； 宽度：300px； 空白：nowrap； } 添加您可以使用scrollIntoView，它会将特定项目滚动到视图中

CSS

HTML

---

你试过什么？您是否尝试使用scrollIntoView

.cont{
  width: 200px;
  height: 100px;
  border: 1px solid black;
  overflow: auto;
  overflow-y: hidden;
  white-space: nowrap;
}

.element{
  width: 50px;
  margin: 10px;
  font-size: 40px;
  display: inline-block;
}

<div class="cont">
    <div class="element">1</div>
    <div class="element">2</div>
    <div class="element">3</div>
    <div class="element">4</div>
    <div class="element">5</div>
    <div class="element">6</div>
</div>

function scrollTo(item) {
    document.getElementsByClassName('element')[item].scrollIntoView();    
};

scrollTo(5);