作者：Shadeed
译者：前端小智
来源：dmitripavlutin
点赞再看，微信搜索
【大迁世界】,B站关注
【前端小智】这个没有大厂背景，但有着一股向上积极心态人。本文
GitHub
https://github.com/qq44924588... 上已经收录，文章的已分类，也整理了很多我的文档，和教程资料。
最近开源了一个 Vue 组件，还不够完善，欢迎大家来一起完善它，也希望大家能给个 star 支持一下，谢谢各位了。
github 地址：https://github.com/qq44924588...
文档对象模型(DOM)是一个将HTML或XML文档视为树形结构的接口，其中每个节点都是文档的一个对象。DOM还提供了一组方法来查询树、改变结构、样式。
DOM 还使用术语元素(Element)它与节点非常相似。那么，DOM节点和元素之间有什么区别呢?
1. DOM节点
理解节点和元素之间区别的关键是理解节点是什么。
更高的角度来看，DOM文档由节点层次结构组成。 每个节点可以具有父级和/或子级。
看看下面的HTML文档:
My Page
My Page
Thank you for visiting my web page!
该文档包含以下节点层次结构:
HTML文档中的标记代表一个节点，有趣的是普通文本也是一个节点。段落节点“Thank you for visiting my web page!”。
1.2节点类型
我们要如何区分这些不同类型的节点？ 答案在于DOM Node接口，尤其是Node.nodeType属性。
Node.nodeType可以具有代表节点类型的以下值之一：
- Node.ELEMENT_NODE
- Node.ATTRIBUTE_NODE
- Node.TEXT_NODE
- Node.CDATA_SECTION_NODE
- Node.PROCESSING_INSTRUCTION_NODE
- Node.COMMENT_NODE
- Node.DOCUMENT_NODE
- Node.DOCUMENT_TYPE_NODE
- Node.DOCUMENT_FRAGMENT_NODE
- Node.NOTATION_NODE
常量有意义地指示节点类型：例如Node.ELEMENT_NODE代表元素节点，Node.TEXT_NODE代表文本节点，Node.DOCUMENT_NODE文档节点，依此类推。
例如，让我们选择段落节点，然后查看其nodeType属性：
const paragraph = document.querySelector('p');
paragraph.nodeType === Node.ELEMENT_NODE; // => true
代表整个节点文档树的节点类型为Node.DOCUMENT_NODE：
document.nodeType === Node.DOCUMENT_NODE; // => true
2. DOM元素
掌握了DOM节点的知识之后，现在该区分DOM节点和元素了。
如果你了解节点术语，那么答案是显而易见的:元素是特定类型的节点 element (Node.ELEMENT_NODE)，以及文档、注释、文本等类型。
简而言之，元素是使用HTML文档中的标记编写的节点。 </code>，<code><body></code>，<code><h2></code>，<code><p></code>都是元素，因为它们由标签表示。</p>
<p>文档类型，注释，文本节点不是元素，因为它们没有使用标签编写：</p>
<p><code>Node</code>是节点的构造函数，<code>HTMLElement</code> 是 JS DOM 中元素的构造函数。段落既是节点又是元素，它同时是<code>Node</code>和<code>HTMLElement</code>的实例</p>
<pre><code>const paragraph = document.querySelector('p');
paragraph instanceof Node; // => true
paragraph instanceof HTMLElement; // => true</code></pre>
<p>简单地说，元素是节点的子类型，就像猫是动物的子类型一样。</p>
<h2>3. DOM属性：节点和元素</h2>
<p>除了区分节点和元素之外，还需要区分只包含节点或只包含元素的DOM属性。</p>
<p>节点类型的以下属性评估为一个节点或节点集合（<code>NodeList</code>）：</p>
<pre><code>node.parentNode; // Node or null
node.firstChild; // Node or null
node.lastChild; // Node or null
node.childNodes; // NodeList</code></pre>
<p>但是，以下属性是元素或元素集合（<code>HTMLCollection</code>）：</p>
<pre><code>node.parentElement; // HTMLElement or null
node.children; // HTMLCollection</code></pre>
<p>由于<code>node.childNodes</code>和node.children都返回子级列表，因此为什么要同时具有这两个属性？ 好问题！</p>
<p>考虑以下包含某些文本的段落元素：</p>
<pre><code><p>
<b>Thank you</b> for visiting my web page!
</p></code></pre>
<p>打开<a href="https://jsitor.com/3mPwoSVbYh" rel="nofollow noreferrer">演示</a>，然后查看parapgraph节点的<code>childNodes</code>和<code>children</code>属性：</p>
<pre><code>const paragraph = document.querySelector('p');
paragraph.childNodes; // NodeList: [HTMLElement, Text]
paragraph.children; // HTMLCollection: [HTMLElement]</code></pre>
<p><code>paragraph.childNodes</code>集合包含2个节点： <code><b>Thank you</b></code>,，以及<code>for visiting my web page!</code>文本节点！</p>
<p>但是，<code>paragraph.children</code>集合仅包含1个项目：<code><b>Thank you</b></code>。</p>
<p>由于<code>paragraph.children</code>仅包含元素，因此此处未包含文本节点，因为其类型是文本（<code>Node.TEXT_NODE</code>），而不是元素（<code>Node.ELEMENT_NODE</code>）。</p>
<p>同时拥有<code>node.childNodes</code>和<code>node.children</code>，我们可以选择要访问的子级集合：所有子级节点或仅子级是元素。</p>
<h2>4.总结</h2>
<p>DOM文档是节点的分层集合，每个节点可以具有父级和/或子级。如果了解节点是什么，那么了解DOM节点和元素之间的区别就很容易。</p>
<p>节点有类型，元素类型就是其中之一，元素由HTML文档中的标记表示。</p>
<p>完~ 我是小智，我要去刷碗了，我们下期再见！</p>
<hr>
<p><strong>代码部署后可能存在的BUG没法实时知道，事后为了解决这些BUG，花了大量的时间进行log 调试，这边顺便给大家推荐一个好用的BUG监控工具 <a href="https://www.fundebug.com/?utm_source=xiaozhi" rel="nofollow noreferrer">Fundebug</a>。</strong></p>
<p>原文：<a href="https://dmitripautin.com/dom-node-element/" rel="nofollow noreferrer">https://dmitripautin.com/dom-...</a></p>
<h2>交流</h2>
<p>文章每周持续更新，可以微信搜索「 大迁世界 」第一时间阅读和催更（比博客早一到两篇哟），本文 GitHub <a href="https://github.com/qq449245884/xiaozhi" rel="nofollow noreferrer">https://github.com/qq449245884/xiaozhi</a> 已经收录，整理了很多我的文档，欢迎Star和完善，大家面试可以参照考点复习，另外关注公众号，后台回复<strong>福利</strong>，即可看到福利，你懂的。</p>
<p><span class="img-wrap"><img alt="" title="" src="http://img.e-com-net.com/image/info9/8a4e9c23d6b14b89b47f399b49cce3ba.jpg" width="0" height="0"></span></p>
</article>
</div>
</div>
</div>
<!--PC和WAP自适应版-->
<div id="SOHUCS" sid="1351398864619384832"></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">你可能感兴趣的:(javascript,前端,html)</h4>
<div id="paradigm-article-related">
<div class="recommend-post mb30">
<ul class="widget-links">
<li><a href="/article/1902910387926396928.htm"
title="JavaScript 中的性能优化：从基础到高级技巧" target="_blank">JavaScript 中的性能优化：从基础到高级技巧</a>
<span class="text-muted">lina_mua</span>
<a class="tag" taget="_blank" href="/search/%E6%B7%B1%E5%85%A5/1.htm">深入</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/%E6%80%A7%E8%83%BD%E4%BC%98%E5%8C%96/1.htm">性能优化</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.引言1.1性能优化的重要性在现代前端开发中，性能优化是提升用户体验的关键。无论是页面加载速度、交互响应时间，还是内存占用，性能优化都能显著提升应用的流畅度和用户满意度。1.2本文的目标本文旨在深入探讨JavaScript中的性能优化，从基础到高级技巧，帮助开发者理解性能优化的核心概念，并掌握其在实际开发中的应用。2.性能优化的基础2.1什么是性能优化？性能优化是指通过改进代码、减少资源消耗、优</div>
</li>
<li><a href="/article/1902904455809003520.htm"
title="Webpack4从入门到精通以及和webpack5对比_webpack现在用的是哪个版本" target="_blank">Webpack4从入门到精通以及和webpack5对比_webpack现在用的是哪个版本</a>
<span class="text-muted">2501_90253044</span>
<a class="tag" taget="_blank" href="/search/webpack/1.htm">webpack</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/node.js/1.htm">node.js</a>
<div>'css-loader',//less-loader：将less文件编译成css文件，需要下载less-loader和less'less-loader'],},{test:/\.css$/,//使用多个loader用use,使用一个loader用loaderuse:['style-loader','css-loader'],},{//url-loader：处理图片资源，问题：默认处理不了html中</div>
</li>
<li><a href="/article/1902896885996253184.htm"
title="论云原生架构及其应用" target="_blank">论云原生架构及其应用</a>
<span class="text-muted">桃花键神</span>
<a class="tag" taget="_blank" href="/search/%E4%BA%91%E5%8E%9F%E7%94%9F/1.htm">云原生</a><a class="tag" taget="_blank" href="/search/%E6%9E%B6%E6%9E%84/1.htm">架构</a>
<div>摘要：2021年7月，我所在的公司承担了广东省某医院的网上预约挂号项目的开发工作，我有幸作为系统架构师参与整个系统的开发过程，并负责了系统架构设计工作。该系统以预约挂号为主线，其中包括管理平台审核、确认挂号、订单支付、更新预约状态等业务模块。本文以网上预约挂号项目为例，详细论述了云原生架构在该项目中的具体应用。系统以SpringCloud微服务框架开发，分为前端Web服务、平台保障服务、业务服务三</div>
</li>
<li><a href="/article/1902887557906100224.htm"
title="Pollinations AI文生图html源码" target="_blank">Pollinations AI文生图html源码</a>
<span class="text-muted">酷爱码</span>
<a class="tag" taget="_blank" href="/search/html/1.htm">html</a><a class="tag" taget="_blank" href="/search/HTML/1.htm">HTML</a>
<div>源码介绍用deepseek辅助制作了一个电脑端文生图小程序，html语言的，接口使用的是Pollinations，上传服务器访问首页即可一次生成4张，提示词最好用英文，点击小图可以预览大图，也可以点击下载按钮直接下载截图预览源码免费获取PollinationsAI文生图html源码</div>
</li>
<li><a href="/article/1902878104855048192.htm"
title="springboot整合Thymeleaf详解" target="_blank">springboot整合Thymeleaf详解</a>
<span class="text-muted">weiha666</span>
<a class="tag" taget="_blank" href="/search/spring/1.htm">spring</a><a class="tag" taget="_blank" href="/search/boot/1.htm">boot</a>
<div>Thymeleaf介绍简单说，Thymeleaf是一个跟Velocity、FreeMarker类似的模板引擎，它可以完全替代JSP。相较与其他的模板引擎，它有如下三个极吸引人的特点：Thymeleaf在有网络和无网络的环境下皆可运行，即它可以让美工在浏览器查看页面的静态效果，也可以让程序员在服务器查看带数据的动态页面效果。这是由于它支持html原型，然后在html标签里增加额外的属性来达到模板+数</div>
</li>
<li><a href="/article/1902874323593523200.htm"
title="JavaScript 模块化语法 import、export详解" target="_blank">JavaScript 模块化语法 import、export详解</a>
<span class="text-muted">qq39138814</span>
<a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a><a class="tag" taget="_blank" href="/search/ecmascript/1.htm">ecmascript</a>
<div>JavaScript模块化语法import、export详解1.为什么需要模块化？在JavaScript早期，所有代码都是写在一个全局作用域中，这样做的问题是：变量污染：所有变量、函数都是全局的，容易互相干扰。文件依赖管理困难：多个JS文件之间的依赖关系混乱，难以维护。代码复用困难：无法方便地拆分和复用代码。为了解决这些问题，模块化方案应运而生。2.JavaScript模块化的发展2.1早期的模块</div>
</li>
<li><a href="/article/1902868248307757056.htm"
title="useSyncExternalStore 的应用" target="_blank">useSyncExternalStore 的应用</a>
<span class="text-muted"></span>
<a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a>
<div>我们是袋鼠云数栈UED团队，致力于打造优秀的一站式数据中台产品。我们始终保持工匠精神，探索前端道路，为社区积累并传播经验价值。本文作者：修能学而不思则罔，思而不学则殆。---《论语·为政》WhatuseSyncExternalStoreisaReactHookthatletsyousubscribetoanexternalstore.useSyncExternalStore是一个支持让用户订阅外部</div>
</li>
<li><a href="/article/1902867511427264512.htm"
title="从 0 到 1 搭建一个 Web 应用项目：详细步骤与踩坑记录" target="_blank">从 0 到 1 搭建一个 Web 应用项目：详细步骤与踩坑记录</a>
<span class="text-muted">算法探索者</span>
<a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a>
<div>一、引言在当今数字化时代，Web应用无处不在。对于开发者而言，掌握从0到1搭建Web应用项目的技能至关重要。本指南将带你逐步完成一个简单Web应用项目的搭建，分享技术选型思路以及在过程中遇到的问题和解决方案，助力你开启Web开发之旅。二、技术选型（一）前端框架：选择React.js。它具有高效的虚拟DOM机制，能够快速更新页面，提升用户体验。同时，React生态系统丰富，有大量现成的组件库和工具可</div>
</li>
<li><a href="/article/1902863980490190848.htm"
title="浏览器 DOM 深度解析：从节点类型到遍历操作的全攻略" target="_blank">浏览器 DOM 深度解析：从节点类型到遍历操作的全攻略</a>
<span class="text-muted">码农的时光故事</span>
<a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a><a class="tag" taget="_blank" href="/search/ecmascript/1.htm">ecmascript</a>
<div>一、DOM核心概念与节点类型DOM（文档对象模型）是浏览器提供的核心API之一，用于将HTML文档转换为可操作的对象树结构。其核心设计遵循树形结构，每个节点都继承自Node接口，主要分为以下类型：1.基础节点类型Element：对应HTML标签，包含属性和子节点（）Text：文本内容节点Comment：注释节点Document：文档根节点，通过document全局对象访问（）2.特殊节点类型Doc</div>
</li>
<li><a href="/article/1902863853843181568.htm"
title="浏览器工作原理深度解析（阶段一）：从 URL 到页面渲染的完整流程" target="_blank">浏览器工作原理深度解析（阶段一）：从 URL 到页面渲染的完整流程</a>
<span class="text-muted">码农的时光故事</span>
<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>一、浏览器工作流程概述作为前端开发者，我们每天都在与浏览器打交道，但多数人对其内部工作机制却知之甚少。实际上，浏览器的核心功能就是将用户输入的URL转换为可视化的网页。这一过程大致分为六个关键步骤：网络请求：通过HTTP/HTTPS协议获取页面资源构建DOM树：解析HTML代码生成文档对象模型样式计算：解析CSS规则并应用到对应元素布局渲染：计算元素位置和尺寸生成渲染树合成优化：将渲染层合并为位图</div>
</li>
<li><a href="/article/1902863601631293440.htm"
title="JavaScript对象全解析：从宿主到内置，深入理解对象分类" target="_blank">JavaScript对象全解析：从宿主到内置，深入理解对象分类</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/javascript/1.htm">javascript</a>
<div>一、JavaScript对象全景图JavaScript对象系统远比表面看起来复杂，我们可以将其分为以下五大类：类别描述示例宿主对象由运行环境提供的对象（如浏览器中的DOM）window、document固有对象标准规定随运行时自动创建的基础对象Array、Date原生对象通过内置构造器创建的特权对象newArray()、newMap()普通对象用户创建的常规对象{}、newObject()特殊行为</div>
</li>
<li><a href="/article/1902862844316151808.htm"
title="JAVA学习-练习试用Java实现“实现一个Spark应用，对大数据集中的文本数据进行情感分析和关键词筛选”" target="_blank">JAVA学习-练习试用Java实现“实现一个Spark应用，对大数据集中的文本数据进行情感分析和关键词筛选”</a>
<span class="text-muted">守护者170</span>
<a class="tag" taget="_blank" href="/search/java%E5%AD%A6%E4%B9%A0/1.htm">java学习</a><a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E5%AD%A6%E4%B9%A0/1.htm">学习</a>
<div>问题：实现一个Spark应用，对大数据集中的文本数据进行情感分析和关键词筛选。解答思路：要实现一个Spark应用，对大数据集中的文本数据进行情感分析和关键词筛选，需要按照以下步骤进行：1.环境准备确保的环境中已经安装了ApacheSpark。可以从[ApacheSpark官网](https://spark.apache.org/downloads.html)下载并安装。2.创建Spark应用以下是</div>
</li>
<li><a href="/article/1902848839732228096.htm"
title="解析：浏览器事件冒泡及事件捕获" target="_blank">解析：浏览器事件冒泡及事件捕获</a>
<span class="text-muted">C860</span>
<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%B5%8F%E8%A7%88%E5%99%A8/1.htm">浏览器</a>
<div>今天的效率有点奇葩，说高吧，一个上午做了不少事。说低吧，因为一个分布式的算法花了我不少时间，终于有点头绪。估计明天会写一篇文章来讲述一下自己的看法。而今天，还是回到前端。今天来说说事件冒泡和事件捕获。首先肯定是概念：什么是事件冒泡？什么是事件捕获？简单地说，事件冒泡和事件捕获都是一种事件传递的机制。这种机制可以使事件在不同级的元素间传递。事件冒泡是从事件触发的源节点，向父节点传递，直到到达最顶节点</div>
</li>
<li><a href="/article/1902847571139817472.htm"
title="pear-admin-boot开发框架使用记录（三）" target="_blank">pear-admin-boot开发框架使用记录（三）</a>
<span class="text-muted">后青春期的诗go</span>
<a class="tag" taget="_blank" href="/search/%E7%BB%8F%E9%AA%8C%E5%88%86%E4%BA%AB/1.htm">经验分享</a><a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/spring/1.htm">spring</a><a class="tag" taget="_blank" href="/search/boot/1.htm">boot</a><a class="tag" taget="_blank" href="/search/spring/1.htm">spring</a><a class="tag" taget="_blank" href="/search/log4j/1.htm">log4j</a><a class="tag" taget="_blank" href="/search/mybatis/1.htm">mybatis</a>
<div>一、实现部门选择操作用于从组织架构里选择出部门的操作，如开发日志管理模块，创建人新增日志时可以通过选择框选择相应共享的部门。数据库表调整在数据表添加2个字段：sharedeptid共享部门idvarcharsharedeptname共享部门名称varchar前端html页面调整页面添加如下代码：共享部门前端JS调整添加如下代码：letdtree=layui.dtree;dtree.renderSe</div>
</li>
<li><a href="/article/1902847573991944192.htm"
title="基于koajsAdmin+mongodb的后台管理快速开发框架安装运行记录" target="_blank">基于koajsAdmin+mongodb的后台管理快速开发框架安装运行记录</a>
<span class="text-muted">后青春期的诗go</span>
<a class="tag" taget="_blank" href="/search/%E7%BB%8F%E9%AA%8C%E5%88%86%E4%BA%AB/1.htm">经验分享</a><a class="tag" taget="_blank" href="/search/mongodb/1.htm">mongodb</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/node.js/1.htm">node.js</a><a class="tag" taget="_blank" href="/search/vue.js/1.htm">vue.js</a><a class="tag" taget="_blank" href="/search/elementui/1.htm">elementui</a>
<div>前置操作下载源码源码地址：https://gitee.com/zhoushuigui/koajs-admin安装mongodb数据库并连接安装yarnnpminstallyarn-g安装nodemonnpminstallnodemon-g前端运行安装依赖进入项目根目录，在命令行执行如下命令安装依赖：yarn--registry=https://registry.npmmirror.com启动服务y</div>
</li>
<li><a href="/article/1902843160275513344.htm"
title="python中的构造函数" target="_blank">python中的构造函数</a>
<span class="text-muted">weixin_30770495</span>
<a class="tag" taget="_blank" href="/search/python/1.htm">python</a>
<div>python中构造函数可以这样写classclassname（）：def——init——（self）：#构造函数函数体转载于:https://www.cnblogs.com/begoogatprogram/p/4649076.html</div>
</li>
<li><a href="/article/1902841270674452480.htm"
title="HBuilderX的下载、安装" target="_blank">HBuilderX的下载、安装</a>
<span class="text-muted">听海边涛声</span>
<a class="tag" taget="_blank" href="/search/HBuilderX/1.htm">HBuilderX</a>
<div>HBuilderX简称HX，是一款轻量级的、免费的IDE。它具有强大的语法提示和vue支持。访问HBuilderX的官网：https://www.dcloud.io/hbuilderx.html选择要下载的版本，我下载的是v4.08版本：将压缩包下拉以后解压到某个目录下就可以了，不需要安装过程，例如，我解压到D:\HBuilderX目录下面：双击HBuilderX.exe，就可以运行了：注意：HB</div>
</li>
<li><a href="/article/1902838751143456768.htm"
title="ROS CDK魔法书：建立你的游戏王国（JavaScript篇）" target="_blank">ROS CDK魔法书：建立你的游戏王国（JavaScript篇）</a>
<span class="text-muted">阿里云CloudOps</span>
<a class="tag" taget="_blank" href="/search/%E8%B5%84%E6%BA%90%E7%BC%96%E6%8E%92/1.htm">资源编排</a><a class="tag" taget="_blank" href="/search/ROS/1.htm">ROS</a><a class="tag" taget="_blank" href="/search/%E6%B8%B8%E6%88%8F/1.htm">游戏</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a><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/ROS/1.htm">ROS</a><a class="tag" taget="_blank" href="/search/CDK/1.htm">CDK</a>
<div>引言在虚拟游戏的世界里，数字化的乐趣如同流动的音符，谱写着无数玩家的共同回忆。而在这片充满创意与冒险的乐园中，您的使命就是将独特的游戏体验与丰富的技术知识相结合，打造出令人难以忘怀的作品。当面对如何实现这一宏伟蓝图时，您或许会想：如何将一款简单而富有趣味的游戏部署到云端，使更多玩家共享这份乐趣？别担心，现在您手中握有一把开启无限可能的大门钥匙——阿里云资源编排服务（ResourceOrchestr</div>
</li>
<li><a href="/article/1902831060962570240.htm"
title="leetcode刷题（javaScript）——栈、单调栈相关场景题总结" target="_blank">leetcode刷题（javaScript）——栈、单调栈相关场景题总结</a>
<span class="text-muted">三月的一天</span>
<a class="tag" taget="_blank" href="/search/Leetcode%E5%88%B7%E9%A2%98%E6%8A%80%E5%B7%A7%E6%80%BB%E7%BB%93/1.htm">Leetcode刷题技巧总结</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/leetcode/1.htm">leetcode</a><a class="tag" taget="_blank" href="/search/linux/1.htm">linux</a>
<div>在LeetCode刷题中，栈是一个常用的数据结构，可以帮助解决很多问题。以下是一些需要使用栈的方法，以及单调栈的应用场景：栈的使用技巧：栈常用于解决与括号匹配相关的问题，如括号序列的有效性、最长有效括号等。栈也常用于解决逆波兰表达式、表达式求值等与计算相关的问题。栈可以用于解决深度优先搜索（DFS）中的回溯问题，如组合、排列等。栈还可以用于解决某些需要“后进先出”（LIFO）特性的问题，如某些遍历</div>
</li>
<li><a href="/article/1902823749690912768.htm"
title="【微信小程序（云开发模式）变通实现DeepSeek支持语音】" target="_blank">【微信小程序（云开发模式）变通实现DeepSeek支持语音】</a>
<span class="text-muted">技术与健康</span>
<a class="tag" taget="_blank" href="/search/%E5%BE%AE%E4%BF%A1%E5%B0%8F%E7%A8%8B%E5%BA%8F/1.htm">微信小程序</a><a class="tag" taget="_blank" href="/search/notepad%2B%2B/1.htm">notepad++</a><a class="tag" taget="_blank" href="/search/%E5%B0%8F%E7%A8%8B%E5%BA%8F/1.htm">小程序</a>
<div>整体架构前端（微信小程序）：使用微信小程序云开发能力，实现录音功能。将录音文件上传到云存储。调用云函数进行语音识别和DeepSeek处理。界面模仿DeepSeek，支持文本编辑。后端（云函数+Node.js）：使用云函数调用腾讯云语音识别（ASR）服务。调用DeepSeekAPI处理文本。步骤1：初始化云开发环境在微信开发者工具中创建小程序项目，并开通云开发。在project.config.jso</div>
</li>
<li><a href="/article/1902815934175834112.htm"
title="Web Component 教程（六）：基于 Stencil 脚手架开发 Web Component" target="_blank">Web Component 教程（六）：基于 Stencil 脚手架开发 Web Component</a>
<span class="text-muted">乐闻x</span>
<a class="tag" taget="_blank" href="/search/Web/1.htm">Web</a><a class="tag" taget="_blank" href="/search/Component/1.htm">Component</a><a class="tag" taget="_blank" href="/search/%E5%AD%A6%E4%B9%A0%E8%AE%B0%E5%BD%95/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/web/1.htm">web</a><a class="tag" taget="_blank" href="/search/component/1.htm">component</a><a class="tag" taget="_blank" href="/search/stencli/1.htm">stencli</a>
<div>前言在现代前端开发中，WebComponent是一种逐渐受到关注的技术，它允许我们创建可以在任何框架或库（如React,Angular,Vue等）中使用的可重用组件。而Stencil是一个强大的开发工具，它帮助我们轻松构建这些WebComponent，使开发过程更高效、更简洁。那么，究竟如何使用Stencil来开发WebComponent呢？今天，我们就来探索这一主题，从安装和设置，到创建和使用组</div>
</li>
<li><a href="/article/1902812404694183936.htm"
title="Angular Material表格的动态列宽设置" target="_blank">Angular Material表格的动态列宽设置</a>
<span class="text-muted">t0_54program</span>
<a class="tag" taget="_blank" href="/search/%E7%BC%96%E7%A8%8B%E9%97%AE%E9%A2%98%E8%A7%A3%E5%86%B3%E6%89%8B%E5%86%8C/1.htm">编程问题解决手册</a><a class="tag" taget="_blank" href="/search/angular.js/1.htm">angular.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><a class="tag" taget="_blank" href="/search/%E4%B8%AA%E4%BA%BA%E5%BC%80%E5%8F%91/1.htm">个人开发</a>
<div>在前端开发中，AngularMaterial表格（mat-table）是非常流行的组件之一。它提供了丰富的功能，如排序、分页和过滤等。然而，有时我们需要动态调整表格列的宽度，以适应不同的数据和用户需求。本文将介绍如何在TypeScript中获取mat-table的列宽，并据此设置相应的过滤器宽度。问题描述在使用AngularMaterial表格时，如何获取每个列的宽度？例如，我们希望为每一列设置一</div>
</li>
<li><a href="/article/1902808876462436352.htm"
title="Pybind11教程：从零开始打造 Python 的 C++ 小帮手" target="_blank">Pybind11教程：从零开始打造 Python 的 C++ 小帮手</a>
<span class="text-muted">Yc9801</span>
<a class="tag" taget="_blank" href="/search/c%2B%2B/1.htm">c++</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a>
<div>参考官网文档：https://pybind11.readthedocs.io/en/stable/index.html一、Pybind11是什么？想象你在Python里写了个计算器，但跑得太慢，想用C++提速，又不想完全抛弃Python。Pybind11就像一座桥，把C++的高性能代码“嫁接”到Python里。你可以用Python调用C++函数，就像请了个跑得飞快的帮手来干活。主要功能：绑定函数：</div>
</li>
<li><a href="/article/1902806571113574400.htm"
title="Node.js技术原理分析系列6——基于 V8 封装一个自己的 JavaScript 运行时" target="_blank">Node.js技术原理分析系列6——基于 V8 封装一个自己的 JavaScript 运行时</a>
<span class="text-muted"></span>
<a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AFnode.js/1.htm">前端node.js</a>
<div>Node.js是一个开源的、跨平台的JavaScript运行时环境，它允许开发者在服务器端运行JavaScript代码。Node.js是基于ChromeV8引擎构建的，专为高性能、高并发的网络应用而设计，广泛应用于构建服务器端应用程序、网络应用、命令行工具等。本系列将分为9篇文章为大家介绍Node.js技术原理：从调试能力分析到内置模块新增，从性能分析工具perf_hooks的用法到ChromeD</div>
</li>
<li><a href="/article/1902802949088800768.htm"
title="HTML 教程：从零开始掌握常用语法" target="_blank">HTML 教程：从零开始掌握常用语法</a>
<span class="text-muted">LoveYa!</span>
<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><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/%E7%AC%94%E8%AE%B0/1.htm">笔记</a><a class="tag" taget="_blank" href="/search/%E5%AD%A6%E4%B9%A0/1.htm">学习</a>
<div>免费无广纯净版微信小程序测mbti很有趣，不需要任何授权，也不需要登录，直接就是测，几分钟了解自己的人格mbti，快来试试吧。可以微信直接搜索小程序名“一秒MBTI”HTML教程：从零开始掌握常用语法欢迎来到HTML的世界！HTML（HyperTextMarkupLanguage，超文本标记语言）是网页开发的基石，它负责定义网页的结构和内容。无论你是想成为一名前端开发者，还是仅仅想了解网页背后的魔</div>
</li>
<li><a href="/article/1902800050304643072.htm"
title="解决npm run dev运行后报错：”Could not read package.json: Error: ENOENT: no such file or directory“" target="_blank">解决npm run dev运行后报错：”Could not read package.json: Error: ENOENT: no such file or directory“</a>
<span class="text-muted">moz与京</span>
<a class="tag" taget="_blank" href="/search/%E5%AE%9E%E8%AE%AD%E6%9C%9F%E9%97%B4%E6%8A%A5%E9%94%99%E6%95%B4%E7%90%86/1.htm">实训期间报错整理</a><a class="tag" taget="_blank" href="/search/npm/1.htm">npm</a><a class="tag" taget="_blank" href="/search/json/1.htm">json</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a>
<div>在启动一个项目的前端时，执行npmrundev命令，结果报错如下：根据报错提示："npmerrorerrno-4058"通常是由于文件系统权限问题或文件路径问题导致的。这个错误码表示在执行某个操作时，npm无法访问或修改某个文件或目录。在这个情境下，想到是因为没有指定项目文件就在终端执行了命令。先cd到目标文件夹中：cdclient进入到前端文件夹目录，再执行原命令，发现项目启动成功。这一报错解决</div>
</li>
<li><a href="/article/1902797144184647680.htm"
title="六十天前端强化训练之第二十一天大师级详解 React Context API：从原理到实战" target="_blank">六十天前端强化训练之第二十一天大师级详解 React Context API：从原理到实战</a>
<span class="text-muted">编程星辰海</span>
<a class="tag" taget="_blank" href="/search/%23/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/%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><a class="tag" taget="_blank" href="/search/React/1.htm">React</a><a class="tag" taget="_blank" href="/search/Context/1.htm">Context</a><a class="tag" taget="_blank" href="/search/API/1.htm">API</a>
<div>=====欢迎来到编程星辰海的博客讲解======看完可以给一个免费的三连吗，谢谢大佬！目录一、庖丁解牛：深入理解ContextAPI1.1设计哲学与运转机制工作原理三步曲：1.2核心三剑客详解1.3性能优化要诀二、手把手实现主题切换系统2.1完整代码实现（逐行注释版）2.2配套CSS样式设计三、关键知识点拆解3.1状态初始化策略3.2CSS变量注入原理3.3性能优化实践3.4可访问性最佳实践四、</div>
</li>
<li><a href="/article/1902796256476983296.htm"
title="【Vue3笔记01】如何使用Vue3和Vite搭建前端项目的基础开发环境" target="_blank">【Vue3笔记01】如何使用Vue3和Vite搭建前端项目的基础开发环境</a>
<span class="text-muted">Mr.小朱同学</span>
<a class="tag" taget="_blank" href="/search/Web%E5%89%8D%E7%AB%AF%E7%AC%94%E8%AE%B0/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/%E7%AC%94%E8%AE%B0/1.htm">笔记</a><a class="tag" taget="_blank" href="/search/vue.js/1.htm">vue.js</a><a class="tag" taget="_blank" href="/search/Vue3/1.htm">Vue3</a><a class="tag" taget="_blank" href="/search/Vite/1.htm">Vite</a><a class="tag" taget="_blank" href="/search/%E6%90%AD%E5%BB%BA%E9%A1%B9%E7%9B%AE%E7%8E%AF%E5%A2%83/1.htm">搭建项目环境</a>
<div>这篇文章，主要介绍如何使用Vue3和Vite搭建前端项目的基础开发环境【知识星球】。目录一、搭建项目环境1.1、前提条件1.2、开始搭建1.3、下载依赖1.4、启动工程一、搭建项目环境目前前端开发中，使用最多的就是Vue.js框架，目前Vue.js框架常用的有Vue2、Vue3两个版本，Vue3和Vue2在语法上还是存在很大的差异的，这里我将介绍如何搭建Vue3开发环境。1.1、前提条件在创建Vu</div>
</li>
<li><a href="/article/1902791080596795392.htm"
title="vue3+Ts+elementPlus二次封装Table分页表格，表格内展示图片、switch开关、支持" target="_blank">vue3+Ts+elementPlus二次封装Table分页表格，表格内展示图片、switch开关、支持</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/%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/elementPlus/1.htm">elementPlus</a>
<div>目录一.项目文件结构二.实现代码1.子组件（表格组件）2.父组件（使用表格）一.项目文件结构1.表格组件（子组件）位置2.使用表格组件的页面文件（父组件）位置3.演示图片位置elementPlus表格Table表格|ElementPlus4.笑果演示表格笑果点击图片放大显示笑果二.实现代码1.子组件（表格组件）1.src/views/Table.vuehtml部分{{scope.$index+1}</div>
</li>
<li><a href="/article/1902789316220874752.htm"
title="Postman 从入门到精通的详细图文教程指南" target="_blank">Postman 从入门到精通的详细图文教程指南</a>
<span class="text-muted">清尘沐歌</span>
<a class="tag" taget="_blank" href="/search/postman/1.htm">postman</a><a class="tag" taget="_blank" href="/search/%E6%B5%8B%E8%AF%95%E5%B7%A5%E5%85%B7/1.htm">测试工具</a>
<div>API已经成为连接不同系统和服务的重要桥梁，无论你是前端开发者、后端工程师还是测试人员，掌握API的开发和测试技能都是非常重要的。Postman是一个广受欢迎的API开发工具，它不仅能够帮助你轻松发送HTTP请求，还提供了强大的测试、调试和协作功能。本系列教程旨在帮助你从零开始，逐步掌握Postman的各项功能，从基础的请求发送到高级的自动化测试和团队协作。无论你是初学者还是有一定经验的开发者，都</div>
</li>
<li><a href="/article/119.htm"
title="Spring中@Value注解，需要注意的地方" target="_blank">Spring中@Value注解，需要注意的地方</a>
<span class="text-muted">无量</span>
<a class="tag" taget="_blank" href="/search/spring/1.htm">spring</a><a class="tag" taget="_blank" href="/search/bean/1.htm">bean</a><a class="tag" taget="_blank" href="/search/%40Value/1.htm">@Value</a><a class="tag" taget="_blank" href="/search/xml/1.htm">xml</a>
<div>Spring 3以后,支持@Value注解的方式获取properties文件中的配置值，简化了读取配置文件的复杂操作
1、在applicationContext.xml文件(或引用文件中)中配置properties文件
<bean id="appProperty"
class="org.springframework.beans.fac</div>
</li>
<li><a href="/article/246.htm"
title="mongoDB 分片" target="_blank">mongoDB 分片</a>
<span class="text-muted">开窍的石头</span>
<a class="tag" taget="_blank" href="/search/mongodb/1.htm">mongodb</a>
<div> mongoDB的分片。要mongos查询数据时候 先查询configsvr看数据在那台shard上，configsvr上边放的是metar信息，指的是那条数据在那个片上。由此可以看出mongo在做分片的时候咱们至少要有一个configsvr,和两个以上的shard（片）信息。
第一步启动两台以上的mongo服务
&nb</div>
</li>
<li><a href="/article/373.htm"
title="OVER(PARTITION BY)函数用法" target="_blank">OVER(PARTITION BY)函数用法</a>
<span class="text-muted">0624chenhong</span>
<a class="tag" taget="_blank" href="/search/oracle/1.htm">oracle</a>
<div>这篇写得很好，引自
http://www.cnblogs.com/lanzi/archive/2010/10/26/1861338.html
OVER(PARTITION BY)函数用法
2010年10月26日
OVER(PARTITION BY)函数介绍
开窗函数 &nb</div>
</li>
<li><a href="/article/500.htm"
title="Android开发中，ADB server didn't ACK 解决方法" target="_blank">Android开发中，ADB server didn't ACK 解决方法</a>
<span class="text-muted">一炮送你回车库</span>
<a class="tag" taget="_blank" href="/search/Android%E5%BC%80%E5%8F%91/1.htm">Android开发</a>
<div>首先通知：凡是安装360、豌豆荚、腾讯管家的全部卸载，然后再尝试。
一直没搞明白这个问题咋出现的，但今天看到一个方法，搞定了！原来是豌豆荚占用了 5037 端口导致。
参见原文章：一个豌豆荚引发的血案——关于ADB server didn't ACK的问题
简单来讲，首先将Windows任务进程中的豌豆荚干掉，如果还是不行，再继续按下列步骤排查。
&nb</div>
</li>
<li><a href="/article/627.htm"
title="canvas中的像素绘制问题" target="_blank">canvas中的像素绘制问题</a>
<span class="text-muted">换个号韩国红果果</span>
<a class="tag" taget="_blank" href="/search/JavaScript/1.htm">JavaScript</a><a class="tag" taget="_blank" href="/search/canvas/1.htm">canvas</a>
<div>pixl的绘制，1.如果绘制点正处于相邻像素交叉线，绘制x像素的线宽，则从交叉线分别向前向后绘制x/2个像素，如果x/2是整数，则刚好填满x个像素，如果是小数，则先把整数格填满，再去绘制剩下的小数部分，绘制时，是将小数部分的颜色用来除以一个像素的宽度，颜色会变淡。所以要用整数坐标来画的话（即绘制点正处于相邻像素交叉线时），线宽必须是2的整数倍。否则会出现不饱满的像素。
2.如果绘制点为一个像素的</div>
</li>
<li><a href="/article/754.htm"
title="编码乱码问题" target="_blank">编码乱码问题</a>
<span class="text-muted">灵静志远</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/jsp/1.htm">jsp</a><a class="tag" taget="_blank" href="/search/%E7%BC%96%E7%A0%81/1.htm">编码</a>
<div>1、JVM中单个字符占用的字节长度跟编码方式有关，而默认编码方式又跟平台是一一对应的或说平台决定了默认字符编码方式；2、对于单个字符：ISO-8859-1单字节编码，GBK双字节编码，UTF-8三字节编码；因此中文平台(中文平台默认字符集编码GBK)下一个中文字符占2个字节，而英文平台(英文平台默认字符集编码Cp1252(类似于ISO-8859-1))。
3、getBytes()、getByte</div>
</li>
<li><a href="/article/881.htm"
title="java 求几个月后的日期" target="_blank">java 求几个月后的日期</a>
<span class="text-muted">darkranger</span>
<a class="tag" taget="_blank" href="/search/calendar/1.htm">calendar</a><a class="tag" taget="_blank" href="/search/getinstance/1.htm">getinstance</a>
<div>Date plandate = planDate.toDate();
SimpleDateFormat df = new SimpleDateFormat("yyyy-MM-dd");
Calendar cal = Calendar.getInstance();
cal.setTime(plandate);
// 取得三个月后时间
cal.add(Calendar.M</div>
</li>
<li><a href="/article/1008.htm"
title="数据库设计的三大范式（通俗易懂）" target="_blank">数据库设计的三大范式（通俗易懂）</a>
<span class="text-muted">aijuans</span>
<a class="tag" taget="_blank" href="/search/%E6%95%B0%E6%8D%AE%E5%BA%93%E5%A4%8D%E4%B9%A0/1.htm">数据库复习</a>
<div>关系数据库中的关系必须满足一定的要求。满足不同程度要求的为不同范式。数据库的设计范式是数据库设计所需要满足的规范。只有理解数据库的设计范式，才能设计出高效率、优雅的数据库，否则可能会设计出错误的数据库.
目前，主要有六种范式：第一范式、第二范式、第三范式、BC范式、第四范式和第五范式。满足最低要求的叫第一范式，简称1NF。在第一范式基础上进一步满足一些要求的为第二范式，简称2NF。其余依此类推。</div>
</li>
<li><a href="/article/1135.htm"
title="想学工作流怎么入手" target="_blank">想学工作流怎么入手</a>
<span class="text-muted">atongyeye</span>
<a class="tag" taget="_blank" href="/search/jbpm/1.htm">jbpm</a>
<div>工作流在工作中变得越来越重要，很多朋友想学工作流却不知如何入手。 很多朋友习惯性的这看一点，那了解一点，既不系统，也容易半途而废。好比学武功，最好的办法是有一本武功秘籍。研究明白，则犹如打通任督二脉。
系统学习工作流，很重要的一本书《JBPM工作流开发指南》。
本人苦苦学习两个月，基本上可以解决大部分流程问题。整理一下学习思路，有兴趣的朋友可以参考下。
1 首先要</div>
</li>
<li><a href="/article/1262.htm"
title="Context和SQLiteOpenHelper创建数据库" target="_blank">Context和SQLiteOpenHelper创建数据库</a>
<span class="text-muted">百合不是茶</span>
<a class="tag" taget="_blank" href="/search/android/1.htm">android</a><a class="tag" taget="_blank" href="/search/Context%E5%88%9B%E5%BB%BA%E6%95%B0%E6%8D%AE%E5%BA%93/1.htm">Context创建数据库</a>
<div> 一直以为安卓数据库的创建就是使用SQLiteOpenHelper创建,但是最近在android的一本书上看到了Context也可以创建数据库,下面我们一起分析这两种方式创建数据库的方式和区别,重点在SQLiteOpenHelper
一:SQLiteOpenHelper创建数据库:
1,SQLi</div>
</li>
<li><a href="/article/1389.htm"
title="浅谈group by和distinct" target="_blank">浅谈group by和distinct</a>
<span class="text-muted">bijian1013</span>
<a class="tag" taget="_blank" href="/search/oracle/1.htm">oracle</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/group+by/1.htm">group by</a><a class="tag" taget="_blank" href="/search/distinct/1.htm">distinct</a>
<div> group by和distinct只了去重意义一样，但是group by应用范围更广泛些，如分组汇总或者从聚合函数里筛选数据等。
譬如：统计每id数并且只显示数大于3
select id ,count(id) from ta</div>
</li>
<li><a href="/article/1516.htm"
title="vi opertion" target="_blank">vi opertion</a>
<span class="text-muted">征客丶</span>
<a class="tag" taget="_blank" href="/search/mac/1.htm">mac</a><a class="tag" taget="_blank" href="/search/opration/1.htm">opration</a><a class="tag" taget="_blank" href="/search/vi/1.htm">vi</a>
<div>进入 command mode （命令行模式）
按 esc 键
再按 shift + 冒号
注：以下命令中 带 $ 【在命令行模式下进行】，不带 $ 【在非命令行模式下进行】
一、文件操作
1.1、强制退出不保存
$ q!
1.2、保存
$ w
1.3、保存并退出
$ wq
1.4、刷新或重新加载已打开的文件
$ e
二、光标移动
2.1、跳到指定行
数字</div>
</li>
<li><a href="/article/1643.htm"
title="【Spark十四】深入Spark RDD第三部分RDD基本API" target="_blank">【Spark十四】深入Spark RDD第三部分RDD基本API</a>
<span class="text-muted">bit1129</span>
<a class="tag" taget="_blank" href="/search/spark/1.htm">spark</a>
<div>
对于K/V类型的RDD,如下操作是什么含义？
val rdd = sc.parallelize(List(("A",3),("C",6),("A",1),("B",5))
rdd.reduceByKey(_+_).collect
reduceByKey在这里的操作，是把</div>
</li>
<li><a href="/article/1770.htm"
title="java类加载机制" target="_blank">java类加载机制</a>
<span class="text-muted">BlueSkator</span>
<a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E8%99%9A%E6%8B%9F%E6%9C%BA/1.htm">虚拟机</a>
<div>java类加载机制
1.java类加载器的树状结构
引导类加载器
^
|
扩展类加载器
^
|
系统类加载器
java使用代理模式来完成类加载，java的类加载器也有类似于继承的关系，引导类是最顶层的加载器，它是所有类的根加载器，它负责加载java核心库。当一个类加载器接到装载类到虚拟机的请求时，通常会代理给父类加载器，若已经是根加载器了，就自己完成加载。
虚拟机区分一个Cla</div>
</li>
<li><a href="/article/1897.htm"
title="动态添加文本框" target="_blank">动态添加文本框</a>
<span class="text-muted">BreakingBad</span>
<a class="tag" taget="_blank" href="/search/%E6%96%87%E6%9C%AC%E6%A1%86/1.htm">文本框</a>
<div> <script> var num=1; function AddInput() { var str=""; str+="<input </div>
</li>
<li><a href="/article/2024.htm"
title="读《研磨设计模式》-代码笔记-单例模式" target="_blank">读《研磨设计模式》-代码笔记-单例模式</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/
public class Singleton {
}
/*
* 懒汉模式。注意，getInstance如果在多线程环境中调用，需要加上synchronized，否则存在线程不安全问题
*/
class LazySingleton</div>
</li>
<li><a href="/article/2151.htm"
title="iOS应用打包发布常见问题" target="_blank">iOS应用打包发布常见问题</a>
<span class="text-muted">chenhbc</span>
<a class="tag" taget="_blank" href="/search/ios/1.htm">ios</a><a class="tag" taget="_blank" href="/search/iOS%E5%8F%91%E5%B8%83/1.htm">iOS发布</a><a class="tag" taget="_blank" href="/search/iOS%E4%B8%8A%E4%BC%A0/1.htm">iOS上传</a><a class="tag" taget="_blank" href="/search/iOS%E6%89%93%E5%8C%85/1.htm">iOS打包</a>
<div>这个月公司安排我一个人做iOS客户端开发，由于急着用，我先发布一个版本，由于第一次发布iOS应用，期间出了不少问题，记录于此。
1、使用Application Loader 发布时报错：Communication error.please use diagnostic mode to check connectivity.you need to have outbound acc</div>
</li>
<li><a href="/article/2278.htm"
title="工作流复杂拓扑结构处理新思路" target="_blank">工作流复杂拓扑结构处理新思路</a>
<span class="text-muted">comsci</span>
<a class="tag" taget="_blank" href="/search/%E8%AE%BE%E8%AE%A1%E6%A8%A1%E5%BC%8F/1.htm">设计模式</a><a class="tag" taget="_blank" href="/search/%E5%B7%A5%E4%BD%9C/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/%E4%BC%81%E4%B8%9A%E5%BA%94%E7%94%A8/1.htm">企业应用</a><a class="tag" taget="_blank" href="/search/OO/1.htm">OO</a>
<div> 我们走的设计路线和国外的产品不太一样，不一样在哪里呢？ 国外的流程的设计思路是通过事先定义一整套规则(类似XPDL)来约束和控制流程图的复杂度(我对国外的产品了解不够多，仅仅是在有限的了解程度上面提出这样的看法)，从而避免在流程引擎中处理这些复杂的图的问题，而我们却没有通过事先定义这样的复杂的规则来约束和降低用户自定义流程图的灵活性，这样一来，在引擎和流程流转控制这一个层面就会遇到很</div>
</li>
<li><a href="/article/2405.htm"
title="oracle 11g新特性Flashback data archive" target="_blank">oracle 11g新特性Flashback data archive</a>
<span class="text-muted">daizj</span>
<a class="tag" taget="_blank" href="/search/oracle/1.htm">oracle</a>
<div>1. 什么是flashback data archive
Flashback data archive是oracle 11g中引入的一个新特性。Flashback archive是一个新的数据库对象，用于存储一个或多表的历史数据。Flashback archive是一个逻辑对象，概念上类似于表空间。实际上flashback archive可以看作是存储一个或多个表的所有事务变化的逻辑空间。 </div>
</li>
<li><a href="/article/2532.htm"
title="多叉树:2-3-4树" target="_blank">多叉树:2-3-4树</a>
<span class="text-muted">dieslrae</span>
<a class="tag" taget="_blank" href="/search/%E6%A0%91/1.htm">树</a>
<div> 平衡树多叉树,每个节点最多有4个子节点和3个数据项,2,3,4的含义是指一个节点可能含有的子节点的个数,效率比红黑树稍差.一般不允许出现重复关键字值.2-3-4树有以下特征:
1、有一个数据项的节点总是有2个子节点(称为2-节点)
2、有两个数据项的节点总是有3个子节点(称为3-节</div>
</li>
<li><a href="/article/2659.htm"
title="C语言学习七动态分配 malloc的使用" target="_blank">C语言学习七动态分配 malloc的使用</a>
<span class="text-muted">dcj3sjt126com</span>
<a class="tag" taget="_blank" href="/search/c/1.htm">c</a><a class="tag" taget="_blank" href="/search/language/1.htm">language</a><a class="tag" taget="_blank" href="/search/malloc/1.htm">malloc</a>
<div>/*
2013年3月15日15:16:24
malloc 就memory(内存) allocate(分配)的缩写
本程序没有实际含义，只是理解使用
*/
# include <stdio.h>
# include <malloc.h>
int main(void)
{
int i = 5; //分配了4个字节 静态分配
int * p </div>
</li>
<li><a href="/article/2786.htm"
title="Objective-C编码规范[译]" target="_blank">Objective-C编码规范[译]</a>
<span class="text-muted">dcj3sjt126com</span>
<a class="tag" taget="_blank" href="/search/%E4%BB%A3%E7%A0%81%E8%A7%84%E8%8C%83/1.htm">代码规范</a>
<div>
原文链接 : The official raywenderlich.com Objective-C style guide
原文作者 : raywenderlich.com Team
译文出自 : raywenderlich.com Objective-C编码规范
译者 : Sam Lau
</div>
</li>
<li><a href="/article/2913.htm"
title="0.性能优化-目录" target="_blank">0.性能优化-目录</a>
<span class="text-muted">frank1234</span>
<a class="tag" taget="_blank" href="/search/%E6%80%A7%E8%83%BD%E4%BC%98%E5%8C%96/1.htm">性能优化</a>
<div>从今天开始笔者陆续发表一些性能测试相关的文章，主要是对自己前段时间学习的总结，由于水平有限，性能测试领域很深，本人理解的也比较浅，欢迎各位大咖批评指正。
主要内容包括：
一、性能测试指标
吞吐量、TPS、响应时间、负载、可扩展性、PV、思考时间
http://frank1234.iteye.com/blog/2180305
二、性能测试策略
生产环境相同 基准测试 预热等
htt</div>
</li>
<li><a href="/article/3040.htm"
title="Java父类取得子类传递的泛型参数Class类型" target="_blank">Java父类取得子类传递的泛型参数Class类型</a>
<span class="text-muted">happyqing</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><a class="tag" taget="_blank" href="/search/%E7%88%B6%E7%B1%BB/1.htm">父类</a><a class="tag" taget="_blank" href="/search/%E5%AD%90%E7%B1%BB/1.htm">子类</a><a class="tag" taget="_blank" href="/search/Class/1.htm">Class</a>
<div>
import java.lang.reflect.ParameterizedType;
import java.lang.reflect.Type;
import org.junit.Test;
abstract class BaseDao<T> {
public void getType() {
//Class<E> clazz =</div>
</li>
<li><a href="/article/3167.htm"
title="跟我学SpringMVC目录汇总贴、PDF下载、源码下载" target="_blank">跟我学SpringMVC目录汇总贴、PDF下载、源码下载</a>
<span class="text-muted">jinnianshilongnian</span>
<a class="tag" taget="_blank" href="/search/springMVC/1.htm">springMVC</a>
<div>
----广告--------------------------------------------------------------
网站核心商详页开发
掌握Java技术，掌握并发/异步工具使用，熟悉spring、ibatis框架；
掌握数据库技术，表设计和索引优化，分库分表/读写分离；
了解缓存技术，熟练使用如Redis/Memcached等主流技术；
了解Ngin</div>
</li>
<li><a href="/article/3294.htm"
title="the HTTP rewrite module requires the PCRE library" target="_blank">the HTTP rewrite module requires the PCRE library</a>
<span class="text-muted">流浪鱼</span>
<a class="tag" taget="_blank" href="/search/rewrite/1.htm">rewrite</a>
<div>./configure: error: the HTTP rewrite module requires the PCRE library.
模块依赖性Nginx需要依赖下面3个包
1. gzip 模块需要 zlib 库 ( 下载: http://www.zlib.net/ )
2. rewrite 模块需要 pcre 库 ( 下载: http://www.pcre.org/ )
3. s</div>
</li>
<li><a href="/article/3421.htm"
title="第12章 Ajax（中）" target="_blank">第12章 Ajax（中）</a>
<span class="text-muted">onestopweb</span>
<a class="tag" taget="_blank" href="/search/Ajax/1.htm">Ajax</a>
<div>index.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/</div>
</li>
<li><a href="/article/3548.htm"
title="Optimize query with Query Stripping in Web Intelligence" target="_blank">Optimize query with Query Stripping in Web Intelligence</a>
<span class="text-muted">blueoxygen</span>
<a class="tag" taget="_blank" href="/search/BO/1.htm">BO</a>
<div>http://wiki.sdn.sap.com/wiki/display/BOBJ/Optimize+query+with+Query+Stripping+in+Web+Intelligence
and a very straightfoward video
http://www.sdn.sap.com/irj/scn/events?rid=/library/uuid/40ec3a0c-936</div>
</li>
<li><a href="/article/3675.htm"
title="Java开发者写SQL时常犯的10个错误" target="_blank">Java开发者写SQL时常犯的10个错误</a>
<span class="text-muted">tomcat_oracle</span>
<a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/sql/1.htm">sql</a>
<div>1、不用PreparedStatements 有意思的是，在JDBC出现了许多年后的今天，这个错误依然出现在博客、论坛和邮件列表中，即便要记住和理解它是一件很简单的事。开发者不使用PreparedStatements的原因可能有如下几个： 他们对PreparedStatements不了解 他们认为使用PreparedStatements太慢了 他们认为写Prepar</div>
</li>
<li><a href="/article/3802.htm"
title="世纪互联与结盟有感" target="_blank">世纪互联与结盟有感</a>
<span class="text-muted">阿尔萨斯</span>
<div> 10月10日，世纪互联与（Foxcon）签约成立合资公司，有感。
全球电子制造业巨头（全球500强企业）与世纪互联共同看好IDC、云计算等业务在中国的增长空间，双方迅速果断出手，在资本层面上达成合作，此举体现了全球电子制造业巨头对世纪互联IDC业务的欣赏与信任，另一方面反映出世纪互联目前良好的运营状况与广阔的发展前景。
众所周知，精于电子产品制造（世界第一），对于世纪互联而言，能够与结盟</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>
