HTML5无原生轮播功能，需借助TinySlider等JS插件实现；引入CDN脚本后，按指定HTML结构编写容器与图片项，DOM加载完成后调用tns()初始化，并正确配置autoplay等参数。
HTML5 本身不提供图片轮播功能，所谓“HTML5 调用 JS 插件”，本质是用标准 HTML5 文档结构 + 外部 JavaScript 库（如 Swiper、TinySlider、Owl Carousel 等）来实现轮播。直接写 或指望原生 标签自动轮播，会失败。
怎么引入并初始化一个轻量轮播插件（以 TinySlider 为例）
TinySlider 是纯 JS、无依赖、支持 ES 模块和 UMD 的现代轮播库，适合新手快速集成。
- 下载或通过 CDN 引入：在
或页面底部标签中加入 - HTML 结构必须是带 class 的容器包裹 列表项，例如：@@##@@@@##@@@@##@@
- JS 初始化必须等 DOM 加载完成后再执行，否则
document.getElementById('slider')返回 null；推荐放在底部或用DOMContentLoaded事件包裹- 调用
tns()函数时，container参数必须是有效 DOM 元素或选择器字符串（如'#slider'），漏写或写错 selector 是新手最常遇到的“没反应”原因为什么轮播不自动播放？常见配置项说明
TinySlider 默认不自动播放，需显式开启；且部分配置相互影响，比如
autoplay开启后，autoplayTimeout和autoplayHoverPause才生效。-
autoplay: true— 必须设为true（布尔值，不是字符串"true"） -
autoplayTimeout: 3000— 单位是毫秒，3000 = 3 秒；设太小（如 100）会导致视觉混乱 -
autoplayDirection: 'forward'— 可选'forward'或'backward'，默认正向 -
autoplayButtonOutput: false— 设为false可隐藏“播放/暂停”按钮（否则会在轮播下方插入额外 DOM） - 如果加了
controls: false却忘了关nav: false，小圆点导航仍会显示——这两个是独立开关
轮播图点击没反应、手势失效？检查这些兼容性细节
TinySlider v2 在移动端依赖
touchstart/touchmove事件，但某些环境（如 iOS Safari 的 iframe 嵌套、微信内置浏览器禁用部分 touch 行为）会拦截，导致拖拽卡死或点击跳转失败。 - JS 初始化必须等 DOM 加载完成后再执行，否则
