码农麒麟

JS中DOM模型简介以及实现HTML元素的增删改查

一、DOM模型概述

在了解JS的DOM模型之前，首先要先清除什么是树模型，这一点在数据结构中讲述的非常清楚，不知道的读者可以先去看一下数据结构中有关树的概念。

了解了什么是树之后，我们再来说说DOM模型，DOM模型其实就是把你所有已经写入前端文件(.html/.jsp/..)中的所有标签，形成一个树的结构。话不多说，直接上代码和图。


我的DOM树

    My name is BeryAllen,
    and I'm the fastest man alive.

如上的代码会生成一个DOM树，其中html为树的根节点，和为它的两个子节点，而下还会有

和

两个子节点，该树形结构如下图所示：

DOM为常用的HTML元素提供了一套完整的继承体系。从页面的document对象到每个常用的HTML元素，DOM模型都提供了对应的类，每个类都提供了相应的方法来操作DOM元素本身、属性及其子元素。DOM模型允许以树的方式操作HTML文档中的每个元素。

虽然JS不是一门纯粹的面向对象语言，但DOM还是为HTML元素提供了一种简单的继承关系。关于HTML中元素的继承关系，具体的可以查看以下链接：https://blog.csdn.net/ppwwp/article/details/88169145。

二、访问HTML元素

为了动态地修改HTML元素，必须能访问HTML元素，DOM提供了三种方式来访问HTML元素：

根据ID访问HTML元素
利用节点关系访问HTML元素

前一种方式通过document.getElementById("")可以通元素的ID获取该对象，与之类似的，也可以通过class获得元素对象，如：document.getElementsByClassName("");后一种方式可以通过节点之间的父子、兄弟关系来访问。

除了这两种访问方式之外，还可以通过CSS选择器来访问HTML元素。


    




    疯狂Java讲义
    轻量级Java EE企业应用到实战

通过父子节点获取元素：


	


	
	
		疯狂Java讲义
	
		轻量级Java EE企业应用到实战
		疯狂Ajax讲义
		疯狂XML讲义
		经典Java EE企业应用到实战
		经典Java EE企业应用到实战

三、修改HTML元素

访问到指定的HTML元素之后，还可以对该元素进行修改，可以通过以下属性进行修改：

