我不知道如何使html页面滚动到特定的字符串是url的一部分.

例如:假设用户给出

Html页面包含许多UTC时间值,基于用户在URL中给定的UTC值,页面应该滚动到用户在URL中给定的UTC.

你能建议一下如何用html、javascript等来做这件事吗?

推荐答案

Use URL searchParams and scrollIntoView() method.
Working example on codepen.
In the example below, there will be scrolling to the block if the url contains ?utc=123:

;(() => {
  const params = ( new URL(location.href) ).searchParams;
  const id = params.get('utc');
  const block = document.getElementById(`utc-${id}`);
  if (block) {
    setTimeout(() => block.scrollIntoView({ behavior: 'smooth' }), 20)
  }
})();
/* for testing */
#utc-123 {
  margin: 100vh 0;
}
<div id="utc-123">utc-123</div>

Javascript相关问答推荐

使用jsPDF添加Image JPEG将p5.js草图画布下载为PDF

试图为每支球队生成类似于2024/25年欧洲足联冠军联赛瑞士系统格式的独特比赛配对

Angular 拦截器错误处理删除方法问题

为什么有些库公开了执行相同任务的方法,但每个方法都处于同步/同步上下文中?

我不明白这个react 组件有什么问题

如何按预期聚合SON数据?

如何使用Echart 5.5.0创建箱形图

通过使用100%间隔时间来代表我们还剩多少时间来倒计时

IMDB使用 puppeteer 加载更多按钮(nodejs)

构造HTML表单以使用表单数据创建对象数组

如何从URL获取令牌?

在带有背景图像和圆形的div中添加长方体阴影时的重影线

使用JQuery单击元素从新弹出窗口获取值

JSDoc创建并从另一个文件导入类型

未加载css colored颜色 ,无法将div设置为可见和不可见

try 将Redux工具包与MUI ToggleButtonGroup组件一起使用时出错

有没有办法更改Chart.js 3.x.x中主要刻度的字体?

FireBase FiRestore安全规则-嵌套对象的MapDiff

如何在独立的Angular 应用程序中添加Lucide-Angel?

为什么我看到的是回复,而不是我的文档?