为什么翻页组件大多用<ul>实现?<ul>的优势是什么?

2016-01-01 11:55:35 +08:00
 SilentDepth
看到很多页码翻页组件都是用`<ul>`实现的,不明白这有什么特殊的用意。用`<div>`或者`<span>`不好吗?比如这样:

``` html
<!-- 仅作示意 -->
<div class="pager">
<span class="prev">Prev</span>
<span class="curr">1</span>
<span>2</span>
<span class="next">Next</span>
</div>
```
4592 次点击
所在节点    HTML
20 条回复
XianZaiZhuCe
2016-01-01 11:57:05 +08:00
表示这是列表
Jaylee
2016-01-01 11:58:37 +08:00
语义化
FrankFang128
2016-01-01 12:00:14 +08:00
ol 才对。
SilentDepth
2016-01-01 12:03:46 +08:00
@Jaylee 如果是带有更复杂交互的翻页组件,比如接受用户输入页码什么的,写成列表也体现不出语义化啊

``` html
<li class="prev">Prev</li>
<li class="curr"><input type="text"></li>
<li class="next">Next</li>
```

诸如此类的
jin5354
2016-01-01 12:03:52 +08:00
语义化。虽然没啥卵用
luoway
2016-01-01 13:22:41 +08:00
这样的话, HTML 的 body 子元素只需要两种: div 和 span ,还学那么多标签做啥?
语义化不是没卵用,是没有 css 也能清晰地组织 HTML 文档
babyhome
2016-01-01 13:53:36 +08:00
很多问题都有多种解,选择自己认为正确的即可。
Slienc7
2016-01-01 14:16:41 +08:00
subpo
2016-01-01 15:16:34 +08:00
@luoway 还需要 span 干嘛, div 就够了
herozzm
2016-01-01 16:08:43 +08:00
不用, div 中用 span 和 a 足够
imn1
2016-01-01 17:34:47 +08:00
li 是可省略后标签元素
DaPanda
2016-01-01 17:36:47 +08:00
语义化
相对来说 ol 应该是最符合的
BOYPT
2016-01-01 17:40:48 +08:00
按楼主的说法,那基本所有 html 节点都是多余的,只要一种就够了是吧。
Sivan
2016-01-01 18:05:58 +08:00
@DaPanda
@FrankFang128
常见的完整翻页导航用语义化 ol 也是不太合适的,因为翻页导航除了页码 123 还有 Prev 和 Next 和…,这些根本不跟 12345 构成序列关系。
chemzqm
2016-01-01 20:03:45 +08:00
ul 表示列表啊,而且只需要敲两个字符,而且用 emmet 之类的 ul>li*3 这样的方式方便啊,
说到底您爱怎么写怎么写
FrankFang128
2016-01-01 23:31:47 +08:00
<nav><button>prev</button><ol><li>... </ol> <button> next </button></nav>
pynix
2016-01-01 23:53:02 +08:00
爱怎么写怎么写
yangweijie
2016-01-02 00:08:37 +08:00
@DaPanda ol 是有序的,但是分页很多 还自带标签也就是上一页 、下一页、最末页,这又是无序的了。所以用 li
Phariel
2016-01-02 01:41:38 +08:00
照你这么说 HTML 只需要 div 和 input 讲真
learnshare
2016-01-02 09:35:46 +08:00
简单来说,当你移除 CSS 的时候,还能够看出来这是什么功能

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/247642

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX