当前位置: 首页 > news >正文

第一次接触浏览器的LocalStorage

欢迎来到本系列的第7篇。在之前的文章中,我们主要关注组件的内部逻辑。今天,我们将把视野扩大到整个网站的架构。

深色模式(Dark Mode)不仅仅是一个“开关”,它涉及到 CSS 架构设计的核心思想——变量化。同时,为了让网站“记住”用户的选择,我们将第一次接触浏览器的LocalStorage(本地存储)。

本篇我们将实现:

基于 CSS 变量 的主题系统。

一个平滑切换的“日/夜”开关。

使用 JS 读取和保存用户偏好。

第一部分:HTML 结构搭建 (语义化与开关)

HTML 结构相对简单。我们主要需要两部分:

页面内容:用于展示主题切换后的效果(如标题、卡片、文字)。

切换开关:一个用于触发切换的按钮。

<body>

<!-- 1. 顶部导航栏 -->
<nav class="navbar">
<div class="logo">MyBrand</div>

<!--
主题切换开关
aria-label 是为了无障碍访问
-->
<button id="theme-toggle" class="theme-btn" aria-label="切换主题">
<!-- 默认显示月亮图标 (代表点击进入深色模式) -->
<span class="icon">🌙</span>
<span class="text">深色模式</span>
</button>
</nav>

<!-- 2. 主要内容区域 -->
<main class="container">

<div class="hero-section">
<h1>欢迎来到我的博客</h1>
<p>这是一个演示 CSS 变量和深色模式切换的页面。</p>
</div>

<div class="card-grid">
<!-- 卡片 1 -->
<div class="card">
<h2>文章标题 1</h2>
<p>这是一些示例文本。在深色模式下,背景变黑,文字变白。</p>
<a href="#" class="link">阅读更多</a>
</div>

<!-- 卡片 2 -->
<div class="card">
<h2>文章标题 2</h2>
<p>CSS 变量让这一切变得非常简单且高效。</p>
<a href="#" class="link">阅读更多</a>
</div>
</div>

</main>

</body>


第二部分:CSS 样式 (CSS 变量的魔力)

这是本篇的核心。我们不再直接写死颜色(如 #ffffff 或 #000000),而是定义变量。

逻辑如下:

在 :root (默认状态) 下定义一套“浅色”变量。

在 [data-theme="dark"] 状态下重新定义这套变量为“深色”值。

在具体的 CSS 规则中,只使用 var(--variable-name)。

/* --- 1. 定义变量系统 --- */

/* 默认 (浅色) 主题 */
:root {
/* 背景色 */
--bg-body: #f4f7f6;
--bg-card: #ffffff;
--bg-nav: #ffffff;

/* 文本色 */
--text-primary: #333333;
--text-secondary: #666666;

/* 强调色 */
--accent-color: #007bff;

/* 边框与阴影 */
--border-color: #e1e4e8;
--shadow: 0 4px 12px rgba(0,0,0,0.08);
}

/* 深色主题 (通过 data-theme="dark" 属性激活) */
[data-theme="dark"] {
--bg-body: #1a1a1a;
--bg-card: #2d2d2d;
--bg-nav: #2d2d2d;

--text-primary: #ffffff;
--text-secondary: #b0b0b0;

--accent-color: #4dabf7; /* 深色模式下通常颜色要稍微亮一点 */

--border-color: #444444;
--shadow: 0 4px 12px rgba(0,0,0,0.3);
}

/* --- 2. 应用变量 --- */

body {
background-color: var(--bg-body);
color: var(--text-primary);
font-family: -apple-system, sans-serif;
/* 核心:添加 transition 让颜色切换平滑过渡 */
transition: background-color 0.3s ease, color 0.3s ease;
margin: 0;
}

.navbar {
background-color: var(--bg-nav);
border-bottom: 1px solid var(--border-color);
padding: 15px 30px;
display: flex;
justify-content: space-between;
align-items: center;
transition: background-color 0.3s ease, border-color 0.3s ease;
}

.card {
background-color: var(--bg-card);
border: 1px solid var(--border-color);
box-shadow: var(--shadow);
padding: 25px;
border-radius: 8px;
transition: background-color 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
}

.card h2 { margin-top: 0; }

.card p { color: var(--text-secondary); }

.link { color: var(--accent-color); text-decoration: none; }


/* --- 开关按钮样式 --- */
.theme-btn {
background: transparent;
border: 1px solid var(--border-color);
color: var(--text-primary);
padding: 8px 16px;
border-radius: 20px;
cursor: pointer;
display: flex;
align-items: center;
gap: 8px;
transition: all 0.3s ease;
}

.theme-btn:hover {
background-color: var(--bg-body);
}

/* 布局辅助 */
.container { max-width: 800px; margin: 40px auto; padding: 0 20px; }
.card-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }


第三部分:JS 交互逻辑 (LocalStorage)

JavaScript 的任务不仅仅是切换类名,更重要的是持久化用户的选择。

逻辑流程:

初始化:页面加载时,检查 localStorage。如果有保存的设置,立即应用。

切换:点击按钮时,切换 html 标签上的 data-theme 属性。

保存:将当前的状态('dark' 或 'light')写入 localStorage。

document.addEventListener('DOMContentLoaded', () => {

// 1. 获取 DOM 元素
const toggleBtn = document.getElementById('theme-toggle');
const toggleIcon = toggleBtn.querySelector('.icon');
const toggleText = toggleBtn.querySelector('.text');

// 我们将把 data-theme 属性放在 <html> 标签上
const htmlElement = document.documentElement;

// --- 辅助函数:更新按钮 UI ---
const updateButtonUI = (isDark) => {
if (isDark) {
toggleIcon.textContent = '☀';
toggleText.textContent = '浅色模式';
} else {
toggleIcon.textContent = '🌙';
toggleText.textContent = '深色模式';
}
};

// --- 2. 初始化:检查本地存储 ---
// 检查用户之前是否选过
const savedTheme = localStorage.getItem('myAppTheme');

// 如果之前保存了 'dark',则立即应用
if (savedTheme === 'dark') {
htmlElement.setAttribute('data-theme', 'dark');
updateButtonUI(true);
} else {
// 默认是浅色,无需操作 (或者也可以显式设置 'light')
updateButtonUI(false);
}

// --- 3. 绑定点击事件 ---
toggleBtn.addEventListener('click', () => {

// 检查当前是否是深色模式
const currentTheme = htmlElement.getAttribute('data-theme');

if (currentTheme === 'dark') {
// -> 切换为浅色
htmlElement.setAttribute('data-theme', 'light');
localStorage.setItem('myAppTheme', 'light'); // 保存到本地
updateButtonUI(false);
} else {
// -> 切换为深色
htmlElement.setAttribute('data-theme', 'dark');
localStorage.setItem('myAppTheme', 'dark'); // 保存到本地
updateButtonUI(true);
}

});

});


总结

恭喜!您构建了一个现代化的、具备记忆功能的深色模式系统。

我们学到了:

CSS 变量 (:root):这是现代 CSS 最强大的功能之一,它彻底改变了我们管理颜色的方式。

属性选择器 ([data-theme="..."]):利用 HTML 属性来驱动 CSS 样式的变化。

LocalStorage:如何使用简单的 setItem 和 getItem 让网页拥有“记忆”,极大地提升了用户体验。

这套逻辑是通用的,您可以将其应用到任何规模的 Web 项目中。

