杰~JIE
杰~JIE

《前端与SEO》—— 第四章：meta 与 SEO

前言

编写过HTML文档的朋友对meta元素一定不陌生，meta元素有一项非常重要的作用就是声明当前网页（即，HTML 文档）的基础信息。这些基础信息有个专业术语，叫“元数据（Metadata）”。元数据是 SEO 一个非常重要的工具。搜索引擎就是通过这些元数据来认识网页的。

认识元数据(meta)

什么是元数据（Metadata）？

Metadata——元数据，简单的来说就是描述数据的数据。

摘自——《Metadata - 术语表 | MDN (mozilla.org)》

meta元素用于设置当前网页的元数据。例如：网页描述、作者、针对搜素引擎的关键字等等。

meta 元素有如下特性：

  • 是一个空元素（void element）
  • 一般情况下，meta元素都存放在元素中。
  • 必须存在开始标记（）且不能存在结束标记（/或）。例如：
  • meta元素主要服务于机器。尽管meta元素不会显示在页面上，但是浏览器、搜索引擎抓取工具1、服务器等等都能使用这些信息。

除此之外，meta元素还有以下特性。

  • 一般情况下 ，元素属于元数据内容（Metadata content）。但是如果元素添加了itemprop属性，元素可作为 flow content, phrasing content.
  • 允许编写在【、 接收 metadata content 内容的元素、接收 flow content 内容的元素】中；
    • 、必须写在中;
    • 可以写在任何可以接收 metadata content 内容的标签中
    • 可以写在任何可以接收 metadata content 或 flow content 内容的标签中

注意：在 XHTML 中 标签必须包含结束标签。

上面关于的描述有些拗口，可以不用深入了解。只需要知道，和SEO有关即可；一般情况下，存放在中。

与SEO相关的meta元素

meta元素的用途有很多。有控制页面刷新的；有设置移动端显示效果的；也有和SEO相关的。

接下来，简单讲讲那些和SEO相关的meta元素。

页面标题

