Question

我希望屏幕向下滚动到div。该div的ID为“天气数据”

我尝试了以下方法；

document.getElementById('weather-data').scrollIntoView();

我也尝试过使用似乎无法正常工作的锚标记

用户将单击的按钮：

<button id="submit" onclick="myFunction()">
                    Submit
                </button>

单击按钮时运行的功能：

function myFunction(){
    cityName();

    getData();

    clear();

    document.getElementById('weather-data').scrollIntoView();
}

这是我希望屏幕滚动到的div：

<div id="weather-data">

</div>

Answer 1

使用定位标记链接div

body{
  margin: 0;
}

div{
  height: 100vh;
  border: 1px solid black;
}

<html>
  <body>
    <div id='a'>a</div>
    <div id='b'>b</div>
    <div id='c'>c</div>
    <div id='d'>d</div>
    <div id='e'>e</div>
    <button><a href='#c'>go to c</a></button>
  </body>
</html>

Answer 2

我解决了必须写一个if语句来检查h1元素中是否有任何文本的问题。

if(weatherMain != null){

                document.getElementById('icon').scrollIntoView();
                document.getElementById('weather-main').scrollIntoView();

            }

当用户点击按钮

2 个答案: