滚动窗口然后div，jQuery

Question

我正在努力用jQuery来编写代码，这让我可以像我的例子那样获得效果。我这样做是因为scrollIntoView仅在Chrome中正常工作。 https://jsfiddle.net/Lw6b88wg/1/

btn.onclick = function() {
    let listElements = document.querySelectorAll('p');
    let lastElementNumber = listElements.length;
    listElements[lastElementNumber - 1].scrollIntoView({
        behavior: 'smooth',
        block: 'end',
        inline: 'end'
    });
}

Answer 1

＆＃13;

＆＃13;

$('#btn').on('click', function() {
  var divHeight = $('#outer-div')[0].scrollHeight;
  $('html, body').animate({
    scrollTop: '0px'
  }, 300);
  $('#outer-div').animate({
    scrollTop: divHeight
  }, 300);
});

＆＃13;

body {
  height: 1500px;
  position: relative;
  margin: 0;
  padding-bottom: 6rem;
}

div {
  border: 1px solid red;
  overflow-y: scroll;
  width: 100px;
  height: 200px;
}

button {
  position: absolute;
  bottom: 0;
  left: 0;
}

＆＃13;

<div id="outer-div">
  <p>
    1
  </p>
  <p>
    2
  </p>
  <p>
    3
  </p>
  <p>
    4
  </p>
  <p>
    5
  </p>
  <p>
    6
  </p>
  <p>
    7
  </p>
  <p>
    8
  </p>
  <p>
    9
  </p>
  <p>
    10
  </p>
  <p>
    11
  </p>
  <p>
    12
  </p>
  <p>
    13
  </p>
</div>
<button id="btn">
click me
</button >
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.js"></script>

＆＃13;

＆＃13;

＆＃13;