https://weibo.com/ttarticle/p/show?id=2309405297387651596338
https://weibo.com/ttarticle/p/show?id=2309405297377375813736
https://weibo.com/ttarticle/p/show?id=2309405297350775275598
https://weibo.com/ttarticle/p/show?id=2309405297358618886311
https://weibo.com/ttarticle/p/show?id=2309405297362800607327
https://weibo.com/ttarticle/p/show?id=2309405297378029862940
https://weibo.com/ttarticle/p/show?id=2309405297411915907141
https://weibo.com/ttarticle/p/show?id=2309405297326356037735
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297377564557360
https://weibo.com/ttarticle/p/show?id=2309405297385076555780
https://weibo.com/ttarticle/p/show?id=2309405297381536301287
https://weibo.com/ttarticle/p/show?id=2309405297362301222984
https://weibo.com/ttarticle/p/show?id=2309405297380236329229
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297381096161403
https://weibo.com/ttarticle/p/show?id=2309405297393401987300
https://weibo.com/ttarticle/p/show?id=2309405297373911056509
https://weibo.com/ttarticle/p/show?id=2309405297420619088169
https://weibo.com/ttarticle/p/show?id=2309405297362674778255
https://weibo.com/ttarticle/p/show?id=2309405297413064884458
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297408363331612
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297378029862940
https://weibo.com/ttarticle/p/show?id=2309405297381905662086
https://weibo.com/ttarticle/p/show?id=2309405297371570634781
https://weibo.com/ttarticle/p/show?id=2309405297411467116680
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297384933949522
https://weibo.com/ttarticle/p/show?id=2309405297411311665258
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297324921847812
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297397055488051
https://weibo.com/ttarticle/p/show?id=2309405297404433006624
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297418588782631
https://weibo.com/ttarticle/p/show?id=2309405297408573046926
https://weibo.com/ttarticle/p/show?id=2309405297406504992885
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297380483792965
https://weibo.com/ttarticle/p/show?id=2309405297402398769170
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297399299440706
https://weibo.com/ttarticle/p/show?id=2309405297321914269789
https://weibo.com/ttarticle/p/show?id=2309405297377547517957
https://weibo.com/ttarticle/p/show?id=2309405297405414473868
https://weibo.com/ttarticle/p/show?id=2309405297357155074072
https://weibo.com/ttarticle/p/show?id=2309405297419230773542
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297399832117277
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297402704953411
https://weibo.com/ttarticle/p/show?id=2309405297416194097184
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297370605944913
https://weibo.com/ttarticle/p/show?id=2309405297402201899052
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297378244034624
https://weibo.com/ttarticle/p/show?id=2309405297412662231279
https://weibo.com/ttarticle/p/show?id=2309405297413316542636
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297376767377427
https://weibo.com/ttarticle/p/show?id=2309405297362427314290
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297401853771801
https://weibo.com/ttarticle/p/show?id=2309405297374037147717
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297417351462958
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297363110723646
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297379741139079
https://weibo.com/ttarticle/p/show?id=2309405297436133556260
https://weibo.com/ttarticle/p/show?id=2309405297399299440706
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297412662231279
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297421789298770
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297412196925442
https://weibo.com/ttarticle/p/show?id=2309405297385743450120
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297401601851695
https://weibo.com/ttarticle/p/show?id=2309405297413505548440
https://weibo.com/ttarticle/p/show?id=2309405297409852047530
https://weibo.com/ttarticle/p/show?id=2309405297379569434642
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297385512763622
https://weibo.com/ttarticle/p/show?id=2309405297423349579798
https://weibo.com/ttarticle/p/show?id=2309405297389627375643
https://weibo.com/ttarticle/p/show?id=2309405297422292615241
https://weibo.com/ttarticle/p/show?id=2309405297414893600784
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297381678907437
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297413123604632
https://weibo.com/ttarticle/p/show?id=2309405297386481647865
https://weibo.com/ttarticle/p/show?id=2309405297375798755484
https://weibo.com/ttarticle/p/show?id=2309405297341702996051
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297423936782462
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297391757819975
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297393301323887
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297421927710787
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297382069239969
https://weibo.com/ttarticle/p/show?id=2309405297322706993368
https://weibo.com/ttarticle/p/show?id=2309405297322468180069
https://weibo.com/ttarticle/p/show?id=2309405297380844503322
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297412108583006
https://weibo.com/ttarticle/p/show?id=2309405297386351362056
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297406924685440
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297388171952178
https://weibo.com/ttarticle/p/show?id=2309405297377195196693
https://weibo.com/ttarticle/p/show?id=2309405297394089852959
https://weibo.com/ttarticle/p/show?id=2309405297434611286286
https://weibo.com/ttarticle/p/show?id=2309405297349663785099
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297413606211710
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297421868990578
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297391820996799
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297438138433551
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297401413107830
https://weibo.com/ttarticle/p/show?id=2309405297326288928806
https://weibo.com/ttarticle/p/show?id=2309405297436741992710
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297400037376073
https://weibo.com/ttarticle/p/show?id=2309405297414172180537
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297397504016446
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297411467116680
https://weibo.com/ttarticle/p/show?id=2309405297377564557360
https://weibo.com/ttarticle/p/show?id=2309405297425094148113
https://weibo.com/ttarticle/p/show?id=2309405297379565240544
https://weibo.com/ttarticle/p/show?id=2309405297389845217406
https://weibo.com/ttarticle/p/show?id=2309405297404026421251
https://weibo.com/ttarticle/p/show?id=2309405297401916686378
https://weibo.com/ttarticle/p/show?id=2309405297371256324274
https://weibo.com/ttarticle/p/show?id=2309405297423093465097
https://weibo.com/ttarticle/p/show?id=2309405297350431605073
https://weibo.com/ttarticle/p/show?id=2309405297381406277848
https://weibo.com/ttarticle/p/show?id=2309405297422074249386
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297376906051612
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297394609946707
https://weibo.com/ttarticle/p/show?id=2309405297432429985859
https://weibo.com/ttarticle/p/show?id=2309405297322900193347
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297361802362960
https://weibo.com/ttarticle/p/show?id=2309405297406865702915
https://weibo.com/ttarticle/p/show?id=2309405297378239840308
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297321654222886
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297322141024327
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297393238671546
https://weibo.com/ttarticle/p/show?id=2309405297393649451016
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297395289424015
https://weibo.com/ttarticle/p/show?id=2309405297378168275205
https://weibo.com/ttarticle/p/show?id=2309405297368676827147
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297433994461408
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297354269393074
https://weibo.com/ttarticle/p/show?id=2309405297408677904396
https://weibo.com/ttarticle/p/show?id=2309405297410997354502
https://weibo.com/ttarticle/p/show?id=2309405297355498062050
https://weibo.com/ttarticle/p/show?id=2309405297388171952178
https://weibo.com/ttarticle/p/show?id=2309405297434804224117
https://weibo.com/ttarticle/p/show?id=2309405297395818168529
https://weibo.com/ttarticle/p/show?id=2309405297390034223324
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297359965258085
https://weibo.com/ttarticle/p/show?id=2309405297407675465837
https://weibo.com/ttarticle/p/show?id=2309405297404961751094
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297412800905229
https://weibo.com/ttarticle/p/show?id=2309405297380139597880
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297368366448803
https://weibo.com/ttarticle/p/show?id=2309405297398804250732
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297380298981477
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297437215686756
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297346291826705
https://weibo.com/ttarticle/p/show?id=2309405297322635952146
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297370929168713
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297414415712266
https://weibo.com/ttarticle/p/show?id=2309405297349714116642
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297395541082115
https://weibo.com/ttarticle/p/show?id=2309405297394798690362
https://weibo.com/ttarticle/p/show?id=2309405297404299051164
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297412100194384
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297404642722065
https://weibo.com/ttarticle/p/show?id=2309405297423789719577
https://weibo.com/ttarticle/p/show?id=2309405297405481844739
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297412704436246
https://weibo.com/ttarticle/p/show?id=2309405297393376821329
https://weibo.com/ttarticle/p/show?id=2309405297412238868556
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297364641907037
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297362301222984
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297392550805544
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297413249695894
https://weibo.com/ttarticle/p/show?id=2309405297415375945865
https://weibo.com/ttarticle/p/show?id=2309405297417225895977
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297373680369994
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297405502816367
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297377803370726
https://weibo.com/ttarticle/p/show?id=2309405297394609946707
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297364369014916
https://weibo.com/ttarticle/p/show?id=2309405297438138433551
https://weibo.com/ttarticle/p/show?id=2309405297411727163517
https://weibo.com/ttarticle/p/show?id=2309405297377060978705
https://weibo.com/ttarticle/p/show?id=2309405297322141024327
https://weibo.com/ttarticle/p/show?id=2309405297355716427999
https://weibo.com/ttarticle/p/show?id=2309405297355276025913
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297398141812740
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297420463636509
https://weibo.com/ttarticle/p/show?id=2309405297322304602206
https://weibo.com/ttarticle/p/show?id=2309405297395809517580
https://weibo.com/ttarticle/p/show?id=2309405297412108583006
https://weibo.com/ttarticle/p/show?id=2309405297358417559944
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297379565240544
https://weibo.com/ttarticle/p/show?id=2309405297378378252404
https://weibo.com/ttarticle/p/show?id=2309405297391820996799
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297390541471836
https://weibo.com/ttarticle/p/show?id=2309405297382354190482
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297400322588793
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297410997354502
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297439262769302
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297379766567082
https://weibo.com/ttarticle/p/show?id=2309405297417251061925
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297405603479555
https://weibo.com/ttarticle/p/show?id=2309405297415174881473
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297434556760261
https://weibo.com/ttarticle/p/show?id=2309405297363110723646
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297407935512613
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297391988506729
https://weibo.com/ttarticle/p/show?id=2309405297385739255895
https://weibo.com/ttarticle/p/show?id=2309405297381859524642
https://weibo.com/ttarticle/p/show?id=2309405297363681411161
https://weibo.com/ttarticle/p/show?id=2309405297405544497198
https://weibo.com/ttarticle/p/show?id=2309405297406307860497
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297422292615241
https://weibo.com/ttarticle/p/show?id=2309405297300435238951
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297350167101443
https://weibo.com/ttarticle/p/show?id=2309405297404760162345
https://weibo.com/ttarticle/p/show?id=2309405297387735482431
https://weibo.com/ttarticle/p/show?id=2309405297406173642891
https://weibo.com/ttarticle/p/show?id=2309405297412465361120
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297391217016996
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297417037152304
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297324515000671
https://weibo.com/ttarticle/p/show?id=2309405297388109037700
https://weibo.com/ttarticle/p/show?id=2309405297361672339668
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297436741992710
https://weibo.com/ttarticle/p/show?id=2309405297382278692902
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297389346095176
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297379665641547
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297384766177529
https://weibo.com/ttarticle/p/show?id=2309405297367829577964
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297346652274771
https://weibo.com/ttarticle/p/show?id=2309405297377832992927
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297385076555780
https://weibo.com/ttarticle/p/show?id=2309405297406060396691
https://weibo.com/ttarticle/p/show?id=2309405297381796347992
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297296748707916
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297320152924298
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297431364894943
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297378956804157
https://weibo.com/ttarticle/p/show?id=2309405297408514064419
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297413505548440
https://weibo.com/ttarticle/p/show?id=2309405297409533280362
https://weibo.com/ttarticle/p/show?id=2309405297416911061161
https://weibo.com/ttarticle/p/show?id=2309405297415636254803
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297382186418445
https://weibo.com/ttarticle/p/show?id=2309405297325949190331
https://weibo.com/ttarticle/p/show?id=2309405297395587219540
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297387735482431
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297381536301287
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297412326686974
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297408979894275
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297415581466745
https://weibo.com/ttarticle/p/show?id=2309405297394593169496
https://weibo.com/ttarticle/p/show?id=2309405297404160376953
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297377119699068
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297403078246451
https://weibo.com/ttarticle/p/show?id=2309405297322388488333
https://weibo.com/ttarticle/p/show?id=2309405297415443054795
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297407419613191
https://weibo.com/ttarticle/p/show?id=2309405297350322553180
https://weibo.com/ttarticle/p/show?id=2309405297403078246451
https://weibo.com/ttarticle/p/show?id=2309405297404881797321
https://weibo.com/ttarticle/p/show?id=2309405297417854779592
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297393401987300
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297413316542718
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297355804246049
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297378659008535
https://weibo.com/ttarticle/p/show?id=2309405297415141064839
https://weibo.com/ttarticle/p/show?id=2309405297323172823093
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297350775275598
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297377392591150
https://weibo.com/ttarticle/p/show?id=2309405297420463636509
https://weibo.com/ttarticle/p/show?id=2309405297372170682508
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297391539716173
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297437073080448
https://weibo.com/ttarticle/p/show?id=2309405297395549470753
https://weibo.com/ttarticle/p/show?id=2309405297378810003616
https://weibo.com/ttarticle/p/show?id=2309405297405158621206
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297405939023965
https://weibo.com/ttarticle/p/show?id=2309405297370396229731
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297322635952146
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297438994071634
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297322984079365
https://weibo.com/ttarticle/p/show?id=2309405297327798878709
https://weibo.com/ttarticle/p/show?id=2309405297437593436172
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297386754277410
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297378860335427
https://weibo.com/ttarticle/p/show?id=2309405297397055488051
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297432429985859
https://weibo.com/ttarticle/p/show?id=2309405297433592070424
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297392613720101
https://weibo.com/ttarticle/p/show?id=2309405297431104585732
https://weibo.com/ttarticle/p/show?id=2309405297399832117277
https://weibo.com/ttarticle/p/show?id=2309405297402520404062
https://weibo.com/ttarticle/p/show?id=2309405297394345967681
https://weibo.com/ttarticle/p/show?id=2309405297392836018217
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297321839034530
https://weibo.com/ttarticle/p/show?id=2309405297407218024496
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297416034451500
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297350481936422
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297352767570256
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297431272358036
https://weibo.com/ttarticle/p/show?id=2309405297370849214552
https://weibo.com/ttarticle/p/show?id=2309405297417729212593
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297398804250732
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297350536200319
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297322547609748
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297414818103354
https://weibo.com/ttarticle/p/show?id=2309405297412733796456
https://weibo.com/ttarticle/p/show?id=2309405297391539716173
https://weibo.com/ttarticle/p/show?id=2309405297386821124176
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297355498062050
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297390034223324
https://weibo.com/ttarticle/p/show?id=2309405297393372889190
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297380907417867
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297437413081204
https://weibo.com/ttarticle/p/show?id=2309405297408287834197
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297414172180537
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297352335556744
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297394220138651
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297322706993368
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297423647113223
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297396941979780
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297410695364719
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297388109037700
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297373911056509
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297432887427316
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297372254568476
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297326083407913
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297400243159197
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297349810585719
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297405364404335
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297397176860934
https://weibo.com/ttarticle/p/show?id=2309405297432644157590
https://weibo.com/ttarticle/p/show?id=2309405297385877405755
https://weibo.com/ttarticle/p/show?id=2309405297416357675117
https://weibo.com/ttarticle/p/show?id=2309405297346291826705
https://weibo.com/ttarticle/p/show?id=2309405297405901275173
https://weibo.com/ttarticle/p/show?id=2309405297377803370726
https://weibo.com/ttarticle/p/show?id=2309405297399488184401
https://weibo.com/ttarticle/p/show?id=2309405297379866968237
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297385739255895
https://weibo.com/ttarticle/p/show?id=2309405297394861867209
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297374720819267
https://weibo.com/ttarticle/p/show?id=2309405297379741139079
https://weibo.com/ttarticle/p/show?id=2309405297421789298770
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297394157224256
https://weibo.com/ttarticle/p/show?id=2309405297372602433641
https://weibo.com/ttarticle/p/show?id=2309405297418098311229
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297393498718261
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297393687199939
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297406303928380
https://weibo.com/ttarticle/p/show?id=2309405297433696665857
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297379829481503
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297415757627570
https://weibo.com/ttarticle/p/show?id=2309405297412863819851
https://weibo.com/ttarticle/p/show?id=2309405297434137067618
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297367829577964
https://weibo.com/ttarticle/p/show?id=2309405297395667173388
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297364222476678
https://weibo.com/ttarticle/p/show?id=2309405297328792928371
https://weibo.com/ttarticle/p/show?id=2309405297433277235214
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297398925885549
https://weibo.com/ttarticle/p/show?id=2309405297409885601990
https://weibo.com/ttarticle/p/show?id=2309405297413379719219
https://weibo.com/ttarticle/p/show?id=2309405297409625555092
https://weibo.com/ttarticle/p/show?id=2309405297419532501256
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297405867458758
https://weibo.com/ttarticle/p/show?id=2309405297375160959123
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297379993059578
https://weibo.com/ttarticle/p/show?id=2309405297380576067925
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297380710023431
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297350217433323
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297413379719219
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297409344798729
https://weibo.com/ttarticle/p/show?id=2309405297321839034530
https://weibo.com/ttarticle/p/show?id=2309405297389346095176
https://weibo.com/ttarticle/p/show?id=2309405297372766011469
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297418198712493
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297385139470635
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297373588357325
https://weibo.com/ttarticle/p/show?id=2309405297424079388716
https://weibo.com/ttarticle/p/show?id=2309405297434032210139
https://weibo.com/ttarticle/p/show?id=2309405297383851819264
https://weibo.com/ttarticle/p/show?id=2309405297394966462488
https://weibo.com/ttarticle/p/show?id=2309405297394094309687
https://weibo.com/ttarticle/p/show?id=2309405297378717991171
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297397789229082
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297419394089020
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297411660054779
https://weibo.com/ttarticle/p/show?id=2309405297413732040795
https://weibo.com/ttarticle/p/show?id=2309405297368366448803
https://weibo.com/ttarticle/p/show?id=2309405297437413081204
https://weibo.com/ttarticle/p/show?id=2309405297392055615493
https://weibo.com/ttarticle/p/show?id=2309405297380642914361
https://weibo.com/ttarticle/p/show?id=2309405297417603121442
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297394018811955
https://weibo.com/ttarticle/p/show?id=2309405297374011719777
https://weibo.com/ttarticle/p/show?id=2309405297385004990726
https://weibo.com/ttarticle/p/show?id=2309405297370480377914
https://weibo.com/ttarticle/p/show?id=2309405297417351462958
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297404299051164
https://weibo.com/ttarticle/p/show?id=2309405297399110434915
https://weibo.com/ttarticle/p/show?id=2309405297418186391790
https://weibo.com/ttarticle/p/show?id=2309405297395394281493
https://weibo.com/ttarticle/p/show?id=2309405297394736037965
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297388088066380
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297410586050736
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297385470820661
https://weibo.com/ttarticle/p/show?id=2309405297431272358036
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297350431605073
https://weibo.com/ttarticle/p/show?id=2309405297373814587685
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297408904134671
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297386351362056
https://weibo.com/ttarticle/p/show?id=2309405297323156045845
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297401002328165
https://weibo.com/ttarticle/p/show?id=2309405297398376431823
https://weibo.com/ttarticle/p/show?id=2309405297389245694013
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297416453882007
https://weibo.com/ttarticle/p/show?id=2309405297321155100860
https://weibo.com/ttarticle/p/show?id=2309405297421009158259
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297398250864732
https://weibo.com/ttarticle/p/show?id=2309405297397772714174
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297412998037531
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297394224070912
https://weibo.com/ttarticle/p/show?id=2309405297390717894957
https://weibo.com/ttarticle/p/show?id=2309405297374213046291
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297414893600784
https://weibo.com/ttarticle/p/show?comment=1&id=2309405297406626627737