innerHTML：大部分HTML页面元素如
、的呈现内容由该属性控制。
value：表单控件如、的呈现内容由该属性控制</li> <li style="text-indent:0px;">className:修改HTML元素的CSS样式，该属性的合法值是一个class选择器名</li> <li style="text-indent:0px;">style：修改HTML元素的CSS样式</li> <li style="text-indent:0px;">options[index]：直接对<select/>元素的指定列表项赋值，可改变列表框、下拉菜单的指定列表项。</li> </ul> <pre class="has"><code class="language-html"><head> <title>BeryAllen</title> <meta http-equiv="Content-Type" content="text/html;charset=utf-8"/> <style type="text/css"> </style> </head> <body> 改变第<input id="row" type="text" size="2"/>行, 第<input id="cel" type="text" size="2" />列的值为: <input id="celVal" type="text" size="16"/> <input id="chg" type="button" value="改变" onclick="change();"/><br /> <table id="d" border="1" style="width:580px;border-collapse:collapse;"> <tr> <td>疯狂Java讲义</td> <td>轻量级Java EE企业应用到实战</td> </tr> <tr> <td>疯狂Ajax讲义</td> <td>轻量级Java EE企业应用到实战</td> </tr> <tr> <td>疯狂XML讲义</td> <td>疯狂Android讲义</td> </tr> </table> <script type="text/javascript"> var change = function(){ var tb = document.getElementById("d"); var row = document.getElementById("row").value; row = parseInt(row); if(isNaN(row)){ alert("您要修改的行必须是整数"); return false; } var cel = document.getElementById("cel").value; cel = parseInt(cel); if(isNaN(cel)){ alert("您要修改的列必须是整数"); return false; } if(row > tb.rows.length || cel > tb.rows.item(0).cells.length){ alert("要修改的单元格不在该表格内"); return false; } tb.rows.item(row - 1).cells.item(cel - 1).innerHTML = document.getElementById("celVal").value; } </script> </body></code></pre> <p>如上的代码在获取了table对象d后，通过<strong>tb.rows.item(row - 1 ).cells.item(cel - 1).innerHTML<br> = document.getElementById("celVal").value;</strong>将输入的第row行，cel列的数据变为input框中的数据。</p> <h2>四、增加HTML元素</h2> <p style="text-indent:50px;">JavaScript脚本可以通过DOM动态增加节点，程序为DOM树增加节点时，页面会动态的地增加HTML元素。当需要为页面增加HTML元素时，可以进行如下的操作：</p> <p style="text-indent:50px;">1、创建或复制节点</p> <p style="text-indent:50px;">2、添加节点</p> <pre class="has"><code class="language-html"><body id="test"> <script type="text/javascript"> var a = document.createElement("select"); for(var i = 0;i<10;i++){ var op = document.createElement("option"); op.innerHTML = '新增的选项' + i; a.add(op,null); a.size = 5; document.getElementById("test").appendChild(a); } </script> </body></code></pre> <p><a href="http://img.e-com-net.com/image/info8/6749ad5d8db7449c9414f19467751f30.png" target="_blank"><img alt="" class="has" height="95" src="http://img.e-com-net.com/image/info8/6749ad5d8db7449c9414f19467751f30.png" width="99"></a> 从运行结果可以看出，该自选框以及框内的内容都是由JavaScript动态生成的，不需要静态的定义。</p> <p style="text-indent:50px;">javascript这样动态生成的特点，可以减少JS对HTML的依赖性，这样极大的增加了代码的可重用性。</p> <h2 style="text-indent:0px;">五、删除HTML元素</h2> <p style="text-indent:50px;">删除HTML元素也是通过删除节点来完成的。对于普通的HTML元素，可以通过方法来删除节点，而列表框、下拉菜单、表格则有额外的方法来删除HTML元素。</p> <pre class="has"><code class="language-html"><body id="test"> <input id="add" type="button" value="增加" disabled onclick="add();"/> <input id="del" type="button" value="删除" onclick="del();"/> <div id="target" style="width:240px;height:50px;border:1px solid black;"></div> <script type="text/javascript"> var body = document.getElementById("test"); var target = document.getElementById("target"); var add = function(){ body.appendChild(target); document.getElementById("add").disabled = "disabled"; document.getElementById("del").disabled = ""; } var del = function(){ body.removeChild(target); document.getElementById("del").disabled = "disabled"; document.getElementById("add").disabled = ""; } </script> </body></code></pre> <p><a href="http://img.e-com-net.com/image/info8/e9a7cbb19a154d98a9322fbd220585f8.png" target="_blank"><img alt="" class="has" height="93" src="http://img.e-com-net.com/image/info8/e9a7cbb19a154d98a9322fbd220585f8.png" width="271"></a><a href="http://img.e-com-net.com/image/info8/3102a3b98b27474da9551482126d99df.png" target="_blank"><img alt="" class="has" height="83" src="http://img.e-com-net.com/image/info8/3102a3b98b27474da9551482126d99df.png" width="276"></a>通过点击删除来将id为target的div移除，点击删除之后删除按钮不可点击，增加按钮变得可以点击。</p> <p>我们再来看看表格中删除某行某列的做法：</p> <pre class="has"><code class="language-html"><body> 第<input type="text" id="row"/>行,第<input type="text" id="col"/>列 <input type="button" onclick="del();" value="删除第i列第j行"/><br /> <table id="test" border="1px solid black;" style="width:500px;"> <caption>疯狂Java体系</caption> <tr> <td>疯狂Java讲义</td> <td>轻量级Java EE企业应用实战</td> </tr> <tr> <td>疯狂Java讲义</td> <td>轻量级Java EE企业应用实战</td> </tr> <tr> <td>疯狂Java讲义</td> <td>轻量级Java EE企业应用实战</td> </tr> </table> <script type="text/javascript"> var tab = document.getElementById("test"); var del = function(){ var row = document.getElementById("row").value; var col = document.getElementById("col").value; var rowList = tab.rows; if(row==""||col==""){ alert("不可为空"); } if(isNaN(row)){ alert("行输入不规范"); return false; } if(isNaN(col)){ alert("列输入不规范"); return false; } if(row > rowList.length||row<0){ alert("不存在该行"); return false; } let delrow = rowList.item( row - 1); let cols = tab.rows[row-1].cells.length; if(col > cols || col<0){ alert("不存在该列"); return false; } delrow.deleteCell(col-1); } </script> </body></code></pre> <p>在表格的删除中，通过用户输入数字来指定要删除的某行某列，其中要注意的是，table.rows能够获得一个数组对象，所以索引值由0开始，故而和用户的输入之间要相差1；其次，为了规避用户的不规则输出，我通过isNaN()函数判断获得到的input框的value是否可以转为数字，借此判断用户输入的规范性；得到行和列之后还要对行和列进行数量上的判断，用户输入为负数或者输入的大于总行数或列数大于总列数，都要停止删除行为，用return false强行结束del()函数。</p> <p>在对该代码进行测试的过程中，我们还能够发现有趣的事情，那就是，在把某一行完全删除后，该行不会消失，但列都已经不存在了，这个时候我们就可以通过一个判断来判定该行是否还有列元素。</p> <pre class="has"><code class="language-javascript">if(cols==1){ //如果被删除之前只有一列，则在删除该列之后该行为空，故要删除该行 tab.deleteRow(row-1); }</code></pre> <p>把上面的代码放在删除操作之后就可以完成你想要的效果啦。</p> </div> </div> </div> </div> </div>  <div id="SOHUCS" sid="1493142312505597952"></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">  <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>  <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>  <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,JS入门,增删改查HTML元素)</h4> <div id="paradigm-article-related"> <div class="recommend-post mb30"> <ul class="widget-links"> <li><a href="/article/1942692420139413504.htm" title="大学生HTML期末大作业——HTML+CSS+JavaScript传统文化" target="_blank">大学生HTML期末大作业——HTML+CSS+JavaScript传统文化</a> <span class="text-muted">无·糖</span> <a class="tag" taget="_blank" href="/search/Web%E5%89%8D%E7%AB%AF%E6%9C%9F%E6%9C%AB%E5%A4%A7%E4%BD%9C%E4%B8%9A/1.htm">Web前端期末大作业</a><a class="tag" taget="_blank" href="/search/html/1.htm">html</a><a class="tag" taget="_blank" href="/search/%E8%AF%BE%E7%A8%8B%E8%AE%BE%E8%AE%A1/1.htm">课程设计</a><a class="tag" taget="_blank" href="/search/css/1.htm">css</a><a class="tag" taget="_blank" href="/search/%E5%A4%A7%E5%AD%A6%E7%94%9F/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%A4%A7%E4%BD%9C%E4%B8%9A/1.htm">大作业</a><a class="tag" taget="_blank" href="/search/%E6%9C%9F%E6%9C%AB%E4%BD%9C%E4%B8%9A/1.htm">期末作业</a> <div>HTML+CSS+JS【传统文化】网页设计期末课程大作业web前端开发技术web课程设计网页规划与设计文章目录一、网站题目二、网站描述三、网站介绍四、网站效果五、️网站代码六、️‍如何学习进步七、‍☠️更多干货文章目录一、网站题目传统文化精美设计5页含注册登录二、网站描述总结了一些学生网页制作的经验：一般的网页需要融入以下知识点：div+css布局、浮动、定位、高级css、表格、表单及验证、js轮</div> </li> <li><a href="/article/1942692421359955968.htm" title="云原生--微服务、CICD、SaaS、PaaS、IaaS" target="_blank">云原生--微服务、CICD、SaaS、PaaS、IaaS</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/docker/1.htm">docker</a><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/%E5%BE%AE%E6%9C%8D%E5%8A%A1/1.htm">微服务</a><a class="tag" taget="_blank" href="/search/kubernetes/1.htm">kubernetes</a><a class="tag" taget="_blank" href="/search/serverless/1.htm">serverless</a><a class="tag" taget="_blank" href="/search/service_mesh/1.htm">service_mesh</a><a class="tag" taget="_blank" href="/search/ci%2Fcd/1.htm">ci/cd</a> <div>往期推荐浅学React和JSX-CSDN博客一文搞懂大数据流式计算引擎Flink【万字详解，史上最全】-CSDN博客一文入门大数据准流式计算引擎Spark【万字详解，全网最新】_大数据spark-CSDN博客目录1.云原生概念和特点2.常见云模式3.云对外提供服务的架构模式3.1IaaS（Infrastructure-as-a-Service）3.2PaaS（Platform-as-a-Servi</div> </li> <li><a href="/article/1942690656627519488.htm" title="Turndown 项目教程" target="_blank">Turndown 项目教程</a> <span class="text-muted">卓桔洋</span> <div>Turndown项目教程turndownAnHTMLtoMarkdownconverterwritteninJavaScript项目地址:https://gitcode.com/gh_mirrors/tu/turndown项目介绍Turndown是一个用JavaScript编写的HTML到Markdown转换器。它旨在与CommonMark规范兼容，并提供了多种选项来定制输出样式。Turndown</div> </li> <li><a href="/article/1942690026974408704.htm" title="HTML 语言代码" target="_blank">HTML 语言代码</a> <span class="text-muted"></span> <div>HTML语言代码引言HTML，即超文本标记语言（HyperTextMarkupLanguage），是构建网页和互联网应用的基础。自1990年发明以来，HTML一直是网页设计和开发的核心技术。本文将详细介绍HTML语言的起源、发展、基本结构、常用标签以及在实际应用中的重要性。HTML语言的起源与发展起源HTML的发明者是蒂姆·伯纳斯-李（TimBerners-Lee），他在1989年发明了万维网（W</div> </li> <li><a href="/article/1942690026487869440.htm" title="XML 命名空间" target="_blank">XML 命名空间</a> <span class="text-muted">froginwe11</span> <a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a> <div>XML命名空间引言XML（可扩展标记语言）是一种用于存储和传输数据的标记语言。在XML中，命名空间（Namespace）是一种用于区分不同元素和属性的方法，它有助于避免元素和属性名称的冲突，并提高XML文档的可维护性和互操作性。本文将深入探讨XML命名空间的概念、使用方法以及在实际应用中的重要性。命名空间的概念在XML中，命名空间是一个URI（统一资源标识符）字符串，用于标识一个元素或属性所属的命</div> </li> <li><a href="/article/1942689899761168384.htm" title="Puppeteer 库简介：背景、用法与原理" target="_blank">Puppeteer 库简介：背景、用法与原理</a> <span class="text-muted">超级土豆粉</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><a class="tag" taget="_blank" href="/search/html/1.htm">html</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a> <div>Puppeteer库简介：背景、用法与原理一、背景Puppeteer是Google官方推出的一个Node.js库，最初于2017年发布。它为开发者提供了一个高级API，用于通过编程方式控制Chrome或Chromium浏览器。Puppeteer主要用于自动化网页操作、爬虫、UI测试、生成PDF截图等场景。随着Web自动化需求的增长，Puppeteer逐渐成为前端开发、测试和数据采集领域的重要工具。</div> </li> <li><a href="/article/1942689772812169216.htm" title="Fuse.js 模糊匹配库用法总结" target="_blank">Fuse.js 模糊匹配库用法总结</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>目录Fuse.js模糊匹配库用法总结简介安装与引入基本用法1.对字符串数组进行模糊搜索2.对对象数组进行模糊搜索主要配置项（Options）进阶用法1.权重搜索（WeightedSearch）2.嵌套搜索（NestedSearch）3.扩展搜索（ExtendedSearch）4.逻辑查询（LogicalQueryOperators）5.索引优化（Indexing）6.全局配置（GlobalConf</div> </li> <li><a href="/article/1942689646433595392.htm" title="Day.js 基础用法全方位详解" target="_blank">Day.js 基础用法全方位详解</a> <span class="text-muted">超级土豆粉</span> <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF%E6%8A%80%E6%9C%AF%E6%B2%89%E6%B7%80%E6%8C%87%E5%8D%97/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/ecmascript/1.htm">ecmascript</a> <div>Day.js基础用法全方位详解目录Day.js基础用法全方位详解一、Day.js简介二、安装与引入1.NPM/Yarn安装2.CDN引入三、创建日期对象四、格式化日期五、解析日期（字符串转日期）六、日期运算1.加法`.add()`2.减法`.subtract()`3.支持的单位七、获取日期信息八、设置日期信息九、日期比较十、获取时间戳与原生Date十一、判断有效性与闰年十二、获取月初、月末、年初、</div> </li> <li><a href="/article/1942688889479163904.htm" title="移动端turn.js挖坑总结" target="_blank">移动端turn.js挖坑总结</a> <span class="text-muted">进击的金城武</span> <div>【1】高版本的jquery会导致turning的过程中page溢出半屏。正确版本：【2】可通过css修改翻书的底部颜色及其透明度，默认为transparent。.flipbook.page{background-color:/*底部色*/}【3】在turn.js的源文件2734行通过修改x,y的值可调整peel的大小与角度。flipMethods._showFoldedPage.call(this</div> </li> <li><a href="/article/1942677045825826816.htm" title="《手把手教你》系列技巧篇（二十二）-java+ selenium自动化测试-webdriver处理浏览器多窗口切换上卷（详细教程）" target="_blank">《手把手教你》系列技巧篇（二十二）-java+ selenium自动化测试-webdriver处理浏览器多窗口切换上卷（详细教程）</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/selenium/1.htm">selenium</a><a class="tag" taget="_blank" href="/search/%E6%B5%8B%E8%AF%95%E5%B7%A5%E5%85%B7/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><a class="tag" taget="_blank" href="/search/%E8%87%AA%E5%8A%A8%E5%8C%96/1.htm">自动化</a> <div>1.简介上一篇讲解和分享了如何获取浏览器窗口的句柄，那么今天这一篇就是讲解获取后我们要做什么，就是利用获取的句柄进行浏览器窗口的切换来分别定位不同页面中的元素进行操作。2.为什么要切换窗口？Selenium在当前页面打开了新的窗口，此时就需要跳转到新的窗口去，就需要把窗口进行切换。宏哥这里简单举例一个测试场景，你在页面A点击一个连接，会在新的tab窗口打开页面B，这个时候，你在页面B点击一个连接，</div> </li> <li><a href="/article/1942676163386208256.htm" title="豆瓣8.6分神作：这本《JavaScript DOM编程艺术》，凭什么让前端人读了12年仍奉为圭臬？" target="_blank">豆瓣8.6分神作：这本《JavaScript DOM编程艺术》，凭什么让前端人读了12年仍奉为圭臬？</a> <span class="text-muted">阿蒙Armon</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><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a> <div>豆瓣8.6分神作：这本《JavaScriptDOM编程艺术》，凭什么让前端人读了12年仍奉为圭臬？如果你是Web开发者，一定听过这样的困惑：“学了一堆JavaScript语法，却还是写不出流畅的动态交互？”“懂HTML和CSS，可面对DOM操作总觉得隔层纱？”别急，有一本豆瓣8.6分、5星好评占比47.4%的经典，早就为这些问题准备好了答案——它就是《JavaScriptDOM编程艺术（第2版）》</div> </li> <li><a href="/article/1942675404615643136.htm" title="Web-API-day1 DOM 文档对象模型" target="_blank">Web-API-day1 DOM 文档对象模型</a> <span class="text-muted">码哥DFS</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>获取DOM对象1.querySelector(")满足条件第一个元素2.querySelectorAll(")满足条件的元素集合返回伪数组3.了解其他方式1）getElementById2)getElementByTagname操作元素内容修改DOM文本内容1)innerText将文本内容添加/更细到任意标签位置，文本包含的标签不会被解析2)innerHTML将文本内容添加/更细到任意标签位置，文</div> </li> <li><a href="/article/1942675405240594432.htm" title="Web-API-day2 间歇函数setInterval与事件监听addEvenListener" target="_blank">Web-API-day2 间歇函数setInterval与事件监听addEvenListener</a> <span class="text-muted">码哥DFS</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>1.间歇函数setInterval(函数，间隔时间）时间单位为毫秒functionfn(){console.log('hello')}letn=setInterval(fn,1000)console.log(n)关闭间歇函数clearInterval(变量名)2.事件监听元素对象.addEvenListener('事件类型',执行函数）事件类型：鼠标事件：click（点击）、mouseenter（</div> </li> <li><a href="/article/1942669859833835520.htm" title="3、微服务整合Swagger3.0 - 网关Gateway聚合接口" target="_blank">3、微服务整合Swagger3.0 - 网关Gateway聚合接口</a> <span class="text-muted">cch记录JAVA</span> <a class="tag" taget="_blank" href="/search/%E7%B3%BB%E7%BB%9F%E6%8E%A5%E5%8F%A3%E6%96%87%E6%A1%A3Swagger/1.htm">系统接口文档Swagger</a><a class="tag" taget="_blank" href="/search/knife4j/1.htm">knife4j</a><a class="tag" taget="_blank" href="/search/%E5%BE%AE%E6%9C%8D%E5%8A%A1/1.htm">微服务</a><a class="tag" taget="_blank" href="/search/gateway/1.htm">gateway</a><a class="tag" taget="_blank" href="/search/%E6%9E%B6%E6%9E%84/1.htm">架构</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/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E5%90%8E%E7%AB%AF/1.htm">后端</a> <div>1、SpringBoot快速整合Swagger3.02、微服务整合Swagger3.0-抽取为公共模块3、微服务整合Swagger3.0-网关Gateway聚合接口4、微服务整合Swagger3.0-使用方法5、微服务Swagger3.0升级为Knife4j一、实现的效果访问http://{ip}:{port}/swagger-ui/index.htmlspringfox-swagger提供的分组</div> </li> <li><a href="/article/1942669354755747840.htm" title="Java技术栈/面试题合集(16)-SpringCloud篇" target="_blank">Java技术栈/面试题合集(16)-SpringCloud篇</a> <span class="text-muted">霸道流氓气质</span> <a class="tag" taget="_blank" href="/search/Java%E8%BF%9B%E9%98%B6/1.htm">Java进阶</a><a class="tag" taget="_blank" href="/search/Java/1.htm">Java</a><a class="tag" taget="_blank" href="/search/SpringCloud/1.htm">SpringCloud</a><a class="tag" taget="_blank" href="/search/%E5%BE%AE%E6%9C%8D%E5%8A%A1/1.htm">微服务</a><a class="tag" taget="_blank" href="/search/%E9%9D%A2%E8%AF%95/1.htm">面试</a> <div>场景Java入门、进阶、强化、扩展、知识体系完善等知识点学习、性能优化、源码分析专栏分享：Java入门、进阶、强化、扩展、知识体系完善等知识点学习、性能优化、源码分析专栏分享_java高级进阶-CSDN博客通过对面试题进行系统的复习可以对Java体系的知识点进行查漏补缺。注：博客：霸道流氓气质-CSDN博客实现什么是SpringCloud？一、SpringCloud的核心定位1.定义SpringC</div> </li> <li><a href="/article/1942662295339462656.htm" title="如何调用dify工作流api，代码格式如下" target="_blank">如何调用dify工作流api，代码格式如下</a> <span class="text-muted"></span> <div>importrequestsimportjson#API配置api_url="http://localhost:8082/v1/workflows/run"api_key="app-6Ef8WnCL1rB4oMtvPgaLBSJy"#请求头headers={ 'Authorization':f'Bearer{api_key}', 'Content-Type':'application/json</div> </li> <li><a href="/article/1942661916690280448.htm" title="Docker 和 Kubernetes 入门到精通：运维工程师的实战笔记 (近5万字)" target="_blank">Docker 和 Kubernetes 入门到精通：运维工程师的实战笔记 (近5万字)</a> <span class="text-muted">运维小贺</span> <a class="tag" taget="_blank" href="/search/%E8%BF%90%E7%BB%B4/1.htm">运维</a><a class="tag" taget="_blank" href="/search/linux/1.htm">linux</a><a class="tag" taget="_blank" href="/search/docker/1.htm">docker</a><a class="tag" taget="_blank" href="/search/%E5%AE%B9%E5%99%A8/1.htm">容器</a><a class="tag" taget="_blank" href="/search/kubernetes/1.htm">kubernetes</a><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/kubelet/1.htm">kubelet</a> <div>文章目录1.Docker1.1Docker是什么？1.1.1容器服务原理1.2Docker的三大概念1.2.1镜像1.2.2容器1.2.3仓库1.2.4总结1.3Docker常用命令1.3.1镜像常用命令1.3.2容器常用命令1.4Dockerfile1.4.1commit的局限1.4.2Dockerfile是什么？1.4.3如何使用Dockerfile制作镜像?1.4.4Dockerfile中常</div> </li> <li><a href="/article/1942656120061489152.htm" title="【Docker】10 min 快速入门 Docker" target="_blank">【Docker】10 min 快速入门 Docker</a> <span class="text-muted"></span> <div>参考链接：https://www.youtube.com/watch?v=Ozb9mZg7MVMDocker是一个用于构建运行传送应用程序的平台Docker和虚拟机的区别虚拟化技术：将物理资源虚拟化为多个逻辑资源的技术虚拟机：将一台物理服务器虚拟化为多个逻辑服务器，每个逻辑服务器都有自己的操作系统缺点：每台虚拟机都需要占用巨大的资源启动速度很慢Docker使用宿主机的操作系统，启动速度非常快可以在</div> </li> <li><a href="/article/1942654608656625664.htm" title="深入理解Tomcat 基本架构" target="_blank">深入理解Tomcat 基本架构</a> <span class="text-muted">水木石画室</span> <a class="tag" taget="_blank" href="/search/tomcat/1.htm">tomcat</a><a class="tag" taget="_blank" href="/search/%E6%9E%B6%E6%9E%84/1.htm">架构</a><a class="tag" taget="_blank" href="/search/java/1.htm">java</a> <div>Tomcat是Apache软件基金会旗下的开源Servlet容器，实现了JavaEE（现JakartaEE）的Servlet、JSP等规范，广泛用于JavaWeb应用的部署和运行。其架构设计围绕高效处理HTTP请求、灵活管理Web应用和支持扩展展开。以下从核心组件、层级结构、关键机制三个维度深入解析Tomcat的基本架构。一、Tomcat核心组件与层级结构Tomcat的架构采用分层容器模型，核心组</div> </li> <li><a href="/article/1942645288707616768.htm" title="gRPC服务发现" target="_blank">gRPC服务发现</a> <span class="text-muted">叹人间，美中不足今方信</span> <a class="tag" taget="_blank" href="/search/%E6%9C%8D%E5%8A%A1%E5%8F%91%E7%8E%B0/1.htm">服务发现</a><a class="tag" taget="_blank" href="/search/go/1.htm">go</a><a class="tag" taget="_blank" href="/search/rpc/1.htm">rpc</a> <div>基于etcd实现的服务发现，按照非规范化的etcdkey实现，详细见代码注释。packagediscoveryimport("context""encoding/json""fmt""go.etcd.io/etcd/api/v3/mvccpb"clientv3"go.etcd.io/etcd/client/v3""google.golang.org/grpc/resolver""strings""</div> </li> <li><a href="/article/1942641635972149248.htm" title="深入浅出JavaScript定时器：掌握异步编程的核心工具" target="_blank">深入浅出JavaScript定时器：掌握异步编程的核心工具</a> <span class="text-muted">coding随想</span> <a class="tag" taget="_blank" href="/search/JavaScript/1.htm">JavaScript</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/ecmascript/1.htm">ecmascript</a> <div>深入浅出JavaScript定时器：掌握异步编程的核心工具在前端开发中，JavaScript定时器是一个看似简单却功能强大的工具。它不仅是实现延时操作和周期性任务的基础，更是理解JavaScript事件循环机制的关键。本文将带你全面了解JavaScript定时器的原理、用法以及最佳实践。一、什么是JavaScript定时器？JavaScript定时器是通过setTimeout和setInterva</div> </li> <li><a href="/article/1942641509698433024.htm" title="一文搞懂 JavaScript 中的 `pageXOffset`、`scrollX`、`pageYOffset` 和 `scrollY`" target="_blank">一文搞懂 JavaScript 中的 `pageXOffset`、`scrollX`、`pageYOffset` 和 `scrollY`</a> <span class="text-muted"></span> <div>一文搞懂JavaScript中的pageXOffset、scrollX、pageYOffset和scrollY在前端开发中，页面滚动是一个非常常见的交互场景。无论是实现“回到顶部”按钮、固定导航栏，还是动态加载内容，开发者都需要精确控制或获取页面的滚动位置。而JavaScript中的pageXOffset、scrollX、pageYOffset和scrollY四个属性，正是实现这些功能的关键工具。</div> </li> <li><a href="/article/1942641004821671936.htm" title="Flutter-完整开发实战详解(一、Dart-语言和-Flutter-基础)" target="_blank">Flutter-完整开发实战详解(一、Dart-语言和-Flutter-基础)</a> <span class="text-muted">2401_85122662</span> <a class="tag" taget="_blank" href="/search/flutter/1.htm">flutter</a> <div>《Android学习笔记总结+最新移动架构视频+大厂安卓面试真题+项目实战源码讲义》完整开源地址：https://docs.qq.com/doc/DSkNLaERkbnFoS0ZF基本类型var可以定义变量，如vartag=“666”，这和JS、Kotlin等语言类似，同时Dart属于动态类型语言，支持闭包。Dart中number类型分为int和double，其中java中的long对应的也是Da</div> </li> <li><a href="/article/1942638862543155200.htm" title="UniApp的学习" target="_blank">UniApp的学习</a> <span class="text-muted">xuzhihuan焕</span> <a class="tag" taget="_blank" href="/search/uni-app/1.htm">uni-app</a><a class="tag" taget="_blank" href="/search/%E5%AD%A6%E4%B9%A0/1.htm">学习</a> <div>一.Vue.js基础基本概念：总之，Vue.js是一个简洁、灵活、高效的前端JavaScript框架，具有响应式数据绑定、组件化开发、虚拟DOM等特点，适用于构建各种类型的Web应用。Vue.js介绍：了解Vue.js的起源、特点以及基本概念。特点：简洁易用：Vue.js的API简洁明了，学习曲线较为平缓，使得开发者能够快速上手。响应式数据绑定：Vue.js提供了响应式的数据绑定机制，当数据发生变</div> </li> <li><a href="/article/1942637473867821056.htm" title="扣子智能体5：使用Python异步执行工作流并获取执行结果" target="_blank">扣子智能体5：使用Python异步执行工作流并获取执行结果</a> <span class="text-muted">呆萌的代Ma</span> <a class="tag" taget="_blank" href="/search/%E5%A4%A7%E6%A8%A1%E5%9E%8B/1.htm">大模型</a><a class="tag" taget="_blank" href="/search/python/1.htm">python</a><a class="tag" taget="_blank" href="/search/%E6%89%A3%E5%AD%90/1.htm">扣子</a> <div>使用python异步执行工作流的步骤有3步：异步执行工作流，获取工作流的execute_id，之后就能根据这个id查询工作流的执行情况如果execute_id=“Success”，就表示工作流执行完毕执行完毕后，打印output，就是大模型最后的全部示例代码fromloguruimportloggerimportrequestsimportjsondefrun_coze_ai(coze_api_t</div> </li> <li><a href="/article/1942637474723459072.htm" title="mybatis打印完整mysql_mybatis 通过拦截器打印完整的sql语句以及执行结果操作" target="_blank">mybatis打印完整mysql_mybatis 通过拦截器打印完整的sql语句以及执行结果操作</a> <span class="text-muted">weixin_39672680</span> <div>开发过程中，如果使用mybatis做为ORM框架，经常需要打印出完整的sql语句以及执行的结果做为参考。虽然mybatis结合日志框架可以做到，但打印出来的通常都是sql和参数分开的。有时我们需要调试这条sql的时候，就需要把参数填进去，这样未免有些浪费时间。此时我们可以通过实现mybatis拦截器来做到打印带参数的完整的sql，以及结果通过json输出到控制台。直接看代码和使用方法吧：MyBat</div> </li> <li><a href="/article/1942632682349457408.htm" title="FairyGUI 实现 Boss 双层血条动画" target="_blank">FairyGUI 实现 Boss 双层血条动画</a> <span class="text-muted">future1412</span> <a class="tag" taget="_blank" href="/search/%E5%AD%A6%E4%B9%A0/1.htm">学习</a> <div>涉及到一个问题的话先去了解前因后果，涉及到的UI框架，全部吃懂吃透。一：理解血条系统的组成1.boss血条一般包括：红色血条：表示当前血量，随伤害立即减少；白色血条（残影）：慢慢减少，产生一种“缓冲”的受伤视觉效果；血条分段（如2条血表示不同阶段）；血条消失/出现动画；血条附加信息：如Boss名字、阶段数、状态效果等。二：准备环境Unity+FairyGUI准备血条UI元素：使用两张图层叠加实现红</div> </li> <li><a href="/article/1942631422527336448.htm" title="python进阶之数据结构与算法--入门-二叉树" target="_blank">python进阶之数据结构与算法--入门-二叉树</a> <span class="text-muted">小白piao</span> <a class="tag" taget="_blank" href="/search/%E6%95%B0%E6%8D%AE%E7%BB%93%E6%9E%84%E4%B8%8E%E7%AE%97%E6%B3%95python%E7%AF%87/1.htm">数据结构与算法python篇</a><a class="tag" taget="_blank" href="/search/%E6%95%B0%E6%8D%AE%E7%BB%93%E6%9E%84/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%BA%8C%E5%8F%89%E6%A0%91/1.htm">二叉树</a><a class="tag" taget="_blank" href="/search/python/1.htm">python</a> <div>二叉树概念：之前已经提及了关于树的概念，要想知道之前讲了什么请关注，前边文章里都有提及。这里不做赘述。二叉树是具有以下属性的有序树：1、每个节点最多有两个孩子节点2、每个孩子节点被命名为左子节点和右子节点3、对于每个节点的孩子节点，在顺序上，左子节点优先于右子节点4、若子树的根为内部节点v的左子节点或者右子节点，则该子树相应地被称为节点v的左子树或者右子树5、若每个节点都有零个或者两个节点，则这样</div> </li> <li><a href="/article/1942629154881073152.htm" title="Unity UGUI GraphicRaycaster.Raycast详解" target="_blank">Unity UGUI GraphicRaycaster.Raycast详解</a> <span class="text-muted">上班摸鱼君</span> <a class="tag" taget="_blank" href="/search/unity/1.htm">unity</a><a class="tag" taget="_blank" href="/search/%E6%B8%B8%E6%88%8F%E5%BC%95%E6%93%8E/1.htm">游戏引擎</a> <div>一、源码//////对当前Canvas上的所有可交互UI图形执行射线检测，判断是否被点击或触碰。//////指针事件的数据（包含鼠标位置、触摸点等）///用于存储命中的UI元素结果列表publicoverridevoidRaycast(PointerEventDataeventData,ListresultAppendList){//如果Canvas不存在，则无法进行任何UI检测，直接返回if(c</div> </li> <li><a href="/article/1942626886186233856.htm" title="网页token介绍（web token、web认证、web令牌、网页令牌）（JWT格式：JSON Web Token，头部Header、载荷Payload、签名Signature）" target="_blank">网页token介绍（web token、web认证、web令牌、网页令牌）（JWT格式：JSON Web Token，头部Header、载荷Payload、签名Signature）</a> <span class="text-muted">Dontla</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> <div>文章目录WebToken详解：从认证机制演变到实现原理认证机制的演变史传统认证方式的局限-服务器负载增加-扩展性受限-跨域应用困难-CSRF攻击风险高无状态认证的崛起WebToken核心概念什么是WebTokenToken家族成员-**JWT(JSONWebToken)**:最流行的实现-**SWT(SimpleWebToken)**:微软早期推出的简化版本-**SAMLToken**:企业级身份</div> </li> <li><a href="/article/91.htm" title="java解析APK" target="_blank">java解析APK</a> <span class="text-muted">3213213333332132</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/apk/1.htm">apk</a><a class="tag" taget="_blank" href="/search/linux/1.htm">linux</a><a class="tag" taget="_blank" href="/search/%E8%A7%A3%E6%9E%90APK/1.htm">解析APK</a> <div>解析apk有两种方法 1、结合安卓提供apktool工具，用java执行cmd解析命令获取apk信息 2、利用相关jar包里的集成方法解析apk 这里只给出第二种方法，因为第一种方法在linux服务器下会出现不在控制范围之内的结果。 public class ApkUtil { /** * 日志对象 */ private static Logger </div> </li> <li><a href="/article/218.htm" title="nginx自定义ip访问N种方法" target="_blank">nginx自定义ip访问N种方法</a> <span class="text-muted">ronin47</span> <a class="tag" taget="_blank" href="/search/nginx+%E7%A6%81%E6%AD%A2ip%E8%AE%BF%E9%97%AE/1.htm">nginx 禁止ip访问</a> <div>　　　因业务需要，禁止一部分内网访问接口，　由于前端架了F5，直接用deny或allow是不行的，这是因为直接获取的前端Ｆ５的地址。　　　所以开始思考有哪些主案可以实现这样的需求，目前可实施的是三种：　　　一：把ip段放在redis里，写一段lua 二：利用geo传递变量，写一段</div> </li> <li><a href="/article/345.htm" title="mysql timestamp类型字段的CURRENT_TIMESTAMP与ON UPDATE CURRENT_TIMESTAMP属性" target="_blank">mysql timestamp类型字段的CURRENT_TIMESTAMP与ON UPDATE CURRENT_TIMESTAMP属性</a> <span class="text-muted">dcj3sjt126com</span> <a class="tag" taget="_blank" href="/search/mysql/1.htm">mysql</a> <div>timestamp有两个属性，分别是CURRENT_TIMESTAMP 和ON UPDATE CURRENT_TIMESTAMP两种，使用情况分别如下： 1. CURRENT_TIMESTAMP 当要向数据库执行insert操作时，如果有个timestamp字段属性设为 CURRENT_TIMESTAMP，则无论这</div> </li> <li><a href="/article/472.htm" title="struts2+spring+hibernate分页显示" target="_blank">struts2+spring+hibernate分页显示</a> <span class="text-muted">171815164</span> <a class="tag" taget="_blank" href="/search/Hibernate/1.htm">Hibernate</a> <div>分页显示一直是web开发中一大烦琐的难题，传统的网页设计只在一个JSP或者ASP页面中书写所有关于数据库操作的代码，那样做分页可能简单一点，但当把网站分层开发后，分页就比较困难了，下面是我做Spring+Hibernate+Struts2项目时设计的分页代码，与大家分享交流。　　1、DAO层接口的设计，在MemberDao接口中定义了如下两个方法： public in</div> </li> <li><a href="/article/599.htm" title="构建自己的Wrapper应用" target="_blank">构建自己的Wrapper应用</a> <span class="text-muted">g21121</span> <a class="tag" taget="_blank" href="/search/rap/1.htm">rap</a> <div> 我们已经了解Wrapper的目录结构，下面可是正式利用Wrapper来包装我们自己的应用，这里假设Wrapper的安装目录为:/usr/local/wrapper。首先，创建项目应用 &nb</div> </li> <li><a href="/article/726.htm" title="[简单]工作记录_多线程相关" target="_blank">[简单]工作记录_多线程相关</a> <span class="text-muted">53873039oycg</span> <a class="tag" taget="_blank" href="/search/%E5%A4%9A%E7%BA%BF%E7%A8%8B/1.htm">多线程</a> <div> 最近遇到多线程的问题,原来使用异步请求多个接口(n*3次请求) 方案一使用多线程一次返回数据,最开始是使用5个线程,一个线程顺序请求3个接口,超时终止返回缺点测试发现必须3个接</div> </li> <li><a href="/article/853.htm" title="调试jdk中的源码，查看jdk局部变量" target="_blank">调试jdk中的源码，查看jdk局部变量</a> <span class="text-muted">程序员是怎么炼成的</span> <a class="tag" taget="_blank" href="/search/jdk+%E6%BA%90%E7%A0%81/1.htm">jdk 源码</a> <div>转自：http://www.douban.com/note/211369821/ 学习jdk源码时使用-- 学习java最好的办法就是看jdk源代码，面对浩瀚的jdk（光源码就有40M多，比一个大型网站的源码都多）从何入手呢，要是能单步调试跟进到jdk源码里并且能查看其中的局部变量最好了。可惜的是sun提供的jdk并不能查看运行中的局部变量</div> </li> <li><a href="/article/980.htm" title="Oracle RAC Failover 详解" target="_blank">Oracle RAC Failover 详解</a> <span class="text-muted">aijuans</span> <a class="tag" taget="_blank" href="/search/oracle/1.htm">oracle</a> <div>Oracle RAC 同时具备HA(High Availiablity) 和LB(LoadBalance). 而其高可用性的基础就是Failover(故障转移). 它指集群中任何一个节点的故障都不会影响用户的使用，连接到故障节点的用户会被自动转移到健康节点，从用户感受而言，是感觉不到这种切换。 Oracle 10g RAC 的Failover 可以分为3种： 1. Client-Si</div> </li> <li><a href="/article/1107.htm" title="form表单提交数据编码方式及tomcat的接受编码方式" target="_blank">form表单提交数据编码方式及tomcat的接受编码方式</a> <span class="text-muted">antonyup_2006</span> <a class="tag" taget="_blank" href="/search/JavaScript/1.htm">JavaScript</a><a class="tag" taget="_blank" href="/search/tomcat/1.htm">tomcat</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/%E4%BA%92%E8%81%94%E7%BD%91/1.htm">互联网</a><a class="tag" taget="_blank" href="/search/servlet/1.htm">servlet</a> <div>原帖地址：http://www.iteye.com/topic/266705 form有2中方法把数据提交给服务器，get和post,分别说下吧。（一）get提交 1.首先说下客户端（浏览器）的form表单用get方法是如何将数据编码后提交给服务器端的吧。对于get方法来说，都是把数据串联在请求的url后面作为参数，如：http://localhost:</div> </li> <li><a href="/article/1234.htm" title="JS初学者必知的基础" target="_blank">JS初学者必知的基础</a> <span class="text-muted">百合不是茶</span> <a class="tag" taget="_blank" href="/search/js%E5%87%BD%E6%95%B0/1.htm">js函数</a><a class="tag" taget="_blank" href="/search/js%E5%85%A5%E9%97%A8%E5%9F%BA%E7%A1%80/1.htm">js入门基础</a> <div>JavaScript是网页的交互语言,实现网页的各种效果, JavaScript 是世界上最流行的脚本语言。 JavaScript 是属于 web 的语言，它适用于 PC、笔记本电脑、平板电脑和移动电话。 JavaScript 被设计为向 HTML 页面增加交互性。许多 HTML 开发者都不是程序员，但是 JavaScript 却拥有非常简单的语法。几乎每个人都有能力将小的 </div> </li> <li><a href="/article/1361.htm" title="iBatis的分页分析与详解" target="_blank">iBatis的分页分析与详解</a> <span class="text-muted">bijian1013</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/ibatis/1.htm">ibatis</a> <div> 分页是操作数据库型系统常遇到的问题。分页实现方法很多，但效率的差异就很大了。iBatis是通过什么方式来实现这个分页的了。查看它的实现部分，发现返回的PaginatedList实际上是个接口，实现这个接口的是PaginatedDataList类的对象，查看PaginatedDataList类发现，每次翻页的时候最</div> </li> <li><a href="/article/1488.htm" title="精通Oracle10编程SQL(15)使用对象类型" target="_blank">精通Oracle10编程SQL(15)使用对象类型</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/plsql/1.htm">plsql</a> <div>/* *使用对象类型 */ --建立和使用简单对象类型 --对象类型包括对象类型规范和对象类型体两部分。 --建立和使用不包含任何方法的对象类型 CREATE OR REPLACE TYPE person_typ1 as OBJECT( name varchar2(10),gender varchar2(4),birthdate date ); drop type p</div> </li> <li><a href="/article/1615.htm" title="【Linux命令二】文本处理命令awk" target="_blank">【Linux命令二】文本处理命令awk</a> <span class="text-muted">bit1129</span> <a class="tag" taget="_blank" href="/search/linux%E5%91%BD%E4%BB%A4/1.htm">linux命令</a> <div>awk是Linux用来进行文本处理的命令，在日常工作中，广泛应用于日志分析。awk是一门解释型编程语言，包含变量，数组，循环控制结构，条件控制结构等。它的语法采用类C语言的语法。 awk命令用来做什么？ 1.awk适用于具有一定结构的文本行，对其中的列进行提取信息 2.awk可以把当前正在处理的文本行提交给Linux的其它命令处理，然后把直接结构返回给awk 3.awk实际工</div> </li> <li><a href="/article/1742.htm" title="JAVA(ssh2框架)+Flex实现权限控制方案分析" target="_blank">JAVA(ssh2框架)+Flex实现权限控制方案分析</a> <span class="text-muted">白糖_</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a> <div> 目前项目使用的是Struts2+Hibernate+Spring的架构模式，目前已经有一套针对SSH2的权限系统，运行良好。但是项目有了新需求：在目前系统的基础上使用Flex逐步取代JSP，在取代JSP过程中可能存在Flex与JSP并存的情况，所以权限系统需要进行修改。【SSH2权限系统的实现机制】权限控制分为页面和后台两块：不同类型用户的帐号分配的访问权限是不同的，用户使</div> </li> <li><a href="/article/1869.htm" title="angular.forEach" target="_blank">angular.forEach</a> <span class="text-muted">boyitech</span> <a class="tag" taget="_blank" href="/search/AngularJS/1.htm">AngularJS</a><a class="tag" taget="_blank" href="/search/AngularJS+API/1.htm">AngularJS API</a><a class="tag" taget="_blank" href="/search/angular.forEach/1.htm">angular.forEach</a> <div>angular.forEach 描述: 循环对obj对象的每个元素调用iterator, obj对象可以是一个Object或一个Array. Iterator函数调用方法: iterator(value, key, obj), 其中obj是被迭代对象，key是obj的property key或者是数组的index，value就是相应的值啦. (此函数不能够迭代继承的属性.) </div> </li> <li><a href="/article/1996.htm" title="java-谷歌面试题-给定一个排序数组，如何构造一个二叉排序树" target="_blank">java-谷歌面试题-给定一个排序数组，如何构造一个二叉排序树</a> <span class="text-muted">bylijinnan</span> <a class="tag" taget="_blank" href="/search/%E4%BA%8C%E5%8F%89%E6%8E%92%E5%BA%8F%E6%A0%91/1.htm">二叉排序树</a> <div> import java.util.LinkedList; public class CreateBSTfromSortedArray { /** * 题目:给定一个排序数组，如何构造一个二叉排序树 * 递归 */ public static void main(String[] args) { int[] data = { 1, 2, 3, 4, </div> </li> <li><a href="/article/2123.htm" title="action执行2次" target="_blank">action执行2次</a> <span class="text-muted">Chen.H</span> <a class="tag" taget="_blank" href="/search/JavaScript/1.htm">JavaScript</a><a class="tag" taget="_blank" href="/search/jsp/1.htm">jsp</a><a class="tag" taget="_blank" href="/search/XHTML/1.htm">XHTML</a><a class="tag" taget="_blank" href="/search/css/1.htm">css</a><a class="tag" taget="_blank" href="/search/Webwork/1.htm">Webwork</a> <div>xwork 写道 <action name="userTypeAction" class="com.ekangcount.website.system.view.action.UserTypeAction"> <result name="ssss" type="dispatcher"> </div> </li> <li><a href="/article/2250.htm" title="[时空与能量]逆转时空需要消耗大量能源" target="_blank">[时空与能量]逆转时空需要消耗大量能源</a> <span class="text-muted">comsci</span> <a class="tag" taget="_blank" href="/search/%E8%83%BD%E6%BA%90/1.htm">能源</a> <div> 无论如何,人类始终都想摆脱时间和空间的限制....但是受到质量与能量关系的限制,我们人类在目前和今后很长一段时间内,都无法获得大量廉价的能源来进行时空跨越..... 在进行时空穿梭的实验中,消耗超大规模的能源是必然</div> </li> <li><a href="/article/2377.htm" title="oracle的正则表达式(regular expression)详细介绍" target="_blank">oracle的正则表达式(regular expression)详细介绍</a> <span class="text-muted">daizj</span> <a class="tag" taget="_blank" href="/search/oracle/1.htm">oracle</a><a class="tag" taget="_blank" href="/search/%E6%AD%A3%E5%88%99%E8%A1%A8%E8%BE%BE%E5%BC%8F/1.htm">正则表达式</a> <div> 正则表达式是很多编程语言中都有的。可惜oracle8i、oracle9i中一直迟迟不肯加入，好在oracle10g中终于增加了期盼已久的正则表达式功能。你可以在oracle10g中使用正则表达式肆意地匹配你想匹配的任何字符串了。正则表达式中常用到的元数据(metacharacter)如下： ^ 匹配字符串的开头位置。 $ 匹配支付传的结尾位置。 * </div> </li> <li><a href="/article/2504.htm" title="报表工具与报表性能的关系" target="_blank">报表工具与报表性能的关系</a> <span class="text-muted">datamachine</span> <a class="tag" taget="_blank" href="/search/%E6%8A%A5%E8%A1%A8%E5%B7%A5%E5%85%B7/1.htm">报表工具</a><a class="tag" taget="_blank" href="/search/birt/1.htm">birt</a><a class="tag" taget="_blank" href="/search/%E6%8A%A5%E8%A1%A8%E6%80%A7%E8%83%BD/1.htm">报表性能</a><a class="tag" taget="_blank" href="/search/%E6%B6%A6%E4%B9%BE%E6%8A%A5%E8%A1%A8/1.htm">润乾报表</a> <div>在选择报表工具时，性能一直是用户关心的指标，但是，报表工具的性能和整个报表系统的性能有多大关系呢？要回答这个问题，首先要分析一下报表的处理过程包含哪些环节，哪些环节容易出现性能瓶颈，如何优化这些环节。一、报表处理的一般过程分析 1、用户选择报表输入参数后，报表引擎会根据报表模板和输入参数来解析报表，并将数据计算和读取请求以SQL的方式发送给数据库。 2、</div> </li> <li><a href="/article/2631.htm" title="初一上学期难记忆单词背诵第一课" target="_blank">初一上学期难记忆单词背诵第一课</a> <span class="text-muted">dcj3sjt126com</span> <a class="tag" taget="_blank" href="/search/word/1.htm">word</a><a class="tag" taget="_blank" href="/search/english/1.htm">english</a> <div>what 什么 your 你 name 名字 my 我的 am 是 one 一 two 二 three 三 four 四 five 五 class 班级，课 six 六 seven 七 eight 八 nince 九 ten 十 zero 零 how 怎样 old 老的 eleven 十一 twelve 十二 thirteen </div> </li> <li><a href="/article/2758.htm" title="我学过和准备学的各种技术" target="_blank">我学过和准备学的各种技术</a> <span class="text-muted">dcj3sjt126com</span> <a class="tag" taget="_blank" href="/search/%E6%8A%80%E6%9C%AF/1.htm">技术</a> <div>语言VB https://msdn.microsoft.com/zh-cn/library/2x7h1hfk.aspxJava http://docs.oracle.com/javase/8/C# https://msdn.microsoft.com/library/vstudioPHP http://php.net/manual/en/Html </div> </li> <li><a href="/article/2885.htm" title="struts2中token防止重复提交表单" target="_blank">struts2中token防止重复提交表单</a> <span class="text-muted">蕃薯耀</span> <a class="tag" taget="_blank" href="/search/%E9%87%8D%E5%A4%8D%E6%8F%90%E4%BA%A4%E8%A1%A8%E5%8D%95/1.htm">重复提交表单</a><a class="tag" taget="_blank" href="/search/struts2%E4%B8%ADtoken/1.htm">struts2中token</a> <div>struts2中token防止重复提交表单 >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> 蕃薯耀 2015年7月12日 11:52:32 星期日 ht</div> </li> <li><a href="/article/3012.htm" title="线性查找二维数组" target="_blank">线性查找二维数组</a> <span class="text-muted">hao3100590</span> <a class="tag" taget="_blank" href="/search/%E4%BA%8C%E7%BB%B4%E6%95%B0%E7%BB%84/1.htm">二维数组</a> <div>1.算法描述有序（行有序，列有序，且每行从左至右递增，列从上至下递增）二维数组查找，要求复杂度O(n) 2.使用到的相关知识：结构体定义和使用，二维数组传递（http://blog.csdn.net/yzhhmhm/article/details/2045816） 3.使用数组名传递这个的不便之处很明显，一旦确定就是不能设置列值 //使</div> </li> <li><a href="/article/3139.htm" title="spring security 3中推荐使用BCrypt算法加密密码" target="_blank">spring security 3中推荐使用BCrypt算法加密密码</a> <span class="text-muted">jackyrong</span> <a class="tag" taget="_blank" href="/search/Spring+Security/1.htm">Spring Security</a> <div>spring security 3中推荐使用BCrypt算法加密密码了，以前使用的是md5， Md5PasswordEncoder 和 ShaPasswordEncoder，现在不推荐了，推荐用bcrpt Bcrpt中的salt可以是随机的，比如： int i = 0; while (i < 10) { String password = "1234</div> </li> <li><a href="/article/3266.htm" title="学习编程并不难,做到以下几点即可!" target="_blank">学习编程并不难,做到以下几点即可!</a> <span class="text-muted">lampcy</span> <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/html/1.htm">html</a><a class="tag" taget="_blank" href="/search/%E7%BC%96%E7%A8%8B%E8%AF%AD%E8%A8%80/1.htm">编程语言</a> <div>不论你是想自己设计游戏，还是开发iPhone或安卓手机上的应用，还是仅仅为了娱乐，学习编程语言都是一条必经之路。编程语言种类繁多，用途各异，然而一旦掌握其中之一，其他的也就迎刃而解。作为初学者，你可能要先从Java或HTML开始学，一旦掌握了一门编程语言，你就发挥无穷的想象，开发各种神奇的软件啦。 1、确定目标学习编程语言既充满乐趣，又充满挑战。有些花费多年时间学习一门编程语言的大学生到</div> </li> <li><a href="/article/3393.htm" title="架构师之mysql----------------用group+inner join,left join ,right join 查重复数据（替代in)" target="_blank">架构师之mysql----------------用group+inner join,left join ,right join 查重复数据（替代in)</a> <span class="text-muted">nannan408</span> <a class="tag" taget="_blank" href="/search/right+join/1.htm">right join</a> <div>1.前言。如题。 2.代码 (1)单表查重复数据,根据a分组 SELECT m.a,m.b, INNER JOIN （select a,b,COUNT(*) AS rank FROM test.`A` A GROUP BY a HAVING rank>1 )k ON m.a=k.a （2）多表查询，使用改为le</div> </li> <li><a href="/article/3520.htm" title="jQuery选择器小结 VS 节点查找（附css的一些东西）" target="_blank">jQuery选择器小结 VS 节点查找（附css的一些东西）</a> <span class="text-muted">Everyday都不同</span> <a class="tag" taget="_blank" href="/search/jquery/1.htm">jquery</a><a class="tag" taget="_blank" href="/search/css/1.htm">css</a><a class="tag" taget="_blank" href="/search/name%E9%80%89%E6%8B%A9%E5%99%A8/1.htm">name选择器</a><a class="tag" taget="_blank" href="/search/%E8%BF%BD%E5%8A%A0%E5%85%83%E7%B4%A0/1.htm">追加元素</a><a class="tag" taget="_blank" href="/search/%E6%9F%A5%E6%89%BE%E8%8A%82%E7%82%B9/1.htm">查找节点</a> <div>最近做前端页面，频繁用到一些jQuery的选择器，所以特意来总结一下：测试页面： <html> <head> <script src="jquery-1.7.2.min.js"></script> <script> /*$(function() { $(documen</div> </li> <li><a href="/article/3647.htm" title="关于EXT" target="_blank">关于EXT</a> <span class="text-muted">tntxia</span> <a class="tag" taget="_blank" href="/search/ext/1.htm">ext</a> <div> ExtJS是一个很不错的Ajax框架，可以用来开发带有华丽外观的富客户端应用，使得我们的b/s应用更加具有活力及生命力。ExtJS是一个用 javascript编写，与后台技术无关的前端ajax框架。因此，可以把ExtJS用在.Net、Java、Php等各种开发语言开发的应用中。 ExtJs最开始基于YUI技术，由开发人员Jack </div> </li> <li><a href="/article/3774.htm" title="一个MIT计算机博士对数学的思考" target="_blank">一个MIT计算机博士对数学的思考</a> <span class="text-muted">xjnine</span> <a class="tag" taget="_blank" href="/search/Math/1.htm">Math</a> <div> 在过去的一年中，我一直在数学的海洋中游荡，research进展不多，对于数学世界的阅历算是有了一些长进。为什么要深入数学的世界？作为计算机的学生，我没有任何企图要成为一个数学家。我学习数学的目的，是要想爬上巨人的肩膀，希望站在更高的高度，能把我自己研究的东西看得更深广一些。说起来，我在刚来这个学校的时候，并没有预料到我将会有一个深入数学的旅程。我的导师最初希望我去做的题目，是对appe</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.  </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>