</code>标签是用于设置网页标题。尽管它并不是通过<code><meta></code>设置，但它是SEO中非常重要的元数据。</p> <p>google 对网页标题做如下描述：</p> <blockquote> <p>标题链接非常重要，它可以让用户快速了解某条搜索结果的内容以及该结果与其查询相关的原因。它常常是用户在决定点击哪个结果时参考的主要信息，因此为您的网页提供高品质的标题文字非常重要。</p> <p>摘抄自——《如何更改 Google 搜索中的标题链接 | Google 搜索中心 | 文档 | Google Developers》</p> </blockquote> <blockquote> <p>这里的标题链接就是网页标题。</p> </blockquote> <p>写法如下：</p> <pre><code class="prism language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>title</span><span class="token punctuation">></span></span>页面标题<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>title</span><span class="token punctuation">></span></span> </code></pre> <p>设置标题时，需要注意一下几点：</p> <ul> <li><strong>确保 <code><title></code>内容和网页内容有较强的关联性</strong>。避免题不对文。</li> <li>确保<strong>为每个网页分别指定一个标题</strong>。</li> <li>为 <code><title></code>元素编写<strong>简练的描述性</strong>文字。</li> <li>避免<strong>关键字堆砌</strong>。在 <code><title></code> 元素中包含几个描述性词汇有时会有帮助，但请勿多次重复使用相同的字词或短语。</li> <li>避免 <strong><code><title></code>元素中出现重复或样板化的文字</strong>。</li> </ul> <blockquote> <p>更多相关内容请看：如何更改 Google 搜索中的标题链接 | Google 搜索中心 | 文档 | Google Developers</p> </blockquote> <h2>网页摘要</h2> <p>网页摘要是对网页内容的精炼提取。摘要会显示在搜索结果页上，有助于用户对网页有初步的了解。</p> <p>写法如下：</p> <pre><code class="prism language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>meta</span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>description<span class="token punctuation">"</span></span> <span class="token attr-name">content</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>这里是网页摘要！<span class="token punctuation">"</span></span> <span class="token punctuation">></span></span> </code></pre> <p>编写摘要有如下要点：</p> <ul> <li>尽量与页面内容有强关联性。</li> <li>尽量能够准确概括特定网页。避免网站中所有网页的摘要都一样。</li> </ul> <blockquote> <p>更多相关内容——如何撰写元描述 | Google 搜索中心 | 文档 | Google Developers</p> </blockquote> <h2>关键字</h2> <p>关键字即搜索关键字，是网页内容高度凝练的词组列表。关键字有助于搜索引擎索引查找网页。</p> <p>写法如下：</p> <pre><code class="prism language-html"><meta name="keywords" content="关键字1,关键字2,关键字3“ > </code></pre> <p>编写关键字时有如下要点：</p> <ul> <li>关键字之间要用英文逗号<code>,</code>分隔。</li> <li>关键字要和网页内容有关联性。避免不相关的关键字。</li> <li>设置适量的关键字。关键字太少没法完全体现网页内容，但一味的追求大量的关键字就会照成<strong>关键字堆砌</strong>。能充分体现网页内容即可。</li> <li>避免关键字堆砌。</li> </ul> <blockquote> <p>“关键字堆砌”是指在网页中加入大量关键字或数字，试图操纵网站在 Google 搜索结果中的排名。这些关键字通常以列表或群组形式显示，或与上下文无关（内容不自然）。在网页中加入大量关键字或数字会对用户体验产生负面影响，因而可能损害网站排名。请集中精力创建实用、信息丰富的内容，并使用与上下文相关的恰当关键字。</p> <p>摘自——《不相关的关键字和关键字堆砌 | Google 搜索中心 | 文档 | Google Developers》</p> </blockquote> <h2>网页作者</h2> <p>网页开发者也是网页信息的一部分。可以如下设置：</p> <pre><code class="prism language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>meta</span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>author<span class="token punctuation">"</span></span> <span class="token attr-name">content</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>作者1,作者2，作者3<span class="token punctuation">"</span></span> <span class="token punctuation">></span></span> </code></pre> <blockquote> <p>注意：多个作者之前用英文逗号间隔。</p> </blockquote> <h2>抓取工具行为的控制</h2> <p>借助<code><meta name="robots"></code>可以控制抓取工具的行为。</p> <p>写法如下：</p> <pre><code class="prism language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>meta</span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>robots<span class="token punctuation">"</span></span> <span class="token attr-name">content</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>index,follow<span class="token punctuation">"</span></span> <span class="token punctuation">/></span></span> </code></pre> <blockquote> <p>META name=“robots” 值域说明：</p> <table> <thead> <tr> <th align="left">值</th> <th align="left">描述</th> <th align="left">被用于</th> </tr> </thead> <tbody> <tr> <td align="left"><code>index</code></td> <td align="left">允许机器人索引此页面（默认）。</td> <td align="left">所有爬虫</td> </tr> <tr> <td align="left"><code>noindex</code></td> <td align="left">要求机器人不索引此页面。</td> <td align="left">所有爬虫</td> </tr> <tr> <td align="left"><code>follow</code></td> <td align="left">允许机器人跟随此页面上的链接（默认）。</td> <td align="left">所有爬虫</td> </tr> <tr> <td align="left"><code>nofollow</code></td> <td align="left">要求机器人不跟随此页面上的链接。</td> <td align="left">所有爬虫</td> </tr> <tr> <td align="left"><code>all</code></td> <td align="left">与 <code>index, follow</code> 等价</td> <td align="left">Google</td> </tr> <tr> <td align="left"><code>none</code></td> <td align="left">与 <code>noindex, nofollow</code> 等价</td> <td align="left">Google</td> </tr> <tr> <td align="left"><code>noarchive</code></td> <td align="left">要求搜索引擎不缓存页面内容。</td> <td align="left">Google、Yahoo、Bing</td> </tr> <tr> <td align="left"><code>nosnippet</code></td> <td align="left">防止在搜索引擎结果中显示页面的任何描述。</td> <td align="left">Google、Bing</td> </tr> <tr> <td align="left"><code>noimageindex</code></td> <td align="left">请求该页不显示为索引图像的引用页。</td> <td align="left">Google</td> </tr> <tr> <td align="left"><code>nocache</code></td> <td align="left">不要缓存该页面。<code>noarchive</code> 的替代名称。</td> <td align="left">Bing</td> </tr> </tbody> </table> <p>摘自——《标准元数据名称 - HTML（超文本标记语言） | MDN (mozilla.org)》</p> </blockquote> <p>上面这些 meta 元素都是通用性的。除此之外，不同的搜索引擎会为自己的爬虫机器人制定专门的 meta 元素。</p> <p>例如 Google 专用的:</p> <pre><code class="prism language-html"><span class="token comment"><!-- 作用等同于 name="robots",但只对谷歌搜索引擎的爬虫机器人有效 --></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>meta</span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>googlebot<span class="token punctuation">"</span></span> <span class="token attr-name">content</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>index,follow<span class="token punctuation">"</span></span> <span class="token punctuation">/></span></span> <span class="token comment"><!-- 用于告知 Google 不要显示站点链接搜索框 --></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>meta</span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>google<span class="token punctuation">"</span></span> <span class="token attr-name">content</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>nositelinkssearchbox<span class="token punctuation">"</span></span> <span class="token punctuation">/></span></span> <span class="token comment"><!-- 用于告知 Google 您不希望提供该网页的翻译 --></span> <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>meta</span> <span class="token attr-name">name</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>googlebot<span class="token punctuation">"</span></span> <span class="token attr-name">content</span><span class="token attr-value"><span class="token punctuation attr-equals">=</span><span class="token punctuation">"</span>notranslate<span class="token punctuation">"</span></span> <span class="token punctuation">/></span></span> </code></pre> <blockquote> <p>更多 Google 相关的 meta 元素，可查阅：《Google 可以识别的元标记和内嵌标记 | Google 搜索中心 | 文档 | Google Developers》</p> </blockquote> <h1>结语</h1> <p><code><meta></code>对SEO非常重要。它有助于搜索引擎了解页面的信息内容。这里只是列举了一些重要且常用的 SEO 相关元数据。其中<strong>标题、摘要、关键字</strong>最为重要。它们影响着页面在搜索引擎结果页中的显示效果和排名，是 SEO 非常重要的一环。</p> <hr class="footnotes-sep"> <ol class="footnotes-list"> <li id="fn1" class="footnote-item"><p>搜索引擎抓取工具是一种由搜索引擎公司开发的自动访问网站并收录网站的脚本机器人。俗称爬虫。 ↩︎</p> </li> </ol> </div> </div> </div> </div> </div> <!--PC和WAP自适应版--> <div id="SOHUCS" sid="1670606366114406400"></div> <script type="text/javascript" src="/views/front/js/chanyan.js"></script> <!-- 文章页-底部 动态广告位 --> <div class="youdao-fixed-ad" id="detail_ad_bottom"></div> </div> <div class="col-md-3"> <div class="row" id="ad"> <!-- 文章页-右侧1 动态广告位 --> <div id="right-1" class="col-lg-12 col-md-12 col-sm-4 col-xs-4 ad"> <div class="youdao-fixed-ad" id="detail_ad_1"> </div> </div> <!-- 文章页-右侧2 动态广告位 --> <div id="right-2" class="col-lg-12 col-md-12 col-sm-4 col-xs-4 ad"> <div class="youdao-fixed-ad" id="detail_ad_2"></div> </div> <!-- 文章页-右侧3 动态广告位 --> <div id="right-3" class="col-lg-12 col-md-12 col-sm-4 col-xs-4 ad"> <div class="youdao-fixed-ad" id="detail_ad_3"></div> </div> </div> </div> </div> </div> </div> <div class="container"> <h4 class="pt20 mb15 mt0 border-top">你可能感兴趣的:(SEO,搜索引擎,前端,meta,SEO)</h4> <div id="paradigm-article-related"> <div class="recommend-post mb30"> <ul class="widget-links"> <li><a href="/article/1900664166356676608.htm" title="模拟类似 DeepSeek 的对话" target="_blank">模拟类似 DeepSeek 的对话</a> <span class="text-muted">二川bro</span> <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/%E6%99%BA%E8%83%BDAI/1.htm">智能AI</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/%E4%BA%BA%E5%B7%A5%E6%99%BA%E8%83%BD/1.htm">人工智能</a> <div>以下是一个完整的JavaScript数据流式获取实现方案，模拟类似DeepSeek的对话式逐段返回效果。包含前端实现、后端模拟和详细注释：流式对话演示#output{border:1pxsolid#ccc;padding:20px;margin:20px;min-height:200px;font-family:monospace;white-space:pre-wrap;}.loading{di</div> </li> <li><a href="/article/1900662653718687744.htm" title="前端工具链：Gulp和Grunt有什么区别？如何使用它们进行自动化构建？" target="_blank">前端工具链：Gulp和Grunt有什么区别？如何使用它们进行自动化构建？</a> <span class="text-muted">破碎的天堂鸟</span> <a class="tag" taget="_blank" href="/search/%E5%AD%A6%E4%B9%A0%E6%95%99%E7%A8%8B/1.htm">学习教程</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/gulp/1.htm">gulp</a><a class="tag" taget="_blank" href="/search/%E8%87%AA%E5%8A%A8%E5%8C%96/1.htm">自动化</a> <div>Gulp和Grunt是前端开发中常用的自动化构建工具，它们都基于Node.js，但它们在设计理念、使用方式和性能表现上存在显著差异。以下将详细说明它们的区别以及如何使用它们进行自动化构建。Gulp与Grunt的区别1.设计理念Grunt：基于配置（Configuration-based）。Grunt通过定义任务配置文件（如Gruntfile.js）来完成任务，强调的是“配置优于代码”，即通过配置文</div> </li> <li><a href="/article/1900649276267098112.htm" title="XMI（XML Metadata Interchange）和XML之间的关系" target="_blank">XMI（XML Metadata Interchange）和XML之间的关系</a> <span class="text-muted">huaqianzkh</span> <a class="tag" taget="_blank" href="/search/%E6%9E%B6%E6%9E%84%E7%90%86%E8%A7%A3%E4%B8%8E%E5%AE%9E%E8%B7%B5/1.htm">架构理解与实践</a><a class="tag" taget="_blank" href="/search/xml/1.htm">xml</a> <div>XMI（XMLMetadataInterchange）和XML之间的关系可以从以下几个方面进行阐述：一、定义与背景XML：XML（eXtensibleMarkupLanguage）是一种标记语言，被设计用来传输和存储数据。它是一种自描述的语言，即标签（tags）是由用户定义的，因此XML文档的结构和内容可以由创建者自行决定。XMI：XMI（XMLMetadataInterchange）是由OMG（</div> </li> <li><a href="/article/1900646246197030912.htm" title="前端流式输出实现详解：从原理到实践" target="_blank">前端流式输出实现详解：从原理到实践</a> <span class="text-muted">代码剑客588</span> <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>前端流式输出实现详解：从原理到实践前言一、流式输出核心原理1.1什么是流式输出？1.2技术优势对比1.3关键技术支撑二、原生JavaScript实现方案2.1使用FetchAPI流式处理关键点解析：2.2处理SSE（Server-SentEvents）三、主流框架实现示例3.1React实现方案3.2Vue实现方案四、高级优化策略4.1性能优化4.2用户体验增强4.3安全注意事项五、实际应用案例5</div> </li> <li><a href="/article/1900645489993379840.htm" title="全网最全luckysheet协同编辑导出功能，包含单元格样式、超链接、数据验证、条件格式、图片导出、批注、数据透视图等等复杂功能的导出" target="_blank">全网最全luckysheet协同编辑导出功能，包含单元格样式、超链接、数据验证、条件格式、图片导出、批注、数据透视图等等复杂功能的导出</a> <span class="text-muted">熙熙鬼</span> <a class="tag" taget="_blank" href="/search/vue.js/1.htm">vue.js</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>前言：最近公司准备研究使用luckySheet，为了开源节流，在开掉了前端大佬的情况下，这苦差事儿落在了我这个前端菜鸟身上。无奈，只能打开luckysheet官网，仔细研读文档，并照着敲了个在线协同的demo。本以为这事儿算是结束，谁知，公司来了新需求，要做导入导出功能，又是一番查找资料后，决定先做导出，哈哈哈，别问为什么，问就是因为导出相关的文档丰富，可操作性强。废话结束，进入正题：1.在官网找</div> </li> <li><a href="/article/1900642088417030144.htm" title="前端请求全面解析：AJAX、Axios 与 Fetch 的使用详解与代码示例" target="_blank">前端请求全面解析：AJAX、Axios 与 Fetch 的使用详解与代码示例</a> <span class="text-muted">二进制忍者</span> <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/ajax/1.htm">ajax</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a> <div>前端请求全面解析：AJAX、Axios与Fetch的使用详解与代码示例前端请求全面解析：AJAX、Axios与Fetch的使用详解与代码示例1.AJAX——传统的异步请求1.1基本用法示例1.2AJAX特点2.FetchAPI——现代化请求方案2.1基本用法示例2.2Fetch特点3.Axios——第三方HTTP请求库3.1安装Axios3.2基本用法示例3.3Axios特点4.总结前端请求全面解</div> </li> <li><a href="/article/1900628203911835648.htm" title="Vue Markdown 编辑器全攻略：轻松集成 MD 编辑器到前端项目" target="_blank">Vue Markdown 编辑器全攻略：轻松集成 MD 编辑器到前端项目</a> <span class="text-muted">算法探险家</span> <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/vue.js/1.htm">vue.js</a><a class="tag" taget="_blank" href="/search/%E7%BC%96%E8%BE%91%E5%99%A8/1.htm">编辑器</a> <div>VueMarkdown编辑器全攻略：轻松集成MD编辑器到前端项目1.为什么选择Markdown编辑器？2.安装v-md-editor3.全局配置与集成4.在组件中使用Markdown编辑器5.高级配置与自定义功能6.总结在现代前端开发中，Markdown编辑器被广泛应用于博客、内容管理系统、在线文档等场景。本文将以Vue3为例，详细介绍如何使用v-md-editor库在项目中集成Markdown编</div> </li> <li><a href="/article/1900626061155168256.htm" title="知识库全链路交互逻辑" target="_blank">知识库全链路交互逻辑</a> <span class="text-muted">賢843</span> <a class="tag" taget="_blank" href="/search/%E8%BD%AF%E4%BB%B6%E6%B5%8B%E8%AF%95%E7%90%86%E8%AE%BA%E5%9F%BA%E7%A1%80/1.htm">软件测试理论基础</a><a class="tag" taget="_blank" href="/search/python/1.htm">python</a> <div>阶段顺序URL输入→网络连接→前端请求→后端处理→数据库交互→数据返回→前端渲染→连接关闭阶段1：用户输入URL用户行为：在浏览器地址栏输入`https://knowledge.com/search?keyword=金融趋势`浏览器动作：“浏览器解析URL：​协议补全：若用户省略协议，浏览器自动添加https://（若网站支持HTTPS）​字符转义：对中文、空格等特殊字符编码（如金融趋势→%E9%</div> </li> <li><a href="/article/1900621269456449536.htm" title="Milvus 本地Ollama向量化markdown文件" target="_blank">Milvus 本地Ollama向量化markdown文件</a> <span class="text-muted">慌雨</span> <a class="tag" taget="_blank" href="/search/milvus/1.htm">milvus</a><a class="tag" taget="_blank" href="/search/%E6%95%B0%E6%8D%AE%E5%BA%93/1.htm">数据库</a> <div>提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档文章目录前言代码测试注意前言提示：这里可以添加本文要记录的大概内容：我在局域网内安装了milvus服务，现在需要把一个文件夹里所有的markdown文档都向量化到milvus数据库中。所用的切分方法是langchain中自带的markdown按照标题切分，且带有标题的metadata，非常清晰。但是用langchain提供的milvu</div> </li> <li><a href="/article/1900618621839798272.htm" title="Sass (Scss) 与 Less 的区别与选择" target="_blank">Sass (Scss) 与 Less 的区别与选择</a> <span class="text-muted">智能编织者</span> <a class="tag" taget="_blank" href="/search/sass/1.htm">sass</a><a class="tag" taget="_blank" href="/search/scss/1.htm">scss</a><a class="tag" taget="_blank" href="/search/less/1.htm">less</a> <div>Sass与Less的区别与选择1.语法差异2.特性与支持3.兼容性4.选择建议在前端开发中，CSS预处理器如Sass（SyntacticallyAwesomeStylesheets）和Less被广泛使用，它们通过引入变量、嵌套规则、混合、函数等特性，使CSS的开发过程更加高效和灵活。Sass和Less作为两大主流CSS预处理器，各自具有独特的优点和特性。本文将详细探讨Sass（特别是其语法扩展Sc</div> </li> <li><a href="/article/1900602860882685952.htm" title="idea java cpu100_Intellij Idea cpu 100% 卡顿 解决办法" target="_blank">idea java cpu100_Intellij Idea cpu 100% 卡顿 解决办法</a> <span class="text-muted">weixin_39968760</span> <div>配置文件位置修改配置文件idea.vmoptions具体参数配置#堆栈设置-Xms4096m-Xmx4096m-Xmn3072m-XX:MetaspaceSize=1024m-XX:MaxMetaspaceSize=1024m-XX:+AlwaysPreTouch-XX:InitialCodeCacheSize=1200m-XX:ReservedCodeCacheSize=1200m-XX:+Us</div> </li> <li><a href="/article/1900596552402006016.htm" title="泛目录程序：站群策略在SEO优化中的优势与应用" target="_blank">泛目录程序：站群策略在SEO优化中的优势与应用</a> <span class="text-muted">奥顺互联_老张</span> <a class="tag" taget="_blank" href="/search/%E7%AB%99%E7%BE%A4/1.htm">站群</a><a class="tag" taget="_blank" href="/search/php/1.htm">php</a><a class="tag" taget="_blank" href="/search/%E6%95%B0%E6%8D%AE%E5%BA%93/1.htm">数据库</a><a class="tag" taget="_blank" href="/search/%E7%BC%93%E5%AD%98/1.htm">缓存</a><a class="tag" taget="_blank" href="/search/%E6%90%9C%E7%B4%A2%E5%BC%95%E6%93%8E/1.htm">搜索引擎</a> <div>泛目录程序案例：站群策略在SEO优化中的优势与应用引言在当今竞争激烈的互联网环境中，搜索引擎优化（SEO）已成为企业提升在线可见性和流量的关键策略。泛目录和站群作为SEO优化中的两种重要策略，近年来备受关注。本文将通过具体案例，深入探讨这两种策略在SEO优化中的优势与应用。一、泛目录的定义与优势1.1泛目录的定义泛目录是指通过创建大量内容相关、结构相似的目录页面，覆盖广泛的搜索关键词，从而提升网站</div> </li> <li><a href="/article/1900586092499890176.htm" title="React 和 Vue _使用区别" target="_blank">React 和 Vue _使用区别</a> <span class="text-muted">开心小老虎</span> <a class="tag" taget="_blank" href="/search/react%E7%9F%A5%E8%AF%86%E7%82%B9%2B%E7%BB%84%E4%BB%B6/1.htm">react知识点+组件</a><a class="tag" taget="_blank" href="/search/vue3%E7%9F%A5%E8%AF%86%E7%82%B9%2B%E7%BB%84%E4%BB%B6/1.htm">vue3知识点+组件</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF%E7%9F%A5%E8%AF%86%E7%82%B9/1.htm">前端知识点</a><a class="tag" taget="_blank" href="/search/vue.js/1.htm">vue.js</a><a class="tag" taget="_blank" href="/search/react.js/1.htm">react.js</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>目录一、框架介绍1.Vue2.React二、框架结构1.创建应用2.框架结构三、使用区别1.单页面组成2.样式3.显示响应式数据4.响应式html标签属性5.控制元素显隐6.条件渲染7.渲染列表react和vue是目前前端比较流行的两大框架，前端程序员应该将两种框架都掌握，本文总结一些基本知识点的使用区别。一、框架介绍1.VueVue是一个框架，也是一个生态。其功能覆盖了大部分前端开发常见的需求。</div> </li> <li><a href="/article/1900582433477160960.htm" title="Vue3 + TypeScript 实战经验：2025年高效开发指南" target="_blank">Vue3 + TypeScript 实战经验：2025年高效开发指南</a> <span class="text-muted">ctrl_cv工程师￥</span> <a class="tag" taget="_blank" href="/search/typescript/1.htm">typescript</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>在2024年的前端工程化浪潮中，Vue3与TypeScript已成为企业级应用的黄金组合。本文将基于多个真实项目经验，从工程规范、类型安全、性能优化三个维度，分享实战技巧与避坑指南。一、工程配置：构建坚如磐石的基础1.脚手架选择与优化1.1推荐方案：使用Vite+create-vue初始化项目（2024年默认模板已集成TypeScript）关键配置：//vite.config.tsexportde</div> </li> <li><a href="/article/1900566668925530112.htm" title="工程化与框架系列（32）--前端测试实践指南" target="_blank">工程化与框架系列（32）--前端测试实践指南</a> <span class="text-muted">一进制ᅟᅠ        ‌‍‎‏ </span> <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF%E5%B7%A5%E7%A8%8B%E5%8C%96%E4%B8%8E%E6%A1%86%E6%9E%B6/1.htm">前端工程化与框架</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>前端测试实践指南引言前端测试是保证应用质量的重要环节。本文将深入探讨前端测试的各个方面，包括单元测试、集成测试、端到端测试等，并提供实用的测试工具和最佳实践。测试概述前端测试主要包括以下类型：单元测试：测试独立组件和函数集成测试：测试多个组件的交互端到端测试：模拟用户行为的完整测试性能测试：测试应用性能指标快照测试：UI组件的视觉回归测试测试工具实现测试运行器//测试运行器类classTestRu</div> </li> <li><a href="/article/1900561741394276352.htm" title="SEO 优化" target="_blank">SEO 优化</a> <span class="text-muted">前端岳大宝</span> <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF%E6%A0%B8%E5%BF%83%E7%9F%A5%E8%AF%86%E6%80%BB%E7%BB%93/1.htm">前端核心知识总结</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/html/1.htm">html</a> <div>以下是SEO（搜索引擎优化）的基础知识点梳理，从前端技术、内容策略到搜索引擎原理，覆盖核心优化方向：一、SEO基础概念定义与目标SEO是通过优化网站结构、内容和技术，提升网站在搜索引擎自然搜索结果中的排名，吸引更多免费流量。核心目标：满足用户搜索意图，同时符合搜索引擎爬虫的抓取规则。搜索引擎工作原理爬取（Crawling）：搜索引擎蜘蛛（如Googlebot）抓取网页内容。索引（Indexing）</div> </li> <li><a href="/article/1900550896207589376.htm" title="代练系统源码小程序如何助力游戏代练行业数字化转型？" target="_blank">代练系统源码小程序如何助力游戏代练行业数字化转型？</a> <span class="text-muted"></span> <a class="tag" taget="_blank" href="/search/mysqlvue.jsphp/1.htm">mysqlvue.jsphp</a> <div>在电子竞技日益成为全球性娱乐和文化现象的今天，游戏代练服务作为连接高水平玩家与普通玩家的桥梁，其市场需求迅速增长。为满足这一需求，多客代练系统应运而生，它不仅简化了代练服务的匹配流程，还通过智能化管理提升了服务质量和用户体验。本文将深入探讨多客代练系统的核心优势、用户价值以及它如何塑造游戏竞技行业的未来。源码获取地址！！！！请点击！！！！前端框架主要负责用户界面的展示和交互。多客代练系统采用：un</div> </li> <li><a href="/article/1900544459133743104.htm" title="前端笔试高频算法题及JavaScript实现" target="_blank">前端笔试高频算法题及JavaScript实现</a> <span class="text-muted">GISer_Jinger</span> <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/%E7%AE%97%E6%B3%95/1.htm">算法</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a> <div>以下是前端笔试常见的编程算法题及JavaScript代码现，结合最新面试题整理：一、数组/字符串处理两数之和找出数组中两数之和等于目标值的索引consttwoSum=(nums,target)=>{constmap=newMap();for(leti=0;i{letmap=newMap(),max=0,left=0;for(letright=0;right[...newSet(arr.flat(I</div> </li> <li><a href="/article/1900538909327159296.htm" title="工程化与框架系列（31）--前端依赖管理实践" target="_blank">工程化与框架系列（31）--前端依赖管理实践</a> <span class="text-muted">一进制ᅟᅠ        ‌‍‎‏ </span> <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF%E5%B7%A5%E7%A8%8B%E5%8C%96%E4%B8%8E%E6%A1%86%E6%9E%B6/1.htm">前端工程化与框架</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>前端依赖管理实践引言前端依赖管理是现代Web开发中的重要环节。本文将深入探讨前端依赖管理的最佳实践，包括包管理工具、版本控制、依赖分析和优化等方面，帮助开发者更好地管理项目依赖。依赖管理概述前端依赖管理主要包括以下方面：包管理工具：npm、yarn、pnpm等版本控制：语义化版本、锁文件等依赖分析：依赖树、循环依赖等依赖优化：体积优化、重复依赖等安全管理：漏洞检测、更新维护等依赖管理工具实现依赖分</div> </li> <li><a href="/article/1900533738048122880.htm" title="Vue.js 3 的设计思路：从声明式UI到高效渲染机制" target="_blank">Vue.js 3 的设计思路：从声明式UI到高效渲染机制</a> <span class="text-muted">前端 贾公子</span> <a class="tag" taget="_blank" href="/search/vue.js/1.htm">vue.js</a><a class="tag" taget="_blank" href="/search/ui/1.htm">ui</a><a class="tag" taget="_blank" href="/search/flutter/1.htm">flutter</a> <div>目录一、声明式UI与虚拟DOM的灵活性二、渲染器：虚拟DOM到真实DOM的桥梁三、组件的本质与实现四、编译与运行时的协同优化五、性能与可维护性的权衡总结Vue.js3作为新一代前端框架，其设计理念在声明式UI描述、虚拟DOM优化、组件化架构以及编译与运行时协作等方面实现了显著突破。本文将从多个角度深入探讨其设计思路。一、声明式UI与虚拟DOM的灵活性Vue.js3的核心特性之一是声明式UI描述，开</div> </li> <li><a href="/article/1900515820308590592.htm" title="前端发布缓存导致白屏解决方案" target="_blank">前端发布缓存导致白屏解决方案</a> <span class="text-muted">洛祁枫</span> <a class="tag" taget="_blank" href="/search/web/1.htm">web</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/%E7%BC%93%E5%AD%98/1.htm">缓存</a> <div>解决发布H5后因为本地缓存白屏方案一、核心配置优化（前提是访问网站的请求能抵达服务器）方案一：前端项目设置全局不缓存方案运行逻辑：在H5服务器配置中增加Cache-Control:no-cache或max-age=0响应头，禁用静态资源缓存‌；优点：能在服务器出口处最大可能地解决发布项目缓存问题缺点：用户在不同界面跳转都会重新加载界面信息，影响整个前端加载速度，高并发时容易造成带宽压力方案二：首页</div> </li> <li><a href="/article/1900508759512379392.htm" title="Web 开发的“三件套”" target="_blank">Web 开发的“三件套”</a> <span class="text-muted">zhangpeng455547940</span> <a class="tag" taget="_blank" href="/search/Web%E5%BC%80%E5%8F%91/1.htm">Web开发</a><a class="tag" taget="_blank" href="/search/react/1.htm">react</a><a class="tag" taget="_blank" href="/search/native/1.htm">native</a><a class="tag" taget="_blank" href="/search/react.js/1.htm">react.js</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a> <div>HTML：定义内容结构。CSS：控制样式布局。JavaScript：实现动态行为和复杂逻辑。JavaScript应用场景前端开发：操作DOM、处理用户事件、实现动画等。后端开发：通过Node.js构建服务器端应用。跨平台开发：Electron（桌面应用）、ReactNative（移动端）等。</div> </li> <li><a href="/article/1900508252790124544.htm" title="[CRMEB知识付费系统]移动端课程列表一级分类模式实现" target="_blank">[CRMEB知识付费系统]移动端课程列表一级分类模式实现</a> <span class="text-muted">道法自然|~</span> <a class="tag" taget="_blank" href="/search/CRMEB/1.htm">CRMEB</a><a class="tag" taget="_blank" href="/search/vue/1.htm">vue</a><a class="tag" taget="_blank" href="/search/html5/1.htm">html5</a><a class="tag" taget="_blank" href="/search/css/1.htm">css</a> <div>写在前面最近在使用crmeb知识付费下系统的时候，发现默认是二级分类模式，但需求需要一级直接展示内容所以只能重构一下了,重构只改动了前端，非必要不去改动后端，会很麻烦.....目录写在前面实施准备代码结构与功能说明1.页面结构2.数据与状态管理3.核心方法解析3.1获取一级分类(getCateList)3.2获取二级分类(getSubject)3.3加载课程列表(getSpecialList)3.</div> </li> <li><a href="/article/1900501187870912512.htm" title="从零实现OSS阿里云图片上传：前端采用的vue3+element-plus，后端采用javaspingboot，实现上传图片到云，然后存储数据库链接能够回显的效果" target="_blank">从零实现OSS阿里云图片上传：前端采用的vue3+element-plus，后端采用javaspingboot，实现上传图片到云，然后存储数据库链接能够回显的效果</a> <span class="text-muted">绝顶少年</span> <a class="tag" taget="_blank" href="/search/%E9%98%BF%E9%87%8C%E4%BA%91/1.htm">阿里云</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/%E6%95%B0%E6%8D%AE%E5%BA%93/1.htm">数据库</a> <div>后端（JavaSpringBoot）1.添加依赖在pom.xml中添加必要的依赖，包括阿里云OSSSDK、SpringBootWeb、MyBatis-Plus等：org.springframework.bootspring-boot-starter-webcom.baomidoumybatis-plus-boot-starter3.4.3.4com.aliyun.ossaliyun-sdk-oss</div> </li> <li><a href="/article/1900498287572611072.htm" title="前端如何通过后端返回的文件流下载csv文件" target="_blank">前端如何通过后端返回的文件流下载csv文件</a> <span class="text-muted">陈正阳~</span> <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/json/1.htm">json</a> <div>前端如何通过后端返回的文件流下载csv文件有一个下载的csv,后端返回了文件流有一个下载的csv,后端返回了文件流exportfunctionexportCSV(data:exportCSVParams):any{returnaxios({url:`/export/exportCSV?tableName=${data.tableName}&dataBaseName=${data.dataBaseN</div> </li> <li><a href="/article/1900494630277935104.htm" title="VNode" target="_blank">VNode</a> <span class="text-muted">码农 小王</span> <a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a> <div>1.什么是VNode？VNode的全称是VirtualNode,也就是虚拟节点.它是指一个抽象的节点对象，用于描述真实DOM中的元素。在前端框架中，通过操作VNode来实现虚拟DOM，从而提高性能。2.VNode的本质本质上是JavaScript对象,这个对象就是更加轻量级的对DOM的描述3.为什么需要VNode？在前端框架中，我们通常需要在页面中操作DOM元素，如增删改查等操作。但是DOM操作是</div> </li> <li><a href="/article/1900492738541973504.htm" title="前端及后端实现csv文件下载功能" target="_blank">前端及后端实现csv文件下载功能</a> <span class="text-muted">绝顶少年</span> <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>方法一、前端内容：consturl=window.URL.createObjectURL(newBlob([res.data]));constlink=document.createElement('a');link.href=url;constfileNameDateTime=getFormattedDateTime();constfilename="用户提现列表"+fileNameDateTi</div> </li> <li><a href="/article/1900485933564751872.htm" title="神经网络中常用语言特性（python）（待完善）" target="_blank">神经网络中常用语言特性（python）（待完善）</a> <span class="text-muted">邪恶的贝利亚</span> <a class="tag" taget="_blank" href="/search/python/1.htm">python</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a> <div>1.元类在Python中，abc模块（AbstractBaseClasses，抽象基类）提供了创建抽象基类的机制，这些抽象基类可以用来定义接口，强制子类实现特定的方法，有助于实现多态性和代码的可维护性。下面从多个方面详细介绍abc元类相关内容。ABCMeta是abc模块中的元类，ABC类实际上就是使用ABCMeta作为元类创建的。你也可以直接使用ABCMeta来创建抽象基类。classShape(</div> </li> <li><a href="/article/1900485806754164736.htm" title="前端面试：React hooks 调用是可以写在 if 语句里面吗？" target="_blank">前端面试：React hooks 调用是可以写在 if 语句里面吗？</a> <span class="text-muted">returnShitBoy</span> <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/react.js/1.htm">react.js</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a> <div>在React中，Hooks是一种新的特性，允许你在函数组件中使用状态（state）和其他React特性。非常重要的一点是，ReactHooks必须遵循特定的规则，以确保组件的行为一致。ReactHooks使用规则只能在函数组件中调用Hook：你只能在React的函数组件或自定义Hooks中调用Hook，而不能在普通JavaScript函数中调用它们。不能在条件语句中调用Hook：Hooks不能放在</div> </li> <li><a href="/article/1900482898557988864.htm" title="《react》前端面试题" target="_blank">《react》前端面试题</a> <span class="text-muted">微 光</span> <a class="tag" taget="_blank" href="/search/%E9%9D%A2%E8%AF%95%E9%A2%98/1.htm">面试题</a><a class="tag" taget="_blank" href="/search/react.js/1.htm">react.js</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a> <div>说说你对reacthook的理解ReactHooks是React16.8版本引入的一种新的特性，它允许在不编写class的情况下使用state和其他React特性。我的理解主要集中在以下几个方面：函数组件的状态管理：Hooks提供了useState这样的钩子函数，使得我们可以在函数组件中使用状态（state），而不需要将组件转换为class组件。这简化了代码，并使组件的逻辑更易于理解和维护。副作用</div> </li> <li><a href="/article/11.htm" title="VMware Workstation 11 或者 VMware Player 7安装MAC OS X 10.10 Yosemite" target="_blank">VMware Workstation 11 或者 VMware Player 7安装MAC OS X 10.10 Yosemite</a> <span class="text-muted">iwindyforest</span> <a class="tag" taget="_blank" href="/search/vmware/1.htm">vmware</a><a class="tag" taget="_blank" href="/search/mac+os/1.htm">mac os</a><a class="tag" taget="_blank" href="/search/10.10/1.htm">10.10</a><a class="tag" taget="_blank" href="/search/workstation/1.htm">workstation</a><a class="tag" taget="_blank" href="/search/player/1.htm">player</a> <div>最近尝试了下VMware下安装MacOS 系统， 安装过程中发现网上可供参考的文章都是VMware Workstation 10以下， MacOS X 10.9以下的文章， 只能提供大概的思路， 但是实际安装起来由于版本问题， 走了不少弯路， 所以我尝试写以下总结， 希望能给有兴趣安装OSX的人提供一点帮助。     写在前面的话： 其实安装好后发现， 由于我的th</div> </li> <li><a href="/article/138.htm" title="关于《基于模型驱动的B/S在线开发平台》源代码开源的疑虑？" target="_blank">关于《基于模型驱动的B/S在线开发平台》源代码开源的疑虑？</a> <span class="text-muted">deathwknight</span> <a class="tag" taget="_blank" href="/search/JavaScript/1.htm">JavaScript</a><a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E6%A1%86%E6%9E%B6/1.htm">框架</a> <div>本人从学习Java开发到现在已有10年整，从一个要自学 java买成javascript的小菜鸟，成长为只会java和javascript语言的老菜鸟（个人邮箱：deathwknight@163.com） 一路走来，跌跌撞撞。用自己的三年多业余时间，瞎搞一个小东西（基于模型驱动的B/S在线开发平台，非MVC框架、非代码生成）。希望与大家一起分享，同时有许些疑虑，希望有人可以交流下 平台</div> </li> <li><a href="/article/265.htm" title="如何把maven项目转成web项目" target="_blank">如何把maven项目转成web项目</a> <span class="text-muted">Kai_Ge</span> <a class="tag" taget="_blank" href="/search/maven/1.htm">maven</a><a class="tag" taget="_blank" href="/search/MyEclipse/1.htm">MyEclipse</a> <div>创建Web工程，使用eclipse ee创建maven web工程 1.右键项目,选择Project Facets,点击Convert to faceted from 2.更改Dynamic Web Module的Version为2.5.(3.0为Java7的,Tomcat6不支持). 如果提示错误,可能需要在Java Compiler设置Compiler compl</div> </li> <li><a href="/article/392.htm" title="主管？？？" target="_blank">主管？？？</a> <span class="text-muted">Array_06</span> <a class="tag" taget="_blank" href="/search/%E5%B7%A5%E4%BD%9C/1.htm">工作</a> <div>转载：http://www.blogjava.net/fastzch/archive/2010/11/25/339054.html 很久以前跟同事参加的培训，同事整理得很详细，必须得转！ 前段时间，公司有组织中高阶主管及其培养干部进行了为期三天的管理训练培训。三天的课程下来，虽然内容较多，因对老师三天来的课程内容深有感触，故借着整理学习心得的机会，将三天来的培训课程做了一个</div> </li> <li><a href="/article/519.htm" title="python内置函数大全" target="_blank">python内置函数大全</a> <span class="text-muted">2002wmj</span> <a class="tag" taget="_blank" href="/search/python/1.htm">python</a> <div>最近一直在看python的document，打算在基础方面重点看一下python的keyword、Build-in Function、Build-in Constants、Build-in Types、Build-in Exception这四个方面，其实在看的时候发现整个《The Python Standard Library》章节都是很不错的，其中描述了很多不错的主题。先把Build-in Fu</div> </li> <li><a href="/article/646.htm" title="JSP页面通过JQUERY合并行" target="_blank">JSP页面通过JQUERY合并行</a> <span class="text-muted">357029540</span> <a class="tag" taget="_blank" href="/search/JavaScript/1.htm">JavaScript</a><a class="tag" taget="_blank" href="/search/jquery/1.htm">jquery</a> <div>在写程序的过程中我们难免会遇到在页面上合并单元行的情况，如图所示 如果对于会的同学可能很简单，但是对没有思路的同学来说还是比较麻烦的，提供一下用JQUERY实现的参考代码 function mergeCell(){         var trs = $("#table tr"); &nb</div> </li> <li><a href="/article/773.htm" title="Java基础" target="_blank">Java基础</a> <span class="text-muted">冰天百华</span> <a class="tag" taget="_blank" href="/search/java%E5%9F%BA%E7%A1%80/1.htm">java基础</a> <div>学习函数式编程 package base; import java.text.DecimalFormat; public class Main { public static void main(String[] args) { // Integer a = 4; // Double aa = (double)a / 100000; // Decimal</div> </li> <li><a href="/article/900.htm" title="unix时间戳相互转换" target="_blank">unix时间戳相互转换</a> <span class="text-muted">adminjun</span> <a class="tag" taget="_blank" href="/search/%E8%BD%AC%E6%8D%A2/1.htm">转换</a><a class="tag" taget="_blank" href="/search/unix/1.htm">unix</a><a class="tag" taget="_blank" href="/search/%E6%97%B6%E9%97%B4%E6%88%B3/1.htm">时间戳</a> <div>如何在不同编程语言中获取现在的Unix时间戳(Unix timestamp)？ Java time JavaScript Math.round(new Date().getTime()/1000) getTime()返回数值的单位是毫秒 Microsoft .NET / C# epoch = (DateTime.Now.ToUniversalTime().Ticks - 62135</div> </li> <li><a href="/article/1027.htm" title="作为一个合格程序员该做的事" target="_blank">作为一个合格程序员该做的事</a> <span class="text-muted">aijuans</span> <a class="tag" taget="_blank" href="/search/%E7%A8%8B%E5%BA%8F%E5%91%98/1.htm">程序员</a> <div>作为一个合格程序员每天该做的事 1、总结自己一天任务的完成情况 最好的方式是写工作日志，把自己今天完成了什么事情，遇见了什么问题都记录下来，日后翻看好处多多 2、考虑自己明天应该做的主要工作 把明天要做的事情列出来，并按照优先级排列，第二天应该把自己效率最高的时间分配给最重要的工作 3、考虑自己一天工作中失误的地方，并想出避免下一次再犯的方法 出错不要紧，最重</div> </li> <li><a href="/article/1154.htm" title="由html5视频播放引发的总结" target="_blank">由html5视频播放引发的总结</a> <span class="text-muted">ayaoxinchao</span> <a class="tag" taget="_blank" href="/search/html5/1.htm">html5</a><a class="tag" taget="_blank" href="/search/%E8%A7%86%E9%A2%91/1.htm">视频</a><a class="tag" taget="_blank" href="/search/video/1.htm">video</a> <div>前言   项目中存在视频播放的功能，前期设计是以flash播放器播放视频的。但是现在由于需要兼容苹果的设备，必须采用html5的方式来播放视频。我就出于兴趣对html5播放视频做了简单的了解，不了解不知道，水真是很深。本文所记录的知识一些浅尝辄止的知识，说起来很惭愧。   视频结构   本该直接介绍html5的<video>的，但鉴于本人对视频</div> </li> <li><a href="/article/1281.htm" title="解决httpclient访问自签名https报javax.net.ssl.SSLHandshakeException: sun.security.validat" target="_blank">解决httpclient访问自签名https报javax.net.ssl.SSLHandshakeException: sun.security.validat</a> <span class="text-muted">bewithme</span> <a class="tag" taget="_blank" href="/search/httpclient/1.htm">httpclient</a> <div>     如果你构建了一个https协议的站点，而此站点的安全证书并不是合法的第三方证书颁发机构所签发，那么你用httpclient去访问此站点会报如下错误   javax.net.ssl.SSLHandshakeException: sun.security.validator.ValidatorException: PKIX path bu</div> </li> <li><a href="/article/1408.htm" title="Jedis连接池的入门级使用" target="_blank">Jedis连接池的入门级使用</a> <span class="text-muted">bijian1013</span> <a class="tag" taget="_blank" href="/search/redis/1.htm">redis</a><a class="tag" taget="_blank" href="/search/redis%E6%95%B0%E6%8D%AE%E5%BA%93/1.htm">redis数据库</a><a class="tag" taget="_blank" href="/search/jedis/1.htm">jedis</a> <div>Jedis连接池操作步骤如下：         a.获取Jedis实例需要从JedisPool中获取；         b.用完Jedis实例需要返还给JedisPool；         c.如果Jedis在使用过程中出错，则也需要还给JedisPool； packag</div> </li> <li><a href="/article/1535.htm" title="变与不变" target="_blank">变与不变</a> <span class="text-muted">bingyingao</span> <a class="tag" taget="_blank" href="/search/%E4%B8%8D%E5%8F%98/1.htm">不变</a><a class="tag" taget="_blank" href="/search/%E5%8F%98/1.htm">变</a><a class="tag" taget="_blank" href="/search/%E4%BA%B2%E6%83%85%E6%B0%B8%E6%81%92/1.htm">亲情永恒</a> <div>变与不变    周末骑车转到了五年前租住的小区，曾经最爱吃的西北面馆、江西水饺、手工拉面早已不在，    各种店铺都换了好几茬，这些是变的。    三年前还很流行的一款手机在今天看起来已经落后的不像样子。    三年前还运行的好好的一家公司，今天也已经不复存在。    一座座高楼拔地而起，</div> </li> <li><a href="/article/1662.htm" title="【Scala十】Scala核心四：集合框架之List" target="_blank">【Scala十】Scala核心四：集合框架之List</a> <span class="text-muted">bit1129</span> <a class="tag" taget="_blank" href="/search/scala/1.htm">scala</a> <div>Spark的RDD作为一个分布式不可变的数据集合，它提供的转换操作，很多是借鉴于Scala的集合框架提供的一些函数，因此，有必要对Scala的集合进行详细的了解   1. 泛型集合都是协变的，对于List而言，如果B是A的子类，那么List[B]也是List[A]的子类，即可以把List[B]的实例赋值给List[A]变量   2. 给变量赋值(注意val关键字，a，b</div> </li> <li><a href="/article/1789.htm" title="Nested Functions in C" target="_blank">Nested Functions in C</a> <span class="text-muted">bookjovi</span> <a class="tag" taget="_blank" href="/search/c/1.htm">c</a><a class="tag" taget="_blank" href="/search/closure/1.htm">closure</a> <div>  Nested Functions 又称closure，属于functional language中的概念，一直以为C中是不支持closure的，现在看来我错了，不过C标准中是不支持的，而GCC支持。   既然GCC支持了closure，那么 lexical scoping自然也支持了，同时在C中label也是可以在nested functions中自由跳转的</div> </li> <li><a href="/article/1916.htm" title="Java-Collections Framework学习与总结-WeakHashMap" target="_blank">Java-Collections Framework学习与总结-WeakHashMap</a> <span class="text-muted">BrokenDreams</span> <a class="tag" taget="_blank" href="/search/Collections/1.htm">Collections</a> <div>        总结这个类之前，首先看一下Java引用的相关知识。Java的引用分为四种：强引用、软引用、弱引用和虚引用。         强引用：就是常见的代码中的引用，如Object o = new Object();存在强引用的对象不会被垃圾收集</div> </li> <li><a href="/article/2043.htm" title="读《研磨设计模式》-代码笔记-解释器模式-Interpret" target="_blank">读《研磨设计模式》-代码笔记-解释器模式-Interpret</a> <span class="text-muted">bylijinnan</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E8%AE%BE%E8%AE%A1%E6%A8%A1%E5%BC%8F/1.htm">设计模式</a> <div>声明： 本文只为方便我个人查阅和理解，详细的分析以及源代码请移步 原作者的博客http://chjavach.iteye.com/ package design.pattern; /* * 解释器（Interpreter）模式的意图是可以按照自己定义的组合规则集合来组合可执行对象 * * 代码示例实现XML里面1.读取单个元素的值 2.读取单个属性的值 * 多</div> </li> <li><a href="/article/2170.htm" title="After Effects操作&快捷键" target="_blank">After Effects操作&快捷键</a> <span class="text-muted">cherishLC</span> <a class="tag" taget="_blank" href="/search/After+Effects/1.htm">After Effects</a> <div>1、快捷键官方文档 中文版：https://helpx.adobe.com/cn/after-effects/using/keyboard-shortcuts-reference.html 英文版：https://helpx.adobe.com/after-effects/using/keyboard-shortcuts-reference.html 2、常用快捷键</div> </li> <li><a href="/article/2297.htm" title="Maven 常用命令" target="_blank">Maven 常用命令</a> <span class="text-muted">crabdave</span> <a class="tag" taget="_blank" href="/search/maven/1.htm">maven</a> <div>Maven 常用命令   mvn archetype:generate mvn install mvn clean mvn clean complie mvn clean test mvn clean install mvn clean package mvn test mvn package mvn site   mvn dependency:res</div> </li> <li><a href="/article/2424.htm" title="shell bad substitution" target="_blank">shell bad substitution</a> <span class="text-muted">daizj</span> <a class="tag" taget="_blank" href="/search/shell/1.htm">shell</a><a class="tag" taget="_blank" href="/search/%E8%84%9A%E6%9C%AC/1.htm">脚本</a> <div>#!/bin/sh /data/script/common/run_cmd.exp 192.168.13.168 "impala-shell -islave4 -q 'insert OVERWRITE table imeis.${tableName} select ${selectFields}, ds, fnv_hash(concat(cast(ds as string), im</div> </li> <li><a href="/article/2551.htm" title="Java SE 第二讲（原生数据类型 Primitive Data Type）" target="_blank">Java SE 第二讲（原生数据类型 Primitive Data Type）</a> <span class="text-muted">dcj3sjt126com</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a> <div>Java SE  第二讲： 1.   Windows: notepad, editplus, ultraedit, gvim Linux: vi, vim, gedit 2.   Java 中的数据类型分为两大类： 1）原生数据类型  （Primitive Data Type） 2）引用类型（对象类型）  （R</div> </li> <li><a href="/article/2678.htm" title="CGridView中实现批量删除" target="_blank">CGridView中实现批量删除</a> <span class="text-muted">dcj3sjt126com</span> <a class="tag" taget="_blank" href="/search/PHP/1.htm">PHP</a><a class="tag" taget="_blank" href="/search/yii/1.htm">yii</a> <div>1，CGridView中的columns添加 array( 'selectableRows' => 2, 'footer' => '<button type="button" onclick="GetCheckbox();" style=&</div> </li> <li><a href="/article/2805.htm" title="Java中泛型的各种使用" target="_blank">Java中泛型的各种使用</a> <span class="text-muted">dyy_gusi</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E6%B3%9B%E5%9E%8B/1.htm">泛型</a> <div>Java中的泛型的使用：1.普通的泛型使用 在使用类的时候后面的<>中的类型就是我们确定的类型。 public class MyClass1<T> {//此处定义的泛型是T private T var; public T getVar() { return var; } public void setVa</div> </li> <li><a href="/article/2932.htm" title="Web开发技术十年发展历程" target="_blank">Web开发技术十年发展历程</a> <span class="text-muted">gcq511120594</span> <a class="tag" taget="_blank" href="/search/Web/1.htm">Web</a><a class="tag" taget="_blank" href="/search/%E6%B5%8F%E8%A7%88%E5%99%A8/1.htm">浏览器</a><a class="tag" taget="_blank" href="/search/%E6%95%B0%E6%8D%AE%E6%8C%96%E6%8E%98/1.htm">数据挖掘</a> <div>回顾web开发技术这十年发展历程： Ajax 03年的时候我上六年级，那时候网吧刚在小县城的角落萌生。传奇，大话西游第一代网游一时风靡。我抱着试一试的心态给了网吧老板两块钱想申请个号玩玩，然后接下来的一个小时我一直在，注，册，账，号。 彼时网吧用的512k的带宽，注册的时候，填了一堆信息，提交，页面跳转，嘣，”您填写的信息有误，请重填”。然后跳转回注册页面，以此循环。我现在时常想，如果当时a</div> </li> <li><a href="/article/3059.htm" title="openSession()与getCurrentSession()区别：" target="_blank">openSession()与getCurrentSession()区别：</a> <span class="text-muted">hetongfei</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/DAO/1.htm">DAO</a><a class="tag" taget="_blank" href="/search/Hibernate/1.htm">Hibernate</a> <div>来自 http://blog.csdn.net/dy511/article/details/6166134 1.getCurrentSession创建的session会和绑定到当前线程,而openSession不会。 2. getCurrentSession创建的线程会在事务回滚或事物提交后自动关闭,而openSession必须手动关闭。 这里getCurrentSession本地事务(本地</div> </li> <li><a href="/article/3186.htm" title="第一章 安装Nginx+Lua开发环境" target="_blank">第一章 安装Nginx+Lua开发环境</a> <span class="text-muted">jinnianshilongnian</span> <a class="tag" taget="_blank" href="/search/nginx/1.htm">nginx</a><a class="tag" taget="_blank" href="/search/lua/1.htm">lua</a><a class="tag" taget="_blank" href="/search/openresty/1.htm">openresty</a> <div>首先我们选择使用OpenResty，其是由Nginx核心加很多第三方模块组成，其最大的亮点是默认集成了Lua开发环境，使得Nginx可以作为一个Web Server使用。借助于Nginx的事件驱动模型和非阻塞IO，可以实现高性能的Web应用程序。而且OpenResty提供了大量组件如Mysql、Redis、Memcached等等，使在Nginx上开发Web应用更方便更简单。目前在京东如实时价格、秒</div> </li> <li><a href="/article/3313.htm" title="HSQLDB In-Process方式访问内存数据库" target="_blank">HSQLDB In-Process方式访问内存数据库</a> <span class="text-muted">liyonghui160com</span> <div>    HSQLDB一大特色就是能够在内存中建立数据库，当然它也能将这些内存数据库保存到文件中以便实现真正的持久化。   先睹为快！   下面是一个In-Process方式访问内存数据库的代码示例：     下面代码需要引入hsqldb.jar包 （hsqldb-2.2.8）   import java.s</div> </li> <li><a href="/article/3440.htm" title="Java线程的5个使用技巧" target="_blank">Java线程的5个使用技巧</a> <span class="text-muted">pda158</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E6%95%B0%E6%8D%AE%E7%BB%93%E6%9E%84/1.htm">数据结构</a> <div>Java线程有哪些不太为人所知的技巧与用法？ 　　萝卜白菜各有所爱。像我就喜欢Java。学无止境，这也是我喜欢它的一个原因。日常 工作中你所用到的工具，通常都有些你从来没有了解过的东西，比方说某个方法或者是一些有趣的用法。比如说线程。没错，就是线程。或者确切说是Thread这个类。当我们在构建高可扩展性系统的时候，通常会面临各种各样的并发编程的问题，不过我们现在所要讲的可能会略有不同。 </div> </li> <li><a href="/article/3567.htm" title="开发资源大整合：编程语言篇——JavaScript（1）" target="_blank">开发资源大整合：编程语言篇——JavaScript（1）</a> <span class="text-muted">shoothao</span> <a class="tag" taget="_blank" href="/search/JavaScript/1.htm">JavaScript</a> <div>概述：本系列的资源整合来自于github中各个领域的大牛，来收藏你感兴趣的东西吧。     程序包管理器   管理javascript库并提供对这些库的快速使用与打包的服务。 Bower - 用于web的程序包管理。 component - 用于客户端的程序包管理，构建更好的web应用程序。 spm - 全新的静态的文件包管</div> </li> <li><a href="/article/3694.htm" title="避免使用终结函数" target="_blank">避免使用终结函数</a> <span class="text-muted">vahoa.ma</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/jvm/1.htm">jvm</a><a class="tag" taget="_blank" href="/search/C%2B%2B/1.htm">C++</a> <div>终结函数（finalizer）通常是不可预测的，常常也是很危险的，一般情况下不是必要的。使用终结函数会导致不稳定的行为、更差的性能，以及带来移植性问题。不要把终结函数当做C++中的析构函数（destructors）的对应物。       我自己总结了一下这一条的综合性结论是这样的： 1）在涉及使用资源，使用完毕后要释放资源的情形下，首先要用一个显示的方</div> </li> </ul> </div> </div> </div> <div> <div class="container"> <div class="indexes"> <strong>按字母分类：</strong> <a href="/tags/A/1.htm" target="_blank">A</a><a href="/tags/B/1.htm" target="_blank">B</a><a href="/tags/C/1.htm" target="_blank">C</a><a href="/tags/D/1.htm" target="_blank">D</a><a href="/tags/E/1.htm" target="_blank">E</a><a href="/tags/F/1.htm" target="_blank">F</a><a href="/tags/G/1.htm" target="_blank">G</a><a href="/tags/H/1.htm" target="_blank">H</a><a href="/tags/I/1.htm" target="_blank">I</a><a href="/tags/J/1.htm" target="_blank">J</a><a href="/tags/K/1.htm" target="_blank">K</a><a href="/tags/L/1.htm" target="_blank">L</a><a href="/tags/M/1.htm" target="_blank">M</a><a href="/tags/N/1.htm" target="_blank">N</a><a href="/tags/O/1.htm" target="_blank">O</a><a href="/tags/P/1.htm" target="_blank">P</a><a href="/tags/Q/1.htm" target="_blank">Q</a><a href="/tags/R/1.htm" target="_blank">R</a><a href="/tags/S/1.htm" target="_blank">S</a><a href="/tags/T/1.htm" target="_blank">T</a><a href="/tags/U/1.htm" target="_blank">U</a><a href="/tags/V/1.htm" target="_blank">V</a><a href="/tags/W/1.htm" target="_blank">W</a><a href="/tags/X/1.htm" target="_blank">X</a><a href="/tags/Y/1.htm" target="_blank">Y</a><a href="/tags/Z/1.htm" target="_blank">Z</a><a href="/tags/0/1.htm" target="_blank">其他</a> </div> </div> </div> <footer id="footer" class="mb30 mt30"> <div class="container"> <div class="footBglm"> <a target="_blank" href="/">首页</a> - <a target="_blank" href="/custom/about.htm">关于我们</a> - <a target="_blank" href="/search/Java/1.htm">站内搜索</a> - <a target="_blank" href="/sitemap.txt">Sitemap</a> - <a target="_blank" href="/custom/delete.htm">侵权投诉</a> </div> <div class="copyright">版权所有 IT知识库 CopyRight © 2000-2050 E-COM-NET.COM , All Rights Reserved. <!-- <a href="https://beian.miit.gov.cn/" rel="nofollow" target="_blank">京ICP备09083238号</a><br>--> </div> </div> </footer> <!-- 代码高亮 --> <script type="text/javascript" src="/static/syntaxhighlighter/scripts/shCore.js"></script> <script type="text/javascript" src="/static/syntaxhighlighter/scripts/shLegacy.js"></script> <script type="text/javascript" src="/static/syntaxhighlighter/scripts/shAutoloader.js"></script> <link type="text/css" rel="stylesheet" href="/static/syntaxhighlighter/styles/shCoreDefault.css"/> <script type="text/javascript" src="/static/syntaxhighlighter/src/my_start_1.js"></script> </body> </html>