http://www.jsqmd.com/news/798660/

相关文章:

  • 从标注到训练:用Labelme+Anaconda搞定YOLO/UNet数据集全流程(以车辆检测为例)
  • 别再傻傻分不清了!UE5材质节点ActorPosition与ObjectPosition实战避坑指南
  • CoQA 数据集介绍
  • Vue3 监听器 watch 监听不到数组长度变化?深度解析数组响应式避坑指南.txt
  • 2026年华为mate80新手机会预装一些如咸鱼的第三方软件吗?靠谱吗?
  • 技术产品设计:如何避免复杂性暴露与响应缓慢导致用户体验灾难
  • #33 Agent 的可观测性:日志、追踪、监控与性能分析(LangSmith、Wandb)
  • 深入MFGTool2:拆解I.MX6U双阶段烧录原理,从BootStrap到Updater的完整流程分析
  • 从2012 CES看技术演进:移动计算、物联网与生态博弈
  • UniApp引导页从开发到上线的完整避坑指南:我用Swiper组件踩过的那些雷
  • 从原子到应用:下一代AI计算的跨学科融合与硬件革新
  • 2026制造业线上推广公司技术与效果评估报告:五大优选品牌解析 - GEO优化
  • 【Claude vs ChatGPT终极对决】:20年AI架构师实测12项核心指标,谁才是真正生产力引擎?
  • 苹果计划在Safari引入AI标签页自动整理功能,iOS 27将提升系统智能化体验
  • 树莓派新手别怕!保姆级教程:用Nano和Vim编辑文件的完整流程与避坑指南
  • Linux服务器上Java AES256解密报错?手把手教你搞定BouncyCastle依赖与JCE策略文件
  • bootstrap怎么修改按钮禁用状态下的鼠标指针样式
  • 3大核心技术深度解析:如何彻底解决硬件风扇控制难题
  • 传感器融合与ASSN:从算法原理到工程选型实战
  • 假脱机技术原理详解
  • 深度相机三剑客:TOF、双目与结构光的场景化选型指南
  • 鸿蒙系统和苹果ios系统对比?
  • 哨兵1号数据处理必备:如何高效获取精密轨道与SRTM DEM数据(附最新可用链接)
  • 1997年技术媒体如何应对嵌入式与DSP信息浪潮:深度内容、CD-ROM与早期网站
  • 低延迟无线系统设计:从射频到应用的延迟优化实战
  • 别再只用LSTM了!试试用1DCNN处理时间序列数据:一个完整的TensorFlow案例对比
  • AI大模型选型生死线(2026企业级部署避坑指南)
  • Anthotype印相正在消失!20年暗房大师紧急抢救:用Midjourney重建19世纪植物成像协议
  • 从ARIMA差分到MIM神经网络:一个老统计思想如何拯救深度学习时空预测
  • 技术、强制力与权力:从棉花帝国到数字时代的控制逻辑