本次打算以爱奇艺和天猫的网站为例，分析他们的HTML结构，然后对比非语义化标签。
截取了爱奇艺的部分HTML结构如下：
<!DOCTYPE html><html data-n-head-ssr><head>
<title>爱奇艺-在线视频网站-海量正版高清视频在线观看</title>
<meta data-n-head="ssr"charset="utf-8">
<meta data-n-head="ssr" name="apple-itunes-app" content="app-id=409563112, app-argument=iqiyi-pad://mobile/home?subtype=iPadwy_2386&link_id=iqiyihd_0">
<meta data-n-head="ssr" name="renderer" content="webkit">
<meta data-n-head="ssr" name="bytedance-verification-code" content="OH3/r7XoQqpCuo9kll67"><meta data-n-head="ssr" name="referrer" content="always"><meta data-n-head="ssr" name="google-site-verification" content="X6OJWiV6ws5XxP08OZZNglZpIZD_-EXXeGHyrx7ZTIs">
<meta data-n-head="ssr" content="W6H9eWF4xB" data-hid="baidu-site-verification" name="baidu-site-verification"><link rel="preload" href="//stc.iqiyipic.com/gaze/pcw/ssr/pages/cloudCinema/pages/cloudCinema1/pages/cloudCinemaPCA/pages/cloudCinemaPCA1/pages/components/pag/8c7f18db.5ff1f61a7ccccb777e31.js" as="script">
<link rel="preload" href="//stc.iqiyipic.com/gaze/pcw/ssr/pages/cloudCinema1/pages/cloudCinemaPCA1/pages/dianshiju/index/pages/dianying/pages/dongman/pages/in/2acb21ce.c1992619706a9ed6ed13.js" as="script">
<link rel="preload" href="//stc.iqiyipic.com/gaze/pcw/ssr/pages/index/home2020.be25b4b38fccf620a489.js" as="script">
<link rel="preload" href="//stc.iqiyipic.com/gaze/pcw/ssr/common.6e898f6.css" as="style"><link rel="preload" href="//stc.iqiyipic.com/gaze/pcw/ssr/common.279589e0cdafe53289a0.js" as="script">
<link rel="stylesheet" href="//stc.iqiyipic.com/gaze/pcw/ssr/app.dea045d.css">
<link rel="stylesheet" href="//stc.iqiyipic.com/gaze/pcw/ssr/38.1751849.css">
<link rel="stylesheet" href="//stc.iqiyipic.com/gaze/pcw/ssr/common.6e898f6.css">
<script>window.qyTtiStart = Date.now()</script></head>
<div data-server-rendered="true" id="__nuxt"><!----><div id="__layout">
<div data-v-1ea41057=""><div id="adSkinInner" class="qy-dark" data-v-1ea41057="">
<div id="I71Layout"></div> <div style="display:none">8/18/2023, 1:33:53 PM</div> <!---->
<div data-v-1ea41057=""><div class="skin_focus"></div> <div id="1000000000714" style="display: none;"><a id="adClick" onfocus="this.blur();" style="width: 100%; position: absolute;"></a>
<div id="adDiv" style="width: 970px; margin: 0px auto -25px;"></div></div></div> <div class="ph-skin-wrap"><header id="block-A" data-block-v2="712211_topNav" class="qy-header home2020 r-type1 greendark qy-header--bg qy-header--absolute"><div class="header-wrap"><div class="header-inner"><div class="qy-logo"><a href="//www.iqiyi.com/" title="爱奇艺视频" data-rseat-v2="iQIYI_logo" class="logo-link2"></a></div><!----><div class="qy-header-side"><!----><div class="header__search"><div class="client-only-placeholder"><div class="search-box"><span class="search-box-in"><input autocomplete="off" type="text" data-rseat-v2="712211_search_input" class="search-box-input"></span><span class="search-box-out"><span type="button" class="search-box-btn"><i class="qy20-header-svg qy20-header-svg-search"></i></span></span></div></div></div><div class="header-sideItem header-vip"><div class="client-only-placeholder"><div class="header-sideItemCon header-vip-login"><i class="header-sideItemIcon qy20-header-svg qy20-header-svg-vip"></i><span class="header__item__tit">VIP</span></div></div></div><div class="header-sideItem qy-header__game"><div class="client-only-placeholder"><a href="//pc.game.iqiyi.com?startfrom=pcw_topbanner " target="_blank" data-rseat-v2="tj_gamecenter" class="header-sideItemCon"><i class="header-sideItemIcon qy20-header-svg qy20-header-svg-game"></i><span class="header__item__tit">游戏</span></a></div></div><div class="header-sideItem header-upload"><div class="client-only-placeholder"><span data-rseat-v2="712211_upload_ugc" class="header-sideItemCon"><i class="header-sideItemIcon qy20-header-svg qy20-header-svg-upload"></i><span id="nav_uploadHref" class="header__item__tit">上传</span></span></div></div><div class="header-sideItem header-download"><div class="client-only-placeholder"><div class="header-sideItemCon"><i class="header-sideItemIcon qy20-header-svg qy20-header-svg-pca-dwn"></i><span class="header__item__tit">客户端</span></div></div></div><div class="header-sideItem header-record"><div class="client-only-placeholder"><a target="_blank" rel="nofollow" href="//www.iqiyi.com/u/record" data-rseat-v2="tj_history" class="header-sideItemCon"><i class="header-sideItemIcon qy20-header-svg qy20-header-svg-record"></i><span class="header__item__tit">看过</span></a></div></div><div class="header-sideItem header-user"><div class="client-only-placeholder"><div class="header-sideItemCon"><a rel="nofollow" class="header-userLink"><img id="J-user-img" src="转存失败，建议直接上传图片文件
//www.iqiyipic.com/common/fix/site-v5/header-userImg-default-dark.png
" class="header-userImg" alt="转存失败，建议直接上传图片文件"></a></div></div></div></div></div><!----></div><!----><!----></header> <div style="position:relative;" data-v-12c74cfb="" data-v-1ea41057=""><div id="block-B" data-focus="" data-block-v2="fcs_0" class="qy20-h-carousel-wrap" data-v-12c74cfb=""><div class="qy20-h-carousel" style="background-color:#40302d;" data-v-12c74cfb=""><div class="qy20-h-carousel__fixed" style="opacity:1;position:;" data-v-12c74cfb=""><div class="qy20-h-carousel__inner" data-v-12c74cfb=""><ul class="qy20-h-carousel__ul" data-v-12c74cfb=""><li class="qy20-h-carousel__li" data-v-12c74cfb=""><span class="qy20-h-carousel__a" style="background-image:url(//pic1.iqiyipic.com/lequ/common/lego/20230817/7e06d77d6b164079927f10c80806e39e.jpg?caplist=jpg,webp);transform:translateX(0%);opacity:1;" data-v-12c74cfb=""></span></li><li class="qy20-h-carousel__li" data-v-12c74cfb=""><span class="qy20-h-carousel__a" data-v-12c74cfb=""></span></li><li class="qy20-h-carousel__li" data-v-12c74cfb=""><span class="qy20-h-carousel__a" data-v-12c74cfb=""></span></li><li class="qy20-h-carousel__li" data-v-12c74cfb=""><span class="qy20-h-carousel__a" data-v-12c74cfb=""></span></li><li class="qy20-h-carousel__li" data-v-12c74cfb=""><span class="qy20-h-carousel__a" data-v-12c74cfb=""></span></li><li class="qy20-h-carousel__li" data-v-12c74cfb=""><span class="qy20-h-carousel__a" data-v-12c74cfb=""></span></li><li class="qy20-h-carousel__li" data-v-12c74cfb=""><span class="qy20-h-carousel__a" data-v-12c74cfb=""></span></li><li class="qy20-h-carousel__li" data-v-12c74cfb=""><span class="qy20-h-carousel__a" data-v-12c74cfb=""></span></li><li class="qy20-h-carousel__li" data-v-12c74cfb=""><span class="qy20-h-carousel__a" data-v-12c74cfb=""></span></li><li class="qy20-h-carousel__li" data-v-12c74cfb=""><span class="qy20-h-carousel__a" data-v-12c74cfb=""></span></li></ul> <div id="carouselPlayer" class="qy20-h-carousel__video" style="display:none;" data-v-12c74cfb=""></div> <div class="qy20-h-carousel__maskl" style="background-image:linear-gradient(270deg, #40302d 0%, transparent);" data-v-12c74cfb=""></div> <div class="qy20-h-carousel__maskr" style="background-image:linear-gradient(270deg, #40302d 0%, transparent);" data-v-12c74cfb=""></div></div> <div class="qy20-h-carousel__masktop" data-v-12c74cfb=""><div class="qy20-h-carousel__masktop1" style="background-image:linear-gradient(to bottom,#40302dE6,#40302dB3);" data-v-12c74cfb=""></div> <div class="qy20-h-carousel__masktop2" style="background-image:linear-gradient(to bottom, #40302dB3, #40302d00);" data-v-12c74cfb=""></div></div> <div class="qy20-h-carousel__maskbottom" data-v-12c74cfb=""></div> <div class="qy20-h-carousel_con-gray" data-v-12c74cfb=""><div class="qy20-h-carousel__ad" style="display:none;" data-v-12c74cfb=""><img width="auto" height="18" src="https://p3-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/6be0c64d6354461d84443b6c3ab6366b~tplv-k3u1fbpfcp-zoom-1.image" data-v-12c74cfb=""></div> <i data-rseat-v2="fcs_0_volume_open" class="btn-voice qy20-h-carousel__voice" style="display:none;" data-v-a0740f36="" data-v-12c74cfb=""><svg viewBox="0 0 40 40" xmlns="http://www.w3.org/2000/svg" width="40" height="40" class="qy20-h-carousel__voice-off" style="display:;" data-v-a0740f36=""><path d="M20.854 12c.575 0 1.075.37 1.14 1.027l.006.146v14.646A1.14 1.14 0 0 1 20.838 29c-.232 0-.479-.063-.72-.202l-.143-.092-4.32-3.357h-3.397c-.577 0-1.183-.496-1.252-1.014L11 24.231v-7.446c-.013-.655.541-1.04 1.138-1.103l.12-.008h3.397l4.317-3.382c.283-.198.592-.292.882-.292zM20 14.81l-3.655 2.864L13 17.673l-.001 5.675h3.342L20 26.194V14.81zm4.64 2.47l1.859 1.86 1.86-1.86a.965.965 0 0 1 1.27-.08l.09.08c.345.346.372.894.08 1.27l-.08.09-1.86 1.86 1.86 1.86a.966.966 0 0 1 0 1.36.964.964 0 0 1-1.359 0l-1.861-1.861-1.86 1.86a.965.965 0 0 1-1.269.08l-.09-.08a.967.967 0 0 1-.08-1.27l.08-.09 1.859-1.86-1.859-1.858a.966.966 0 0 1 0-1.36.964.964 0 0 1 1.36 0z" opacity=".9" data-v-a0740f36=""></path></svg> <svg viewBox="0 0 40 40" xmlns="http://www.w3.org/2000/svg" width="40" height="40" class="qy20-h-carousel__voice-on" style="display:none;" data-v-a0740f36=""><path d="M20.854 12c.575 0 1.075.37 1.14 1.027l.006.146v14.646A1.14 1.14 0 0 1 20.838 29c-.232 0-.479-.063-.72-.202l-.143-.092-4.32-3.357h-3.397c-.577 0-1.183-.496-1.252-1.014L11 24.231v-7.446c-.013-.655.541-1.04 1.138-1.103l.12-.008h3.397l4.317-3.382c.283-.198.592-.292.882-.292zm4.676 1.56a.65.65 0 0 1 .54.257 8.246 8.246 0 0 1 3.713 6.892 8.243 8.243 0 0 1-3.714 6.893l-.009-.008a.65.65 0 0 1-.954-.841l-.015-.014.041-.025c.11-.17.3-.284.518-.291l-.086.01a6.992 6.992 0 0 0 2.969-5.724 6.995 6.995 0 0 0-3.233-5.9.634.634 0 0 1-.166-.101 1.6 1.6 0 0 0-.084-.052l.017-.014a.65.65 0 0 1 .463-1.082zM20 14.81l-3.655 2.864L13 17.673l-.001 5.675h3.342L20 26.194V14.81zM23.75 17c.23 0 .437.104.574.268l.002-.003A4.984 4.984 0 0 1 25.79 20.8c0 1.38-.56 2.63-1.464 3.535a.762.762 0 0 1-.576.265.75.75 0 0 1-.483-1.324l-.002-.001A3.489 3.489 0 0 0 24.29 20.8c0-.966-.391-1.84-1.024-2.474A.76.76 0 0 1 23 17.75a.75.75 0 0 1 .75-.75z" opacity=".9" data-v-a0740f36=""></path></svg></i> <div class="qy20-h-carousel__lb" data-v-12c74cfb=""><div class="qy20-h-carousel__logo" data-v-12c74cfb=""><img src="https://p3-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/c3ba7e9f6f604e4eaa0ac0e49cf9a124~tplv-k3u1fbpfcp-zoom-1.image" class="qy20-h-carousel__logo__img" data-v-12c74cfb=""></div> <div data-v-12c74cfb=""></div></div> <div data-v-12c74cfb=""><a href="//www.iqiyi.com/v_2bulmisxipk.html" rseat="fcs_0_p11" data-rseat-v2="fcs_0_p1" target="_blank" class="qy20-h-carousel__link" data-v-12c74cfb=""></a><a href="//www.iqiyi.com/v_s0lo1poj1k.html" rseat="fcs_0_p12" data-rseat-v2="fcs_0_p2" target="_blank" class="qy20-h-carousel__link" style="display:none;" data-v-12c74cfb=""></a><a href="//www.iqiyi.com/v_tqj8hl4jvs.html" rseat="fcs_0_p13" data-rseat-v2="fcs_0_p3" target="_blank" class="qy20-h-carousel__link" style="display:none;" data-v-12c74cfb=""></a><a href="//www.iqiyi.com/a_26tz1mqh2jp.html" rseat="fcs_0_p14" data-rseat-v2="fcs_0_p4" target="_blank" class="qy20-h-carousel__link" style="display:none;" data-v-12c74cfb=""></a><a href="//www.iqiyi.com/v_1d74ab0t9ug.html" rseat="fcs_0_p15" data-rseat-v2="fcs_0_p5" target="_blank" class="qy20-h-carousel__link" style="display:none;" data-v-12c74cfb=""></a><a href="//www.iqiyi.com/v_23zj9gyqcfs.html" rseat="fcs_0_p16" data-rseat-v2="fcs_0_p6" target="_blank" class="qy20-h-carousel__link" style="display:none;" data-v-12c74cfb=""></a><a href="//www.iqiyi.com/v_25ltrdm1rl8.html" rseat="fcs_0_p17" data-rseat-v2="fcs_0_p7" target="_blank" class="qy20-h-carousel__link" style="display:none;" data-v-12c74cfb=""></a><a href="//www.iqiyi.com/kszt/1bn8no61lgu.html" rseat="fcs_0_p18" data-rseat-v2="fcs_0_p8" target="_blank" class="qy20-h-carousel__link" style="display:none;" data-v-12c74cfb=""></a><a href="//ads.game.iqiyi.com/nt/p6x7bb3b8m.html?pccenter_fr=pcw_base_banner" rseat="fcs_0_p19" data-rseat-v2="fcs_0_p9" target="_blank" class="qy20-h-carousel__link" style="display:none;" data-v-12c74cfb=""></a><a href="//www.iqiyi.com/v_27vwhuu9hzw.html" rseat="fcs_0_p20" data-rseat-v2="fcs_0_p10" target="_blank" class="qy20-h-carousel__link" style="display:none;" data-v-12c74cfb=""></a></div> <div class="qy20-h-carousel__side-panel" data-v-12c74cfb=""><i class="qy20-h-carousel__wicon" style="background-image:url(http://pic1.iqiyipic.com/lequ/common/lego/20220422/e1a07a01d9be49f690e40057b9307bf4.png);display:;" data-v-12c74cfb=""></i><i class="qy20-h-carousel__wicon" style="background-image:url(http://pic1.iqiyipic.com/lequ/common/lego/20220422/e1a07a01d9be49f690e40057b9307bf4.png);display:none;" data-v-12c74cfb=""></i><i class="qy20-h-carousel__wicon" style="background-image:url(http://pic2.iqiyipic.com/lequ/common/lego/20220422/48ff7a75708349e585bca0b77eb5be67.png);display:none;" data-v-12c74cfb=""></i><i class="qy20-h-carousel__wicon" style="background-image:url(http://pic0.iqiyipic.com/lequ/common/lego/20220422/5dbcdb011cd74ee0a8630eb8f9ef9373.png);display:none;" data-v-12c74cfb=""></i><i class="qy20-h-carousel__wicon" style="background-image:url(http://pic1.iqiyipic.com/lequ/common/lego/20220422/e1a07a01d9be49f690e40057b9307bf4.png);display:none;" data-v-12c74cfb=""></i><i class="qy20-h-carousel__wicon" style="background-image:url(http://pic1.iqiyipic.com/lequ/common/lego/20220422/e1a07a01d9be49f690e40057b9307bf4.png);display:none;" data-v-12c74cfb=""></i><i class="qy20-h-carousel__wicon" style="background-image:url(http://pic1.iqiyipic.com/lequ/common/lego/20220422/e1a07a01d9be49f690e40057b9307bf4.png);display:none;" data-v-12c74cfb=""></i><i class="qy20-h-carousel__wicon" style="background-image:url(http://pic1.iqiyipic.com/lequ/common/lego/20220422/e1a07a01d9be49f690e40057b9307bf4.png);display:none;" data-v-12c74cfb=""></i><i class="qy20-h-carousel__wicon" style="display:none;" data-v-12c74cfb=""></i><i class="qy20-h-carousel__wicon"
杨超越丁禹兮七次情缘
</p> <!----></div></div></li><li class="qy-mod-li" data-v-5643dd65=""> <!----> <div data-pb-v2="bkt=tpfsfallrerank_04;pcw_recall_b;tp_fsfall_rule_08;tpfsfallrank_03;tp_fsfall_prerank_07&e=5f326e061e34d92fc49f440a8bd4ea3f&r_area=pcw_rec_like&abtest=4545_A&ext={" session":"69f3b6d41cdce51f7bceee1b94c0813d"}&reasonid="3290&r_ext=dc:WH,w:0.74586256,s:0.66586256,p:0.00000000,is_ppc:1,crowd:crowd_pcw,ct:0&r_source=62@62@945&r=8077509274258301&rank=2&position=2"" class="qy-mod-img horizon" data-v-3029290b="" data-v-5643dd65=""><div class="qy-mod-link-wrap" data-v-3029290b=""><a href="//www.iqiyi.com/v_25ltrdm1rl8.html" vfrmrseat="712211_cainizaizhui_image2" rseat="712211_cainizaizhui_image2" data-rseat-v2="712211_cainizaizhui_image2" class="qy-mod-link" data-v-3029290b=""> <div data-v-3029290b=""><picture id="//pic9.iqiyipic.com/image/20230817/e5/43/a_100517696_m_601_m32_284_160.jpg" class="video-item-preview-img" data-v-1db5af64="" data-v-3029290b=""><source alt="" title="" srcset="//pic9.iqiyipic.com/image/20230817/e5/43/a_100517696_m_601_m32_284_160.jpg?caplist=jpg,webp,avif, //pic9.iqiyipic.com/image/20230817/e5/43/a_100517696_m_601_m32_592_333.jpg?caplist=jpg,webp,avif 1.1x" type="image/avif" data-v-1db5af64=""> <source alt="" title="" srcset="//pic9.iqiyipic.com/image/20230817/e5/43/a_100517696_m_601_m32_284_160.jpg?caplist=jpg,webp, //pic9.iqiyipic.com/image/20230817/e5/43/a_100517696_m_601_m32_592_333.jpg?caplist=jpg,webp 1.1x" type="image/webp" data-v-1db5af64=""> <img src="https://p3-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/622d612343df4f23812dcf0605cd7135~tplv-k3u1fbpfcp-zoom-1.image" srcset="//pic9.iqiyipic.com/image/20230817/e5/43/a_100517696_m_601_m32_592_333.jpg 1.1x" alt="莲花楼" title="" rseat="712211_cainizaizhui_image2" data-pb="" class="i71-img" data-v-1db5af64=""></picture></div> <div data-v-3029290b=""></div> <span data-v-3029290b=""></span> <!----> <div class="icon-br icon-b" style="display:;" data-v-3029290b=""><span class="qy-mod-label" data-v-3029290b="">40集全</span></div> <!----> <!----> <!----> <!----></a> <div class="video-mask" style="display:none;" data-v-3029290b=""></div> <!----></div> <div class="title-wrap" data-v-3029290b=""><p class="main" data-v-3029290b=""><!----> <a data-pb="" rseat="712211_cainizaizhui_title2" data-rseat-v2="712211_cainizaizhui_title2" title="莲花楼" href="//www.iqiyi.com/v_25ltrdm1rl8.html" class="link-txt" data-v-3029290b=""><!----> <!----><span data-v-3029290b="">莲花楼</span></a></p> <!----> <!----> <p title="故人逢 江湖梦" class="sub" data-v-3029290b="">
故人逢 江湖梦</p></div></div></li></ul></div></div></div></div></div></div></div></div></div></div></div></div>
var ua = window.navigator.userAgent
var isLinux = ua.indexOf('Linux') >= 0
var isChrome = ua.indexOf('Chrome') >= 0
try {
if (isChrome && !isLinux && !document.querySelector("a[data-rseat-v2='712211_channel_shouye']")) {
var img = new Image()
img.src = 'https://msg.qy.net/qos?t=11&rpage=vue-ssr&ct=no-header&requestId='+(Qi.logParams()||{}).requestId
} else {
console.log(111, 'has-header')
}
if (isChrome && !isLinux && !window.home2020Mounted) {
var img = new Image()
img.src = 'https://msg.qy.net/qos?t=11&rpage=vue-ssr&ct=home2020-not-mounted&requestId='+(Qi.logParams()||{}).requestId
} else {
console.log(111, 'home2020 mounted')
}
} catch (e) { console.log(111, 'no-header出错了：', e) }
}, 5000)</script>
截取了天猫的部分HTML结构如下：
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>天猫</title>
<!-- 其他头部信息，如CSS和JavaScript链接等 -->
</head>
<body>
<header> <!-- 页面头部内容，如网站Logo、导航链接等 --> </header>
<nav> <!-- 导航栏，包含一些主要导航链接 -->
</nav>
<main>
<section id="banner"> <!-- 广告轮播图或页面顶部Banner --> </section>
<section id="product-list"> <!-- 商品列表，展示不同类别或推荐商品 -->
<div class="product-item"> <div class="product-thumbnail"> <!-- 商品缩略图 --> </div>
<div class="product-details"> <!-- 商品详细信息，如标题、价格、销量等 --> </div>
</div> <!-- 更多商品条目 -->
</section>
</main>
<footer> <!-- 页面底部，包含一些关于天猫的信息和链接 --> </footer> <!-- 其他脚本引用和统计代码等 -->
</body>
</html>
经过对比可知：
在爱奇艺的HTML结构中，下面是一些非语义化标签的可能使用情况：
<div>：在爱奇艺的HTML结构中，可能使用<div>元素作为容器元素来组织页面的布局和结构。例如，<div>元素可以包裹视频缩略图、视频详细信息等内容。
<article>：在视频列表部分，可能使用<article>元素来表示每个视频条目的独立内容。其中包含视频缩略图和详细信息等内容。
<section>：可能使用<section>元素来划分页面的不同部分，如广告轮播图区域、视频列表区域等。
在天猫的HTML结构中，可能使用了类似爱奇艺和百度的标签和结构。下面是一些可能的非语义化标签的使用情况：
<div>：在天猫的HTML结构中，可能使用<div>元素作为容器元素来组织页面的布局和结构。例如，<div>元素可以包裹商品缩略图、商品详细信息等内容。
<section>：可能使用<section>元素来划分页面的不同部分，如广告轮播图区域、商品列表区域等。
在天猫的HTML结构中，还使用其它标签如<header>、<nav>和<footer>等，用于表示页面的头部、导航栏和底部区域。
