* 什么是DOM
DOM 是 Document Object Model（文档对象模型）的缩写， 是中立于平台和语言的接口，它允许程序和脚本动态地访问和更新文档的内容、结构和样式；
DOM 标准被分为 3 个不同的部分：
- 核心 DOM - 针对任何结构化文档的标准模型。
- XML DOM - 针对 XML 文档的标准模型。定义了所有 XML 元素的对象和属性，以及访问它们的方法
- HTML DOM - 针对 HTML 文档的标准模型。 定义了所有 HTML 元素的对象和属性，以及访问它们的方法
这里我们只讲HTML DOM。
* HTML DOM 树
HTML DOM 将 HTML 文档视作树结构。这种结构被称为节点树：
通过 HTML DOM，树中的所有节点均可通过 JavaScript 进行访问。所有 HTML 元素（节点）均可被修改，也可以创建或删除节点.
那么，什么是节点？
在 HTML DOM 中，所有事物都是节点。
- 整个文档就是一个文档节点。
...
- 每个HTML元素是元素节点。
... 或 ... 或 ...
- HTML元素内部的文本是文本节点 / TextNode。
hello world
hello world
- 每个HTML属性是属性节点。
class
- 注释是注释节点。
例子：
你好！，元素节点 ，包含值为 "你好！" 的文本节点。</p>
<h3>* HTML DOM 对象 - 方法和属性</h3>
<blockquote>
<p><strong>方法</strong> 是我们可以在节点上执行的动作（比如添加或修改元素），<strong>属性</strong> 是我们能够获取或设置的值（比如节点的名称或内容）。</p>
</blockquote>
<p><em>常用的 HTML DOM 方法：</em></p>
<ul>
<li> <strong>getElementById(id)</strong> - 获取带有指定 id 的节点（元素） <code>var ele = document.getElementById("eleId");</code> </li>
<li> <strong>appendChild(node)</strong> - 插入新的子节点（元素）<code>ele.appendChild(sub);</code> </li>
<li> <strong>removeChild(node)</strong> - 删除指定的子节点（元素）<code>ele.removeChild(sub);</code> </li>
<li> <strong>insertBefore(node)</strong> - 在指定的子节点前面插入新的子节点（元素）；相对兄弟元素定位</li>
<li> <strong>getAttribute("id")</strong> - 返回指定的属性值 <code>ele.getAttribute("id");</code> </li>
<li> <strong>setAttribute("id")</strong> - 把指定属性设置或修改为指定的值 <code>ele.setAttribute("disabled") = "true";</code> </li>
</ul>
<hr>
<ul>
<li> <strong>getElementsByTagName()</strong> - 返回包含带有指定标签名称的所有元素的节点列表（集合/节点数组）</li>
<li> <strong>getElementsByClassName()</strong> - 返回包含带有指定类名的所有元素的节点列表</li>
<li> <strong>replaceChild()</strong> - 替换子节点</li>
<li> <strong>createAttribute()</strong> - 创建属性节点；为一个元素增加一个属性</li>
<li> <strong>createElement()</strong> - 创建元素节点</li>
<li> <strong>createTextNode()</strong> - 创建文本节点</li>
</ul>
<p><em>常用的HTML DOM属性：</em></p>
<ul>
<li> <strong>innerHTML</strong> - 节点（元素）的文本值 <code>var text = ele.innerHTML</code> </li>
<li> <strong>parentNode</strong> - 节点（元素）的父节点 <code>var eleParent = ele.parentNode</code> 父节点只有一个，没有s</li>
<li> <strong>childNodes</strong> - 节点（元素）的子节点 <code>var eleChild = ele.childNodes</code> 子节点有可能有多个，带s</li>
<li> <strong>attributes</strong> - 节点（元素）的属性节点 <code>var attr - ele.attributes</code> 获取dom属性列表</li>
</ul>
<p><strong>我做了实验，发现非常有意思的信息：</strong><br> <em>html代码</em></p>
<pre><code class="javascript"><div class="box" id="box">
<div class="main" id="main"></div>
<div class="sub" id="sub">nihao</div>
</div>
</code></pre>
<p><em>css代码</em></p>
<pre><code class="css">* {margin: 0px; padding: 0px;}
.box {
width: 300px;
height: 300px;
background-color: #c688e3;
margin: 0 auto;
position: relative;
}
.main {
width: 100px;
height: 100px;
margin: 0 auto;
background: #40cfee;
}
.sub {
width: 100px;
height: 100px;
margin-top: 100px;
position: absolute;
background-color: pink;
}
</code></pre>
<p><em>javascript代码</em></p>
<pre><code class="javascript">var box = document.getElementById("box");
var main = document.getElementById("main");
var sub = document.getElementById("sub");
// main.appendChild(sub);
// main.removeChild(sub);
console.dir(box.childNodes);
// console.dir(sub.attributes);
</code></pre>
<p><em>效果图</em></p>
<div class="image-package">
<div class="image-container" style="max-width: 368px; max-height: 320px;">
<div class="image-view">
<a href="http://img.e-com-net.com/image/info10/ca926e4512e8499192f3715328bcad7e.png" target="_blank"><img src="http://img.e-com-net.com/image/info10/ca926e4512e8499192f3715328bcad7e.png" width="368" height="320" alt="一文学「DOM」 - 含案例展示_第1张图片" style="border:1px solid black;"></a>
</div>
</div>
<div class="image-caption">
原始效果
</div>
</div>
<p><code>main</code>和<code>sub</code>在<code>box</code>包含框中按文档普通流规则正常显示。</p>
<div class="image-package">
<div class="image-container" style="max-width: 368px; max-height: 325px;">
<div class="image-view">
<a href="http://img.e-com-net.com/image/info10/3f918bf0ea9740c7ab8662b35f483b1f.png" target="_blank"><img src="http://img.e-com-net.com/image/info10/3f918bf0ea9740c7ab8662b35f483b1f.png" width="368" height="325" alt="一文学「DOM」 - 含案例展示_第2张图片" style="border:1px solid black;"></a>
</div>
</div>
<div class="image-caption">
main.appendChild(sub)效果
</div>
</div>
<p><code>sub</code>被<code>appendChild</code>到<code>main</code>内部，作为<code>main</code>的子元素而存在。注意，此时<code>sub</code>是在文档普通流中提出来之后加入到<code>main</code>中的，作为<code>main</code>的兄弟节点的sub已经被提走了。</p>
<div class="image-package">
<div class="image-container" style="max-width: 359px; max-height: 321px;">
<div class="image-view">
<a href="http://img.e-com-net.com/image/info10/6943b5bfeb4040eaaffe3bdf1fd722ce.png" target="_blank"><img src="http://img.e-com-net.com/image/info10/6943b5bfeb4040eaaffe3bdf1fd722ce.png" width="359" height="321" alt="一文学「DOM」 - 含案例展示_第3张图片" style="border:1px solid black;"></a>
</div>
</div>
<div class="image-caption">
先appendChild后又removeChild的效果
</div>
</div>
<p>可以看到，<code>sub</code>节点没了，虽然他作为子元素本身存在与在<code>box</code>包含框中，但经过<code>appendChild</code>和<code>removeChild</code>之后，该节点已经被删除。</p>
<div class="image-package">
<div class="image-container" style="max-width: 269px; max-height: 165px;">
<div class="image-view">
<a href="http://img.e-com-net.com/image/info10/bdd15943d01c41fe878bd1908720fecc.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info10/bdd15943d01c41fe878bd1908720fecc.jpg" width="269" height="165" alt="一文学「DOM」 - 含案例展示_第4张图片" style="border:1px solid black;"></a>
</div>
</div>
<div class="image-caption">
原始状态打印box.childNodes
</div>
</div>
<p>惊了，居然<code>length</code>为5！为什么长度为5？细细看来发现，第<code>0/2/4</code>都为<code>text</code>，并且打开看发现值是 <strong>回车键</strong>，明白了吧，原因就是我们在编程时习惯给格式化，对代码进行换行显示，这个换行符其实就是个不可见文本，<code>dom</code>会将其当做子元素了，所以长度为5。所以平时我们在使用的时候一定要注意，并且也可以用这种方式获取文本内容。</p>
<div class="image-package">
<div class="image-container" style="max-width: 271px; max-height: 113px;">
<div class="image-view">
<a href="http://img.e-com-net.com/image/info10/8a1f61849b9a48d48dd8f141753c28b2.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info10/8a1f61849b9a48d48dd8f141753c28b2.jpg" width="271" height="113" alt="一文学「DOM」 - 含案例展示_第5张图片" style="border:1px solid black;"></a>
</div>
</div>
<div class="image-caption">
原始状态打印box.attributes
</div>
</div>
<p>这个没什么问题，就是正常的将属性抓取出来，放到一个数组当中而已。</p>
<h4>innerHtml属性</h4>
<p><code>innerHTML</code> 属性对于获取或替换 HTML 元素的内容(文本节点)<br> <em>html代码</em></p>
<pre><code class="javascript"><html>
<body>
<p id="intro">Hello World!</p>
</body>
</html>
</code></pre>
<p><em>css代码</em></p>
<pre><code class="css">#intro {
display: none;
}
</code></pre>
<p><em>javascript代码</em></p>
<pre><code class="javascript">var txt=document.getElementById("intro").innerHTML;
document.write(txt);
</code></pre>
<p><em>效果展示</em><br> </p>
<div class="image-package">
<div class="image-container" style="max-width: 271px; max-height: 66px;">
<div class="image-view">
<a href="http://img.e-com-net.com/image/info10/6b73322ab83040ca8e282601a5a9e171.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info10/6b73322ab83040ca8e282601a5a9e171.jpg" width="271" height="66"></a>
</div>
</div>
<div class="image-caption">
利用document.write()在页面上打印出文本节点
</div>
</div>
<br> 将javascript代码改一下，如下
<br>
<em>javascript代码</em>
<p></p>
<pre><code class="javascript">document.getElementById("intro").innerHTML = "haha, is me";
var txt=document.getElementById("intro").innerHTML
document.write(txt)
</code></pre>
<p><em>效果展示</em></p>
<div class="image-package">
<div class="image-container" style="max-width: 196px; max-height: 48px;">
<div class="image-view">
<a href="http://img.e-com-net.com/image/info10/3c0fe169da074186b0273023477a92d0.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info10/3c0fe169da074186b0273023477a92d0.jpg" width="196" height="48"></a>
</div>
</div>
<div class="image-caption">
通过innerHTML修改了文本节点
</div>
</div>
<h4>nodeName属性</h4>
<p><code>nodeName</code> 属性规定节点的名称，并且，<code>nodeName</code> 始终包含 HTML 元素的大写字母标签名</p>
<ul>
<li><strong>nodeName 是只读的</strong></li>
<li><strong>元素节点的 nodeName 与标签名相同</strong></li>
<li><strong>属性节点的 nodeName 与属性名相同</strong></li>
<li><strong>文本节点的 nodeName 始终是 #text</strong></li>
<li><strong>文档节点的 nodeName 始终是 #document</strong></li>
</ul>
<h4>nodeValue 属性</h4>
<p><code>nodeValue</code> 属性规定节点的值<br> -<strong>元素节点的 nodeValue 是 undefined 或 null</strong><br> -<strong>文本节点的 nodeValue 是文本本身</strong><br> -<strong>属性节点的 nodeValue 是属性值</strong> <code>document.getElementById("main").nodeValue</code> 输出 null<br> <em>html代码</em></p>
<pre><code class="javascript"><html>
<body>
<p id="intro">Hello World!</p>
</body>
</html>
</code></pre>
<p><em>css代码</em></p>
<pre><code class="css">#intro {
display: none;
}
</code></pre>
<p><em>js代码</em></p>
<pre><code class="javascript">var txt = document.getElementById('intro').nodeValue;
var f = txt == undefined
document.write(f)
</code></pre>
<p><em>效果展示</em></p>
<div class="image-package">
<div class="image-container" style="max-width: 168px; max-height: 51px;">
<div class="image-view">
<a href="http://img.e-com-net.com/image/info10/3fbaad47f4c94027b711dcb8e71ebd58.png" target="_blank"><img src="http://img.e-com-net.com/image/info10/3fbaad47f4c94027b711dcb8e71ebd58.png" width="168" height="51"></a>
</div>
</div>
<div class="image-caption">
页面打印出 true
</div>
</div>
<p><em>页面代码</em></p>
<pre><code class="javascript"><html>
<body>
<p id="intro">Hello World!</p>
<script>
x=document.getElementById("intro");
document.write(x.firstChild.nodeValue);
</script>
</body>
</html>
</code></pre>
<p><em>输出</em></p>
<div class="image-package">
<div class="image-container" style="max-width: 284px; max-height: 101px;">
<div class="image-view">
<a href="http://img.e-com-net.com/image/info10/40fa556c81f747dea1527ef70d832b6a.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info10/40fa556c81f747dea1527ef70d832b6a.jpg" width="284" height="101" alt="一文学「DOM」 - 含案例展示_第6张图片" style="border:1px solid black;"></a>
</div>
</div>
<div class="image-caption">
通过firstChild属性找到第一个子节点，这里是个文本节点
</div>
</div>
<h4>nodeType 属性</h4>
<p>nodeType 属性返回节点的类型，在我们爬数据的时候可能会用到。重要的有以下几种：</p>
<table>
<thead>
<tr>
<th>元素类型</th>
<th style="text-align:center">nodeType</th>
</tr>
</thead>
<tbody>
<tr>
<td>元素</td>
<td style="text-align:center">1</td>
</tr>
<tr>
<td>属性</td>
<td style="text-align:center">2</td>
</tr>
<tr>
<td>文本</td>
<td style="text-align:center">3</td>
</tr>
<tr>
<td>注释</td>
<td style="text-align:center">8</td>
</tr>
<tr>
<td>文档</td>
<td style="text-align:center">9</td>
</tr>
</tbody>
</table>
<h3>* HTML DOM 访问</h3>
<p>访问HTML元素，就是访问HTML 节点，三种方法：</p>
<ul>
<li> <strong>getElementById() 方法</strong> <code>document.getElementById("intro");</code> 返回带有指定 ID 的元素</li>
<li> <strong>getElementsByTagName() 方法</strong> <code>document.getElementsByTagName("p");</code>返回带有指定标签名的<strong>所有</strong>元素</li>
<li> <strong>getElementsByClassName() 方法</strong> <code>document.getElementsByClassName("intro");</code>返回带有相同类名的**所有 **HTML 元素<br> <em>getElementsByClassName() 在 Internet Explorer 5,6,7,8 中无效。</em> </li>
</ul>
<h3>* HTML DOM 修改</h3>
<p>修改 HTML DOM 意味着许多不同的方面</p>
<ul>
<li> <strong>改变 HTML 内容</strong> <code>document.getElementById("p1").innerHTML="New text!";</code>改变一个 <p> 元素的 HTML 内容</li>
<li> <strong>改变 CSS 样式</strong> <code>document.getElementById("p2").style.color="blue";</code>改变一个<p>元素 文字的颜色</li>
<li><strong>改变 HTML 属性</strong></li>
<li> <strong>创建新的 HTML 元素</strong> <code>见下方</code> </li>
<li> <strong>替换已有的 HTML 元素</strong> ```见下方``</li>
<li><strong>删除已有的 HTML 元素</strong></li>
<li> <strong>改变事件（处理程序）</strong> <code>见下方</code> </li>
</ul>
<p><em><strong>创建新的 HTML 元素（1）</strong></em><br> 如需向 HTML DOM 添加新元素，<strong>您首先必须创建该元素（元素节点）</strong>，然后把它追加到已有的元素上。</p>
<p><em>html代码</em></p>
<pre><code class="javascript"><div id="d1">
<p id="p1">This is a paragraph.</p>
<p id="p2">This is another paragraph.</p>
</div>
</code></pre>
<p><em>javascript代码</em></p>
<pre><code class="javascript">var para=document.createElement("p"); // 创建<p>元素节点
var node=document.createTextNode("This is new."); // 给空的<p>元素节点增加文本节点"this is new"
para.appendChild(node); // 生成带有文本子节点的<p>元素节点
var element=document.getElementById("d1");
element.appendChild(para); // 追加<p>元素节点到d1中
</code></pre>
<p><em>页面展示</em></p>
<div class="image-package">
<div class="image-container" style="max-width: 263px; max-height: 107px;">
<div class="image-view">
<a href="http://img.e-com-net.com/image/info10/d6d3e0d5d02b40e39599cd37fa8f95a4.png" target="_blank"><img src="http://img.e-com-net.com/image/info10/d6d3e0d5d02b40e39599cd37fa8f95a4.png" width="263" height="107" alt="一文学「DOM」 - 含案例展示_第7张图片" style="border:1px solid black;"></a>
</div>
</div>
<div class="image-caption">
新的p元素已经被成功插入
</div>
</div>
<p>上面的代码是将新元素添加到最后一个子节点后面的，如果我们不希望如此，也可以用insertBefore() 实现；</p>
<p><em><strong>创建新的 HTML 元素（2）</strong></em><br> 这里涉及到三个元素节点，父元素，新元素和某个兄弟元素。<br> <em>html代码</em></p>
<pre><code class="javascript"><div id="div1">
<p id="p1">This is a paragraph.</p>
<p id="p2">This is another paragraph.</p>
</div>
</code></pre>
<p><em>javascript代码</em></p>
<pre><code class="javascript">var para=document.createElement("p"); // 创建<p>元素节点
var node=document.createTextNode("This is new."); // 给空的<p>元素节点增加文本节点"this is new"
para.appendChild(node); // 生成带有文本子节点的<p>元素节点
var element=document.getElementById("div1"); // 查找父节点的元素节点
var child=document.getElementById("p1"); // 查找插入位置的元素节点
element.insertBefore(para,child); // 将para元素节点插入child元素节点之前
</code></pre>
<p><em><strong>替换 HTML 元素<code>replaceChild()</code></strong></em></p>
<p><em>html代码</em></p>
<pre><code class="javascript"><div id="div1">
<p id="p1">This is a paragraph.</p>
<p id="p2">This is another paragraph.</p>
</div>
</code></pre>
<p><em>javascript代码</em></p>
<pre><code class="javascript">var para=document.createElement("p");
var node=document.createTextNode("This is new.");
para.appendChild(node);
var parent=document.getElementById("div1");
var child=document.getElementById("p1");
parent.replaceChild(para,child); // 使用replaceChild()替换
</code></pre>
<hr>
<p><em><strong>使用事件修改dom元素</strong></em></p>
<p>HTML DOM 允许您在事件发生时执行代码；当 HTML 元素”有事情发生“时，浏览器就会生成事件：</p>
<ul>
<li>在元素上点击</li>
<li>加载页面</li>
<li>改变输入字段</li>
</ul>
<p><em>html代码</em></p>
<pre><code class="javascript"><html>
<body>
<input type="button" onclick="ChangeBackground()" value="Change background color" />
</body>
</html>
</code></pre>
<p><em>js代码</em></p>
<pre><code class="javascript">function ChangeBackground()
{
document.body.style.backgroundColor="lavender";
}
</code></pre>
<p><em>效果展示</em><br> </p>
<div class="image-package">
<div class="image-container" style="max-width: 376px; max-height: 125px;">
<div class="image-view">
<a href="http://img.e-com-net.com/image/info10/b987aafdfd1545ca9f410dc17430b254.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info10/b987aafdfd1545ca9f410dc17430b254.jpg" width="376" height="125" alt="一文学「DOM」 - 含案例展示_第8张图片" style="border:1px solid black;"></a>
</div>
</div>
<div class="image-caption">
点击修改背景颜色
</div>
</div>
<p></p>
<h3>* HTML DOM 事件</h3>
<p>HTML DOM 允许 JavaScript 对 HTML 事件作出反应，当事件发生时，可以执行 JavaScript。<br> HTML 事件的例子：</p>
<ul>
<li> <strong>当用户点击鼠标时</strong> <code>onclick="doIt()"</code>；鼠标按下<code>onmousedown</code>；鼠标弹起<code>onmouseup</code>。首先当某个鼠标按钮被点击时，触发 onmousedown 事件，然后，当鼠标按钮被松开时，会触发 onmouseup 事件，最后，当鼠标点击完成时，触发 onclick 事件</li>
<li> <strong>当网页已加载时</strong> <code>onload="doIt()"</code>；离开网页时使用 <code>onunload="doIt()"</code>；<code>onload</code> 事件可用于检查访客的浏览器类型和版本，以便基于这些信息来加载不同版本的网页。<em><code>onload</code> 和 <code>onunload</code> 事件可用于处理 <code>cookies</code></em> </li>
<li><strong>当图片已加载时</strong></li>
<li> <strong>当鼠标移动到元素上时</strong> <code>onmouseover=”doIt()“</code>；鼠标移开<code>onmouseout=”doIt()“</code> </li>
<li> <strong>当输入字段被改变时</strong> <code>onchange="doIt()"</code> 常用于输入字段的监控，验证。</li>
<li><strong>当 HTML 表单被提交时</strong></li>
<li><strong>当用户触发按键时</strong></li>
</ul>
<p><strong>我们也可以使用 HTML DOM 来分配事件：</strong><br> 该例为 button 元素分配 onclick 事件：<br> <em>javascript代码</em></p>
<pre><code class="javascript">document.getElementById("myBtn").onclick=function(){
displayDate()
};
</code></pre>
<p><strong>用onload来处理cookies</strong><br> <em>html代码</em></p>
<pre><code class="javascript"><html>
<body onload="checkCookies()">
<p>弹出的提示框会告诉你浏览器是否已启用 cookie。</p>
</body>
</html>
</code></pre>
<p><em>javascript代码</em></p>
<pre><code class="javascript">function checkCookies() {
if (navigator.cookieEnabled==true) {
alert("Cookies are enabled")
} else {
alert("Cookies are not enabled")
}
}
</code></pre>
<h3>* HTML DOM - 导航</h3>
<h5>1. HTML DOM 节点列表</h5>
<p><strong>getElementsByTagName() 方法返回节点列表数组</strong><br> 下面的代码选取文档中的所有 <p> 节点：</p>
<pre><code class="javascript">var x=document.getElementsByTagName("p");
</code></pre>
<p>可以通过下标号访问这些节点。如需访问<em>第二个 <p></em>，您可以这么写：</p>
<pre><code class="javascript">var y=x[1]; // 下标从0开始
</code></pre>
<p>length 属性定义节点列表中节点的数量</p>
<pre><code class="javascript">var len = x.length
</code></pre>
<p><em>简单应用：</em> 获取所有 <p> 元素节点，并输出每个 <p> 元素的文本节点的值</p>
<pre><code class="javascript">x=document.getElementsByTagName("p");
for (i=0;i<x.length;i++) {
document.write(x[i].innerHTML);
document.write("<br />");
}
</code></pre>
<h5>2. 导航节点关系</h5>
<p>您能够使用三个节点属性：parentNode、firstChild 以及 lastChild ，在文档结构中进行导航。</p>
<pre><code class="javascript"><html>
<body>
<p>Hello World!</p>
<div>
<p>DOM 很有用!</p>
<p>本例演示节点关系。</p>
</div>
</body>
</html>
</code></pre>
<p>观察上述结构</p>
<ul>
<li>首个 <p> 元素是 <body> 元素的首个子元素（firstChild）<code>firstChild 属性可用于访问元素的文本，前面我们用过</code> </li>
<li><div> 元素是 <body> 元素的最后一个子元素（lastChild）</li>
<li><body> 元素是首个 <p> 元素和 <div> 元素的父节点（parentNode）</li>
</ul>
<h5>3. DOM 根节点</h5>
<p>这里有两个特殊的属性，可以访问全部文档：</p>
<ul>
<li><strong>document.documentElement - 全部文档</strong></li>
<li> <strong>document.body - 文档的主体</strong> <code>页面的<body>部分</code> </li>
</ul>
<p><em>html代码</em></p>
<pre><code class="javascript"><html>
<body>
<p>Hello World!</p>
<div>
<p>DOM 很有用!</p>
<p>本例演示 <b>document.body</b> 属性。</p>
</div>
</body>
</html>
</code></pre>
<p><em>javascript代码</em></p>
<pre><code class="javascript">alert(document.body.innerHTML);
</code></pre>
<p><em>效果展示</em><br> </p>
<div class="image-package">
<div class="image-container" style="max-width: 444px; max-height: 417px;">
<div class="image-view">
<a href="http://img.e-com-net.com/image/info10/cff2199059624856bc1788655e713dda.png" target="_blank"><img src="http://img.e-com-net.com/image/info10/cff2199059624856bc1788655e713dda.png" width="444" height="417" alt="一文学「DOM」 - 含案例展示_第9张图片" style="border:1px solid black;"></a>
</div>
</div>
<div class="image-caption">
alert弹出内容
</div>
</div>
<p></p>
<h5>4. childNodes 和 nodeValue</h5>
<p><em>html代码</em></p>
<pre><code class="javascript"><html>
<body>
<p id="intro">Hello World!</p>
</body>
</html>
</code></pre>
<p><em>javascript代码</em></p>
<pre><code class="javascript">var txt=document.getElementById("intro").childNodes[0].nodeValue;
document.write(txt);
</code></pre>
<p><em>效果展示</em><br> </p>
<div class="image-package">
<div class="image-container" style="max-width: 206px; max-height: 89px;">
<div class="image-view">
<a href="http://img.e-com-net.com/image/info10/e7b15b06becb424096462877962b94e8.png" target="_blank"><img src="http://img.e-com-net.com/image/info10/e7b15b06becb424096462877962b94e8.png" width="206" height="89"></a>
</div>
</div>
<div class="image-caption">
页面本身一个 / document.write一个
</div>
</div>
<p></p>
<h3>* 结束语</h3>
<p>至此，HTML DOM 内容已经结束，如果理解还不够透彻，你可以猛戳这里查看更多DOM实例</p>
</article>
</div>
</div>
</div>
<!--PC和WAP自适应版-->
<div id="SOHUCS" sid="1275886071393042432"></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">你可能感兴趣的:(一文学「DOM」 - 含案例展示)</h4>
<div id="paradigm-article-related">
<div class="recommend-post mb30">
<ul class="widget-links">
<li><a href="/article/1899361855005061120.htm"
title="Restful 接口设计规范" target="_blank">Restful 接口设计规范</a>
<span class="text-muted">yqcoder</span>
<a class="tag" taget="_blank" href="/search/restful/1.htm">restful</a><a class="tag" taget="_blank" href="/search/%E8%AE%BE%E8%AE%A1%E8%A7%84%E8%8C%83/1.htm">设计规范</a><a class="tag" taget="_blank" href="/search/%E5%90%8E%E7%AB%AF/1.htm">后端</a>
<div>一、资源与URL1.使用名词表示资源URL应该以名词为主，用来表示具体的资源，而不是动词。例如，/users表示用户资源集合，/users/{id}表示单个用户资源。2.采用复数形式一般来说，资源的URL应该使用复数形式，这样更符合RESTful的设计理念，也更直观。如/orders而不是/order。3.避免层级过深URL的层级结构不宜过深，尽量保持简洁，以便于理解和使用。例如，/api/v1/</div>
</li>
<li><a href="/article/1899361855600652288.htm"
title="vscode 好用插件" target="_blank">vscode 好用插件</a>
<span class="text-muted">yqcoder</span>
<a class="tag" taget="_blank" href="/search/vscode/1.htm">vscode</a><a class="tag" taget="_blank" href="/search/ide/1.htm">ide</a><a class="tag" taget="_blank" href="/search/%E7%BC%96%E8%BE%91%E5%99%A8/1.htm">编辑器</a>
<div>一、通用效率类1.AutoRenameTag在编写HTML或XML代码时，当你修改一个标签的名称，它会自动同步修改对应的结束标签，节省了手动修改的时间，提高了代码的准确性和编写效率。2.BracketPairColorizer为代码中的括号对（如()、{}、[]）添加不同的颜色，让你可以更清晰地分辨嵌套的括号层次，尤其在处理复杂代码时，能有效减少因括号匹配错误导致的问题。3.CodeRunner支</div>
</li>
<li><a href="/article/1899361635932368896.htm"
title="ITSM流程落地经验之变更管理" target="_blank">ITSM流程落地经验之变更管理</a>
<span class="text-muted"></span>
<a class="tag" taget="_blank" href="/search/%E8%BF%90%E7%BB%B4%E7%BB%8F%E9%AA%8C%E4%BA%91%E8%AE%A1%E7%AE%97%E5%AE%B9%E5%99%A8%E6%9C%8D%E5%8A%A1%E5%99%A8/1.htm">运维经验云计算容器服务器</a>
<div>本文来自腾讯蓝鲸智云社区用户:CanWay大多数组织中都实施了变更管理，但是效果参差不齐，尤其在变更管理的核心环节，部分组织因缺乏有效的把控，使得变更管理的效果不尽人意，甚至可能面临失控的风险。为此，我们有必要深入探讨并详细分析变更管理中的关键活动，并通过实例加以说明。变更模型与适用场景变更模型是对特定变更的可重复管理方法，这种方法为处理一般变更提供指导，解决一般变更无法适应不同的管理模式的问题。</div>
</li>
<li><a href="/article/1899361476049694720.htm"
title="数字IC前端设计究竟怎样？薪资前景如何？" target="_blank">数字IC前端设计究竟怎样？薪资前景如何？</a>
<span class="text-muted">IC观察者</span>
<a class="tag" taget="_blank" href="/search/fpga%E5%BC%80%E5%8F%91/1.htm">fpga开发</a><a class="tag" taget="_blank" href="/search/%E9%9B%86%E6%88%90%E7%94%B5%E8%B7%AF/1.htm">集成电路</a><a class="tag" taget="_blank" href="/search/%E6%A8%A1%E6%8B%9FIC/1.htm">模拟IC</a><a class="tag" taget="_blank" href="/search/%E6%A8%A1%E6%8B%9F%E7%89%88%E5%9B%BE/1.htm">模拟版图</a><a class="tag" taget="_blank" href="/search/%E6%A8%A1%E6%8B%9F%E7%89%88%E5%9B%BE%E5%85%A5%E9%97%A8/1.htm">模拟版图入门</a>
<div>数字ic前端岗位介绍：数字ic前端设计处于数字IC设计流程的前端，属于数字IC设计类岗位的一种。数字ic前端设计主要分成几种层次的设计：IPlevel，unitlevel，fullchip/SoClevel，gatelevel等。作为数字IC前端工程师，为了让写的RTL代码没有bug，会经常与验证工程师要求debugcase；为了了解芯片整体架构和功能属性，还要与架构工程师打交道；还要与后端工程师</div>
</li>
<li><a href="/article/1899361476905332736.htm"
title="鸿蒙ArkUI瀑布流开发实战：WaterFlow组件与LazyForEach高效实现" target="_blank">鸿蒙ArkUI瀑布流开发实战：WaterFlow组件与LazyForEach高效实现</a>
<span class="text-muted">写雨.0</span>
<a class="tag" taget="_blank" href="/search/HarmonyOS/1.htm">HarmonyOS</a><a class="tag" taget="_blank" href="/search/NEXT/1.htm">NEXT</a><a class="tag" taget="_blank" href="/search/harmonyos/1.htm">harmonyos</a><a class="tag" taget="_blank" href="/search/%E5%8D%8E%E4%B8%BA/1.htm">华为</a>
<div>前言瀑布流布局（WaterfallFlow）是购物、资讯类应用的核心交互设计，如何在鸿蒙ArkUI中高效实现多列动态加载与滚动优化？本文将以小红书类似的结构为例，手把手教你使用WaterFlow组件与LazyForEach懒加载技术，解决数据量大时的性能瓶颈，并提供多设备适配方案。一、ArkUI瀑布流核心组件1.WaterFlow组件鸿蒙的WaterFlow组件是瀑布流布局的容器，支持以下关键属性</div>
</li>
<li><a href="/article/1899361381703020544.htm"
title="程序员如何用DeepSeek让代码效率翻倍？这份实战手册请收好" target="_blank">程序员如何用DeepSeek让代码效率翻倍？这份实战手册请收好</a>
<span class="text-muted"></span>
<a class="tag" taget="_blank" href="/search/%E5%90%8E%E7%AB%AF/1.htm">后端</a>
<div>最近公司新来的实习生小张让我眼前一亮，上周他只用三小时就完成了原本需要两天的工作量——优化一个老旧的后端接口。当我翻开他的代码才发现，这个00后小伙子的秘密武器居然是个叫DeepSeek的AI工具。你可能已经注意到，GitHub上越来越多的开源项目开始标注"DeepSeek适配"的字样。这个由中国团队自主研发的大模型，正在悄然改变程序员的工作方式。还记得去年调试分布式系统时的痛苦经历吗？当时我对着</div>
</li>
<li><a href="/article/1899361127486255104.htm"
title="使用Yarn创建Grafana模板的完整指南" target="_blank">使用Yarn创建Grafana模板的完整指南</a>
<span class="text-muted"></span>
<a class="tag" taget="_blank" href="/search/%E4%BA%91%E6%9C%8D%E5%8A%A1%E5%99%A8linux%E8%BF%90%E7%BB%B4yarn/1.htm">云服务器linux运维yarn</a>
<div>在本篇文章中，我将带你逐步完成如何使用Yarn生成Grafana模板的过程。Grafana是一款开源的数据可视化工具，我们可以使用它来创建各种仪表板，以便更好地监控和展示数据。请跟随我一起来完成这一过程。整体流程概览在开始之前，我们先来看看整个操作的流程。以下是步骤的概述，以表格形式展示：步骤描述1安装Node.js和Yarn2创建新的Yarn项目3安装Grafana的API客户端库4编写Graf</div>
</li>
<li><a href="/article/1899361128824238080.htm"
title="如何在Spring Boot中实现数据加密" target="_blank">如何在Spring Boot中实现数据加密</a>
<span class="text-muted"></span>
<a class="tag" taget="_blank" href="/search/%E5%90%8E%E7%AB%AFspringboot/1.htm">后端springboot</a>
<div>如何在SpringBoot中实现数据加密大家好，我是免费搭建查券返利机器人省钱赚佣金就用微赚淘客系统3.0的小编，也是冬天不穿秋裤，天冷也要风度的程序猿！一、数据加密的重要性与应用场景在当今信息安全日益受到重视的背景下，数据加密成为保护敏感信息不被未授权访问的重要手段。SpringBoot作为一种流行的Java开发框架，提供了多种方式来实现数据加密，适用于用户密码、数据库连接、敏感配置等场景。二、</div>
</li>
<li><a href="/article/1899361097505370112.htm"
title="GO语言学习笔记" target="_blank">GO语言学习笔记</a>
<span class="text-muted">螺旋式上升abc</span>
<a class="tag" taget="_blank" href="/search/golang/1.htm">golang</a><a class="tag" taget="_blank" href="/search/%E5%AD%A6%E4%B9%A0/1.htm">学习</a><a class="tag" taget="_blank" href="/search/%E7%AC%94%E8%AE%B0/1.htm">笔记</a>
<div>一、viper笔记【七米】https://liwenzhou.com/posts/Go/viper/二、优雅关机和平滑重启https://liwenzhou.com/posts/Go/graceful-shutdown/三、gin使用zaphttps://liwenzhou.com/posts/Go/zap-in-gin/四、flag用于命令行传参https://liwenzhou.com/pos</div>
</li>
<li><a href="/article/1899361000444981248.htm"
title="非80/443端口验证的IP SSL证书" target="_blank">非80/443端口验证的IP SSL证书</a>
<span class="text-muted"></span>
<a class="tag" taget="_blank" href="/search/https/1.htm">https</a>
<div>DunTrust提供的IP地址证书，除了支持80或者443端口验证外，还支持其他端口验证。对于80或者443端口不能开放的单位来说是个不错的选择IP地址SSL证书，也被称为IPSSL证书，是一种特殊的SSL证书，用于保护IP地址，并在安装后起到加密作用，确保通过该IP地址进行的通信内容的安全性。一．常规IP地址SSL证书市面上常见的证书多为域名SSL证书，一般以域名为申请主题，只有少部分服务商支持</div>
</li>
<li><a href="/article/1899360845343813632.htm"
title="ES6 解构赋值详解" target="_blank">ES6 解构赋值详解</a>
<span class="text-muted">修己xj</span>
<a class="tag" taget="_blank" href="/search/web/1.htm">web</a><a class="tag" taget="_blank" href="/search/es6/1.htm">es6</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/es6/1.htm">es6</a>
<div>ES6是JavaScript语言的一次重大更新，引入了许多新特性和语法改进，其中解构赋值是一个非常实用和灵活的语法特性。它可以让我们从数组或对象中提取值，并赋给对应的变量，让代码变得更加简洁和易读。本文将深入探讨ES6解构赋值的语法、用法及其在实际开发中的应用。数组解构赋值数组解构赋值允许我们通过类似模式匹配的方式，从数组中提取值并赋给变量，即只要等会两边的变量模式相同，左边的变量就会被赋予对应的</div>
</li>
<li><a href="/article/1899360746203049984.htm"
title="设计一个优秀 API 的秘诀" target="_blank">设计一个优秀 API 的秘诀</a>
<span class="text-muted"></span>
<div>设计一个优秀API的秘诀本指南深入探讨了顶级API设计，强调了它不仅仅是代码的集合。一个设计良好的API就像五星级礼宾服务，能够顺畅地引导用户达到他们的预期目标。拿起一杯咖啡，让我们一起探索创建一个功能强大、用户友好的API的秘诀吧！理解API基础第一步：拥抱REST-API设计的基础优秀API构建的基石是REST。RESTfulAPI使用HTTP方法（GET、POST、PUT、DELETE），与</div>
</li>
<li><a href="/article/1899360719070097408.htm"
title="Qt程序闪退如何查原因呢，闪退点不是自己应用代码" target="_blank">Qt程序闪退如何查原因呢，闪退点不是自己应用代码</a>
<span class="text-muted">bug菌¹</span>
<a class="tag" taget="_blank" href="/search/%23/1.htm">#</a><a class="tag" taget="_blank" href="/search/CSDN%E9%97%AE%E7%AD%94%E8%A7%A3%E6%83%91%28%E5%85%A8%E6%A0%88%E7%89%88%29/1.htm">CSDN问答解惑(全栈版)</a><a class="tag" taget="_blank" href="/search/%E5%85%A8%E6%A0%88Bug%E8%B0%83%E4%BC%98%28%E5%AE%9E%E6%88%98%E7%89%88%29/1.htm">全栈Bug调优(实战版)</a><a class="tag" taget="_blank" href="/search/qt/1.htm">qt</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/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a><a class="tag" taget="_blank" href="/search/c%2B%2B/1.htm">c++</a>
<div>本文收录于《CSDN问答解惑-专业版》专栏，主要记录项目实战过程中的Bug之前因后果及提供真实有效的解决方案，希望能够助你一臂之力，帮你早日登顶实现财富自由；同时，欢迎大家关注&&收藏&&订阅！持续更新中，up！up！up！！问题描述 Qt程序闪退如何查原因呢，闪退点不是自己应用代码如图，因为是qt底层，这种闪退该怎么查原因和避免呢，现在遇到很多这种底层报错又没办法查代码如上问题有来自我自身项目</div>
</li>
<li><a href="/article/1899360717161689088.htm"
title="tauri + vue3 如何实现在一个页面上局部加载外部网页？" target="_blank">tauri + vue3 如何实现在一个页面上局部加载外部网页？</a>
<span class="text-muted">bug菌¹</span>
<a class="tag" taget="_blank" href="/search/%E5%85%A8%E6%A0%88Bug%E8%B0%83%E4%BC%98%28%E5%AE%9E%E6%88%98%E7%89%88%29/1.htm">全栈Bug调优(实战版)</a><a class="tag" taget="_blank" href="/search/%23/1.htm">#</a><a class="tag" taget="_blank" href="/search/CSDN%E9%97%AE%E7%AD%94%E8%A7%A3%E6%83%91%28%E5%85%A8%E6%A0%88%E7%89%88%29/1.htm">CSDN问答解惑(全栈版)</a><a class="tag" taget="_blank" href="/search/tauri/1.htm">tauri</a><a class="tag" taget="_blank" href="/search/vue3/1.htm">vue3</a>
<div>本文收录于「Bug调优」专栏，主要记录项目实战过程中的Bug之前因后果及提供真实有效的解决方案，希望能够助你一臂之力，帮你早日登顶实现财富自由；同时，欢迎大家关注&&收藏&&订阅！持续更新中，up！up！up！！问题描述 tauriv1（1.6左右）+vue3我想在vue3前端页面上在一个页面而不是window.open打开一个新的窗口去加载外部网页我想在一个页面中局部中间加载一个外部网页（试过</div>
</li>
<li><a href="/article/1899360493236187136.htm"
title="《Quick Start Kubernetes》读后感" target="_blank">《Quick Start Kubernetes》读后感</a>
<span class="text-muted"></span>
<a class="tag" taget="_blank" href="/search/python/1.htm">python</a>
<div>一、为什么选择这本书？面试的时候经常被问到kubernetes(下称k8s)，所以打算学习k8s。看到《QuickStartKubernetes》的作者对自己所写的书持续地更新，被这种认真打动了，外加这本书只有100多页，所以选择了这本书作为入门k8s的教材。二、这本书写了什么？这本书介绍了什么是k8s,k8s的组成结构(controlplanenode,workernode)，演示了在Windo</div>
</li>
<li><a href="/article/1899360212922462208.htm"
title="职场中的压力管理有哪些有效方法？" target="_blank">职场中的压力管理有哪些有效方法？</a>
<span class="text-muted">weixin_42220130</span>
<a class="tag" taget="_blank" href="/search/%E7%94%9F%E6%B4%BB/1.htm">生活</a><a class="tag" taget="_blank" href="/search/%E8%81%8C%E5%9C%BA/1.htm">职场</a><a class="tag" taget="_blank" href="/search/%E5%8E%8B%E5%8A%9B/1.htm">压力</a><a class="tag" taget="_blank" href="/search/%E7%AE%A1%E7%90%86/1.htm">管理</a><a class="tag" taget="_blank" href="/search/%E6%96%B9%E6%B3%95/1.htm">方法</a><a class="tag" taget="_blank" href="/search/%E6%9C%89%E6%95%88/1.htm">有效</a>
<div>有制订计划表、坚决不做全优生、不可或缺的一日三餐、放弃无意义的固执、勇于做个挑战者、通过沟通释放压力、尝试打破现状、劳逸结合的生活状态等方法。制订计划表[2]当个人有一个完美的计划表，并且正在逐步实施时，就不会产生无谓的压力。因为，一切尽在掌握之中。计划表是一个很好的监督者，叮嘱你每一个目标的实现，又是一个软性的压力，只有跳起来才能够得着。当你心里有底时，也就没有了压力。坚决不做全优生[2]许多白</div>
</li>
<li><a href="/article/1899359709018779648.htm"
title="有趣的学习Python-第十篇：Python的“魔法宝库”：标准库之旅" target="_blank">有趣的学习Python-第十篇：Python的“魔法宝库”：标准库之旅</a>
<span class="text-muted">王盼达</span>
<a class="tag" taget="_blank" href="/search/%E6%9C%89%E8%B6%A3%E7%9A%84%E5%AD%A6%E4%B9%A0Python/1.htm">有趣的学习Python</a><a class="tag" taget="_blank" href="/search/%E5%AD%A6%E4%B9%A0/1.htm">学习</a><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>Python不仅是一门强大的编程语言，更像是一座充满宝藏的“魔法宝库”，里面装满了各种各样的“魔法工具”（标准库）。这些“魔法工具”可以帮助你轻松地完成各种任务，从文件操作到网络编程，从数据处理到性能优化。接下来，让我们一起探索Python的“魔法宝库”，看看这些“魔法工具”到底有多神奇！10.1操作系统接口：与“魔法世界”互动os模块就像是一个“魔法接口”，可以帮助你与操作系统进行互动。你可以用</div>
</li>
<li><a href="/article/1899359582615040000.htm"
title="有趣的学习Python-第八篇：Python的“魔法盾牌”：错误与异常处理" target="_blank">有趣的学习Python-第八篇：Python的“魔法盾牌”：错误与异常处理</a>
<span class="text-muted">王盼达</span>
<a class="tag" taget="_blank" href="/search/%E6%9C%89%E8%B6%A3%E7%9A%84%E5%AD%A6%E4%B9%A0Python/1.htm">有趣的学习Python</a><a class="tag" taget="_blank" href="/search/%E5%AD%A6%E4%B9%A0/1.htm">学习</a><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>在Python的魔法世界里，即使是经验丰富的魔法师也可能遇到一些“魔法失误”。这些失误分为两种：语法错误和异常。别担心，Python为你准备了一面强大的“魔法盾牌”，帮助你应对这些挑战。8.1语法错误：魔法咒语写错了语法错误就像是你在念魔法咒语时，不小心说错了单词。这是学习Python过程中最常见的问题。比如，你可能忘记在while循环后面加上冒号：whileTrueprint('Hellowor</div>
</li>
<li><a href="/article/1899359456119025664.htm"
title="java vscode跳转类定义_快速使用 vscode 进行 Java 编程" target="_blank">java vscode跳转类定义_快速使用 vscode 进行 Java 编程</a>
<span class="text-muted">weixin_39894932</span>
<a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/vscode%E8%B7%B3%E8%BD%AC%E7%B1%BB%E5%AE%9A%E4%B9%89/1.htm">vscode跳转类定义</a>
<div>任何一个程序员都有自己喜爱的编辑器、工具、开发利器，有这样一群人，对于vim这种上古神器难以驾驭、IDE又太笨重，这时候多了一个选择vscode！！！vscode重新定义了编辑器，它开源、免费、Runseverywhere，是一款介于IDE和编辑器之间的产物，我们不能用IDE的所有特性都往它身上压，如果都可以的话不就是IDE吗？不就是吗？所以用起来的感觉你懂的，美滋滋(๑•̀ㅂ•́)✧那么这家伙都</div>
</li>
<li><a href="/article/1899359203869388800.htm"
title="PHP的架构设计" target="_blank">PHP的架构设计</a>
<span class="text-muted">weixin_34294649</span>
<a class="tag" taget="_blank" href="/search/php/1.htm">php</a>
<div>首先，大概陈述一下架构的关联，如下所述：首先会先设计标准DALclass(STDAL)，放置getData,delete,update等标准常见的功能函数在来设计程式会用到的各种DAL，基本上每一个Table都需要有一个DAL来实现，后面根据table应用、画面呈现等需求，也可以一个table有多个DAL，这各观念类似View的概念。根据商业逻辑的操作，制作对应的BLL，像是insert、upda</div>
</li>
<li><a href="/article/1899357944596721664.htm"
title="深度解析：DETR的多尺度特征融合" target="_blank">深度解析：DETR的多尺度特征融合</a>
<span class="text-muted">AI天才研究院</span>
<a class="tag" taget="_blank" href="/search/AI%E5%A4%A7%E6%A8%A1%E5%9E%8B%E4%BC%81%E4%B8%9A%E7%BA%A7%E5%BA%94%E7%94%A8%E5%BC%80%E5%8F%91%E5%AE%9E%E6%88%98/1.htm">AI大模型企业级应用开发实战</a><a class="tag" taget="_blank" href="/search/DeepSeek/1.htm">DeepSeek</a><a class="tag" taget="_blank" href="/search/R1/1.htm">R1</a><a class="tag" taget="_blank" href="/search/%26amp%3B/1.htm">&</a><a class="tag" taget="_blank" href="/search/%E5%A4%A7%E6%95%B0%E6%8D%AEAI%E4%BA%BA%E5%B7%A5%E6%99%BA%E8%83%BD%E5%A4%A7%E6%A8%A1%E5%9E%8B/1.htm">大数据AI人工智能大模型</a><a class="tag" taget="_blank" href="/search/%E8%AE%A1%E7%AE%97%E7%A7%91%E5%AD%A6/1.htm">计算科学</a><a class="tag" taget="_blank" href="/search/%E7%A5%9E%E7%BB%8F%E8%AE%A1%E7%AE%97/1.htm">神经计算</a><a class="tag" taget="_blank" href="/search/%E6%B7%B1%E5%BA%A6%E5%AD%A6%E4%B9%A0/1.htm">深度学习</a><a class="tag" taget="_blank" href="/search/%E7%A5%9E%E7%BB%8F%E7%BD%91%E7%BB%9C/1.htm">神经网络</a><a class="tag" taget="_blank" href="/search/%E5%A4%A7%E6%95%B0%E6%8D%AE/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><a class="tag" taget="_blank" href="/search/%E5%A4%A7%E5%9E%8B%E8%AF%AD%E8%A8%80%E6%A8%A1%E5%9E%8B/1.htm">大型语言模型</a><a class="tag" taget="_blank" href="/search/AI/1.htm">AI</a><a class="tag" taget="_blank" href="/search/AGI/1.htm">AGI</a><a class="tag" taget="_blank" href="/search/LLM/1.htm">LLM</a><a class="tag" taget="_blank" href="/search/Java/1.htm">Java</a><a class="tag" taget="_blank" href="/search/Python/1.htm">Python</a><a class="tag" taget="_blank" href="/search/%E6%9E%B6%E6%9E%84%E8%AE%BE%E8%AE%A1/1.htm">架构设计</a><a class="tag" taget="_blank" href="/search/Agent/1.htm">Agent</a><a class="tag" taget="_blank" href="/search/RPA/1.htm">RPA</a>
<div>"深度解析：DETR的多尺度特征融合"作者：禅与计算机程序设计艺术1.背景介绍1.1目标检测的挑战与传统方法的局限性目标检测是计算机视觉领域中的一个基本任务，其目标是识别图像或视频中所有感兴趣的目标，并确定它们的位置和类别。传统的目标检测方法，如FasterR-CNN和YOLO，通常依赖于预定义的锚框或候选区域来生成目标proposals。然而，这些方法存在一些固有的局限性：人工先验知识:锚框的设</div>
</li>
<li><a href="/article/1899357692355473408.htm"
title="浏览器自动复制插件-速记超人记事本V1.0" target="_blank">浏览器自动复制插件-速记超人记事本V1.0</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>有这么一个需求，就是经常要复制某些网站的资料存到word、txt、或者excel中反复切换浏览器比较麻烦，思索再三，开发了一个浏览器插件取名为“速记超人记事本”功能如下：当我复制网页内容的时候会自动存储到浏览器插件中，如图：记录的内容自动存储到插件中，可以删除，编辑搜索，也可以导出为excel,txt格式这样我们就可以直接愉快的ctrl+c了，待我复制完成后，一键导出就可以了之前做了个1.0版本，</div>
</li>
<li><a href="/article/1899356936701276160.htm"
title="1.0 双指针专题：双指针思想" target="_blank">1.0 双指针专题：双指针思想</a>
<span class="text-muted">熊峰峰</span>
<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/c%2B%2B/1.htm">c++</a><a class="tag" taget="_blank" href="/search/%E7%AE%97%E6%B3%95/1.htm">算法</a>
<div>常⻅的双指针有两种形式，⼀种是对撞指针，⼀种是左右指针。一、对撞指针对撞指针：⼀般⽤于顺序结构中，也称左右指针。对撞指针从两端向中间移动。⼀个指针从最左端开始，另⼀个从最右端开始，然后逐渐往中间逼近。对撞指针的终⽌条件⼀般是两个指针相遇或者错开（也可能在循环内部找到结果直接跳出循环），也就是：left==right（两个指针指向同⼀个位置）left>right（两个指针错开）二、快慢指针快慢指针：</div>
</li>
<li><a href="/article/1899356684506165248.htm"
title="ES6之解构" target="_blank">ES6之解构</a>
<span class="text-muted">Hopebearer_</span>
<a class="tag" taget="_blank" href="/search/ES6/1.htm">ES6</a><a class="tag" taget="_blank" href="/search/es6/1.htm">es6</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/%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>文章目录ES6之解构一、数组解构1.基本解构2.部分解构3.默认值4.剩余参数5.嵌套解构6.交换变量二、对象解构1.基本解构2.重命名3.默认值4.剩余参数三、函数参数结构1.数组参数解构2.对象参数解构3.默认值四、注意事项1.解构顺序2.undefined情况3.剩余元素4.对象的方法解构ES6之解构解构是JavaScript（ES6及以后版本）中一种非常强大的语法特性，它允许我们按照一定模</div>
</li>
<li><a href="/article/1899356558266003456.htm"
title="基于transformer实现机器翻译(日译中)" target="_blank">基于transformer实现机器翻译(日译中)</a>
<span class="text-muted">小白_laughter</span>
<a class="tag" taget="_blank" href="/search/%E8%AF%BE%E7%A8%8B%E5%AD%A6%E4%B9%A0/1.htm">课程学习</a><a class="tag" taget="_blank" href="/search/transformer/1.htm">transformer</a><a class="tag" taget="_blank" href="/search/%E6%9C%BA%E5%99%A8%E7%BF%BB%E8%AF%91/1.htm">机器翻译</a><a class="tag" taget="_blank" href="/search/%E6%B7%B1%E5%BA%A6%E5%AD%A6%E4%B9%A0/1.htm">深度学习</a>
<div>文章目录一、引言二、使用编码器—解码器和注意力机制来实现机器翻译模型2.0含注意力机制的编码器—解码器2.1读取和预处理数据2.2含注意力机制的编码器—解码器2.3训练模型2.4预测不定长的序列2.5评价翻译结果三、使用Transformer架构和PyTorch深度学习库来实现的日中机器翻译模型3.1、导入必要的库3.2、数据集准备3.3、准备分词器3.4、构建TorchText词汇表对象，并将句</div>
</li>
<li><a href="/article/1899356180107554816.htm"
title="Java的定时器Timer和TimerTask使用全解析" target="_blank">Java的定时器Timer和TimerTask使用全解析</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/java/1.htm">java</a><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>在Java编程中，定时任务是一个常见的需求。无论是定期执行某些操作，还是在特定时间点执行任务，Java提供的Timer和TimerTask类就可以帮助我们轻松实现这些功能。今天将详细介绍如何使用这两个类，包括任务的执行和暂停。理解Timer和TimerTaskTimer是一个可以安排任务在指定的时间或周期性地执行的类。TimerTask是一个抽象类，表示要被定时执行的任务。使用Timer时，我们需</div>
</li>
<li><a href="/article/1899355046076805120.htm"
title="QOpenGLShaderProgram 对象" target="_blank">QOpenGLShaderProgram 对象</a>
<span class="text-muted">阳光开朗_大男孩儿</span>
<a class="tag" taget="_blank" href="/search/OpenGL/1.htm">OpenGL</a><a class="tag" taget="_blank" href="/search/c%2B%2B/1.htm">c++</a><a class="tag" taget="_blank" href="/search/OpenGL/1.htm">OpenGL</a>
<div>本篇文章是基于完整例子和调用关系qtOpenGL-CSDN博客补充疑惑说明，但单独观看也不影响理解。shaderProgram是一个QOpenGLShaderProgram对象，负责管理和使用OpenGL着色器程序。在OpenGL中，着色器是用来在图形渲染流水线中处理顶点和像素的程序，它们定义了如何绘制每个顶点和每个像素的颜色。具体来说，shaderProgram在这个代码中做的事情包括：1.加载</div>
</li>
<li><a href="/article/1899355046521401344.htm"
title="OpenGL疑惑" target="_blank">OpenGL疑惑</a>
<span class="text-muted">阳光开朗_大男孩儿</span>
<a class="tag" taget="_blank" href="/search/OpenGL/1.htm">OpenGL</a><a class="tag" taget="_blank" href="/search/%E7%AE%97%E6%B3%95/1.htm">算法</a><a class="tag" taget="_blank" href="/search/c%2B%2B/1.htm">c++</a><a class="tag" taget="_blank" href="/search/qt/1.htm">qt</a><a class="tag" taget="_blank" href="/search/OpenGL/1.htm">OpenGL</a>
<div>本篇文章基于完整例子和调用关系qtOpenGL-CSDN博客进行的疑惑补充，建议先观看例子，在看此篇。1.为什么glBindVertexArray解绑和绑定是一样的？glBindVertexArray是用来绑定和解绑顶点数组对象（VAO）的。绑定VAO的目的是告诉OpenGL在当前上下文中使用哪个VAO，它会保存和管理与该VAO相关的顶点缓冲区对象（VBO）和其他状态。绑定VAO（glBindVe</div>
</li>
<li><a href="/article/1899354667431817216.htm"
title="Ant design vue中的a-select在动态给option赋值之后，placeholder失效" target="_blank">Ant design vue中的a-select在动态给option赋值之后，placeholder失效</a>
<span class="text-muted">丑小鸭变黑天鹅</span>
<a class="tag" taget="_blank" href="/search/Vue%E6%97%A5%E5%B8%B8%E6%80%BB%E7%BB%93/1.htm">Vue日常总结</a><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/ecmascript/1.htm">ecmascript</a>
<div>Antdesignvue中的a-select在动态给option赋值之后，placeholder失效一、问题描述二、解决办法1、方法一（不推荐）2、方法二一、问题描述最近做一个项目，用到了a-select，placeholder出现了问题先看一下不起作用的代码<a-select-optionv-for="iteminallCollege":key</div>
</li>
<li><a href="/article/1899352904133832704.htm"
title="关于uni-app发布手机APP上架各应用商城，隐私政策书写方案说明" target="_blank">关于uni-app发布手机APP上架各应用商城，隐私政策书写方案说明</a>
<span class="text-muted">Otaku love travel</span>
<a class="tag" taget="_blank" href="/search/uni-app/1.htm">uni-app</a><a class="tag" taget="_blank" href="/search/%E5%BA%94%E7%94%A8%E5%8F%91%E5%B8%83/1.htm">应用发布</a><a class="tag" taget="_blank" href="/search/%E6%94%BF%E7%AD%96%E8%AF%B4%E6%98%8E/1.htm">政策说明</a><a class="tag" taget="_blank" href="/search/uni-app/1.htm">uni-app</a><a class="tag" taget="_blank" href="/search/%E5%BA%94%E7%94%A8%E5%8F%91%E5%B8%83/1.htm">应用发布</a><a class="tag" taget="_blank" href="/search/%E9%9A%90%E7%A7%81%E6%94%BF%E7%AD%96/1.htm">隐私政策</a>
<div>uni-app应用隐私政策书写与上架方案说明一、前言随着移动互联网监管日趋严格，隐私政策已成为APP上架应用商城的核心合规文件。隐私政策不仅体现开发者对用户数据的尊重，更是满足《个人信息保护法》《网络安全法》《数据安全法》等法规的法律义务。核心目标：清晰告知用户数据收集与使用规则，建立用户信任。适用对象：所有通过uni-app开发并计划上架主流应用商城（如苹果AppStore、华为应用市场、小米应</div>
</li>
<li><a href="/article/101.htm"
title="数据采集高并发的架构应用" target="_blank">数据采集高并发的架构应用</a>
<span class="text-muted">3golden</span>
<a class="tag" taget="_blank" href="/search/.net/1.htm">.net</a>
<div>问题的出发点：
最近公司为了发展需要，要扩大对用户的信息采集，每个用户的采集量估计约2W。如果用户量增加的话，将会大量照成采集量成3W倍的增长，但是又要满足日常业务需要，特别是指令要及时得到响应的频率次数远大于预期。
&n</div>
</li>
<li><a href="/article/228.htm"
title="不停止 MySQL 服务增加从库的两种方式" target="_blank">不停止 MySQL 服务增加从库的两种方式</a>
<span class="text-muted">brotherlamp</span>
<a class="tag" taget="_blank" href="/search/linux/1.htm">linux</a><a class="tag" taget="_blank" href="/search/linux%E8%A7%86%E9%A2%91/1.htm">linux视频</a><a class="tag" taget="_blank" href="/search/linux%E8%B5%84%E6%96%99/1.htm">linux资料</a><a class="tag" taget="_blank" href="/search/linux%E6%95%99%E7%A8%8B/1.htm">linux教程</a><a class="tag" taget="_blank" href="/search/linux%E8%87%AA%E5%AD%A6/1.htm">linux自学</a>
<div>现在生产环境MySQL数据库是一主一从，由于业务量访问不断增大，故再增加一台从库。前提是不能影响线上业务使用，也就是说不能重启MySQL服务，为了避免出现其他情况，选择在网站访问量低峰期时间段操作。
一般在线增加从库有两种方式，一种是通过mysqldump备份主库，恢复到从库，mysqldump是逻辑备份，数据量大时，备份速度会很慢，锁表的时间也会很长。另一种是通过xtrabacku</div>
</li>
<li><a href="/article/355.htm"
title="Quartz——SimpleTrigger触发器" target="_blank">Quartz——SimpleTrigger触发器</a>
<span class="text-muted">eksliang</span>
<a class="tag" taget="_blank" href="/search/SimpleTrigger/1.htm">SimpleTrigger</a><a class="tag" taget="_blank" href="/search/TriggerUtils/1.htm">TriggerUtils</a><a class="tag" taget="_blank" href="/search/quartz/1.htm">quartz</a>
<div>转载请出自出处：http://eksliang.iteye.com/blog/2208166 一.概述
SimpleTrigger触发器，当且仅需触发一次或者以固定时间间隔周期触发执行；
二.SimpleTrigger的构造函数
SimpleTrigger(String name, String group)：通过该构造函数指定Trigger所属组和名称；
Simpl</div>
</li>
<li><a href="/article/482.htm"
title="Informatica应用（1）" target="_blank">Informatica应用（1）</a>
<span class="text-muted">18289753290</span>
<a class="tag" taget="_blank" href="/search/sql/1.htm">sql</a><a class="tag" taget="_blank" href="/search/workflow/1.htm">workflow</a><a class="tag" taget="_blank" href="/search/lookup/1.htm">lookup</a><a class="tag" taget="_blank" href="/search/%E7%BB%84%E4%BB%B6/1.htm">组件</a><a class="tag" taget="_blank" href="/search/Informatica/1.htm">Informatica</a>
<div>1.如果要在workflow中调用shell脚本有一个command组件，在里面设置shell的路径；调度wf可以右键出现schedule，现在用的是HP的tidal调度wf的执行。
2.designer里面的router类似于SSIS中的broadcast（多播组件）;Reset_Workflow_Var：参数重置 （比如说我这个参数初始是1在workflow跑得过程中变成了3我要在结束时还要</div>
</li>
<li><a href="/article/609.htm"
title="python 获取图片验证码中文字" target="_blank">python 获取图片验证码中文字</a>
<span class="text-muted">酷的飞上天空</span>
<a class="tag" taget="_blank" href="/search/python/1.htm">python</a>
<div>根据现成的开源项目 http://code.google.com/p/pytesser/改写
在window上用easy_install安装不上 看了下源码发现代码很少 于是就想自己改写一下
添加支持网络图片的直接解析
#coding:utf-8
#import sys
#reload(sys)
#sys.s</div>
</li>
<li><a href="/article/736.htm"
title="AJAX" target="_blank">AJAX</a>
<span class="text-muted">永夜-极光</span>
<a class="tag" taget="_blank" href="/search/Ajax/1.htm">Ajax</a>
<div>1.AJAX功能:动态更新页面,减少流量消耗,减轻服务器负担
2.代码结构:
<html>
<head>
<script type="text/javascript">
function loadXMLDoc()
{
.... AJAX script goes here ...
</div>
</li>
<li><a href="/article/863.htm"
title="创业OR读研" target="_blank">创业OR读研</a>
<span class="text-muted">随便小屋</span>
<a class="tag" taget="_blank" href="/search/%E5%88%9B%E4%B8%9A/1.htm">创业</a>
<div> 现在研一，有种想创业的想法，不知道该不该去实施。因为对于的我情况这两者是矛盾的，可能就是鱼与熊掌不能兼得。
研一的生活刚刚过去两个月，我们学校主要的是</div>
</li>
<li><a href="/article/990.htm"
title="需求做得好与坏直接关系着程序员生活质量" target="_blank">需求做得好与坏直接关系着程序员生活质量</a>
<span class="text-muted">aijuans</span>
<a class="tag" taget="_blank" href="/search/IT+%E7%94%9F%E6%B4%BB/1.htm">IT 生活</a>
<div>
这个故事还得从去年换工作的事情说起，由于自己不太喜欢第一家公司的环境我选择了换一份工作。去年九月份我入职现在的这家公司，专门从事金融业内软件的开发。十一月份我们整个项目组前往北京做现场开发，从此苦逼的日子开始了。
系统背景：五月份就有同事前往甲方了解需求一直到6月份，后续几个月也完</div>
</li>
<li><a href="/article/1117.htm"
title="如何定义和区分高级软件开发工程师" target="_blank">如何定义和区分高级软件开发工程师</a>
<span class="text-muted">aoyouzi</span>
<div>在软件开发领域，高级开发工程师通常是指那些编写代码超过 3 年的人。这些人可能会被放到领导的位置，但经常会产生非常糟糕的结果。Matt Briggs 是一名高级开发工程师兼 Scrum 管理员。他认为，单纯使用年限来划分开发人员存在问题，两个同样具有 10 年开发经验的开发人员可能大不相同。近日，他发表了一篇博文，根据开发者所能发挥的作用划分软件开发工程师的成长阶段。
初</div>
</li>
<li><a href="/article/1244.htm"
title="Servlet的请求与响应" target="_blank">Servlet的请求与响应</a>
<span class="text-muted">百合不是茶</span>
<a class="tag" taget="_blank" href="/search/servlet/1.htm">servlet</a><a class="tag" taget="_blank" href="/search/get%E6%8F%90%E4%BA%A4/1.htm">get提交</a><a class="tag" taget="_blank" href="/search/java%E5%A4%84%E7%90%86post%E6%8F%90%E4%BA%A4/1.htm">java处理post提交</a>
<div>
Servlet是tomcat中的一个重要组成,也是负责客户端和服务端的中介
1,Http的请求方式(get ,post);
客户端的请求一般都会都是Servlet来接受的,在接收之前怎么来确定是那种方式提交的,以及如何反馈,Servlet中有相应的方法, http的get方式 servlet就是都doGet(</div>
</li>
<li><a href="/article/1371.htm"
title="web.xml配置详解之listener" target="_blank">web.xml配置详解之listener</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/web.xml/1.htm">web.xml</a><a class="tag" taget="_blank" href="/search/listener/1.htm">listener</a>
<div>一.定义
<listener>
<listen-class>com.myapp.MyListener</listen-class>
</listener>
二.作用 该元素用来注册一个监听器类。可以收到事件什么时候发生以及用什么作为响</div>
</li>
<li><a href="/article/1498.htm"
title="Web页面性能优化（yahoo技术）" target="_blank">Web页面性能优化（yahoo技术）</a>
<span class="text-muted">Bill_chen</span>
<a class="tag" taget="_blank" href="/search/JavaScript/1.htm">JavaScript</a><a class="tag" taget="_blank" href="/search/Ajax/1.htm">Ajax</a><a class="tag" taget="_blank" href="/search/Web/1.htm">Web</a><a class="tag" taget="_blank" href="/search/css/1.htm">css</a><a class="tag" taget="_blank" href="/search/Yahoo/1.htm">Yahoo</a>
<div>1.尽可能的减少HTTP请求数 content
2.使用CDN server
3.添加Expires头(或者 Cache-control) server
4.Gzip 组件 server
5.把CSS样式放在页面的上方。 css
6.将脚本放在底部(包括内联的) javascript
7.避免在CSS中使用Expressions css
8.将javascript和css独立成外部文</div>
</li>
<li><a href="/article/1625.htm"
title="【MongoDB学习笔记八】MongoDB游标、分页查询、查询结果排序" target="_blank">【MongoDB学习笔记八】MongoDB游标、分页查询、查询结果排序</a>
<span class="text-muted">bit1129</span>
<a class="tag" taget="_blank" href="/search/mongodb/1.htm">mongodb</a>
<div>游标
游标，简单的说就是一个查询结果的指针。游标作为数据库的一个对象，使用它是包括
声明
打开
循环抓去一定数目的文档直到结果集中的所有文档已经抓取完
关闭游标
游标的基本用法，类似于JDBC的ResultSet(hasNext判断是否抓去完,next移动游标到下一条文档)，在获取一个文档集时，可以提供一个类似JDBC的FetchSize</div>
</li>
<li><a href="/article/1752.htm"
title="ORA-12514 TNS 监听程序当前无法识别连接描述符中请求服务 的解决方法" target="_blank">ORA-12514 TNS 监听程序当前无法识别连接描述符中请求服务 的解决方法</a>
<span class="text-muted">白糖_</span>
<a class="tag" taget="_blank" href="/search/ORA-12514/1.htm">ORA-12514</a>
<div> 今天通过Oracle SQL*Plus连接远端服务器的时候提示“监听程序当前无法识别连接描述符中请求服务”，遂在网上找到了解决方案：
①打开Oracle服务器安装目录\NETWORK\ADMIN\listener.ora文件，你会看到如下信息：
# listener.ora Network Configuration File: D:\database\Oracle\net</div>
</li>
<li><a href="/article/1879.htm"
title="Eclipse 问题 A resource exists with a different case" target="_blank">Eclipse 问题 A resource exists with a different case</a>
<span class="text-muted">bozch</span>
<a class="tag" taget="_blank" href="/search/eclipse/1.htm">eclipse</a>
<div>在使用Eclipse进行开发的时候，出现了如下的问题：
Description Resource Path Location TypeThe project was not built due to "A resource exists with a different case: '/SeenTaoImp_zhV2/bin/seentao'.&</div>
</li>
<li><a href="/article/2006.htm"
title="编程之美-小飞的电梯调度算法" target="_blank">编程之美-小飞的电梯调度算法</a>
<span class="text-muted">bylijinnan</span>
<a class="tag" taget="_blank" href="/search/%E7%BC%96%E7%A8%8B%E4%B9%8B%E7%BE%8E/1.htm">编程之美</a>
<div>
public class AptElevator {
/**
* 编程之美 小飞 电梯调度算法
* 在繁忙的时间，每次电梯从一层往上走时，我们只允许电梯停在其中的某一层。
* 所有乘客都从一楼上电梯，到达某层楼后，电梯听下来，所有乘客再从这里爬楼梯到自己的目的层。
* 在一楼时，每个乘客选择自己的目的层，电梯则自动计算出应停的楼层。
* 问：电梯停在哪</div>
</li>
<li><a href="/article/2133.htm"
title="SQL注入相关概念" target="_blank">SQL注入相关概念</a>
<span class="text-muted">chenbowen00</span>
<a class="tag" taget="_blank" href="/search/sql/1.htm">sql</a><a class="tag" taget="_blank" href="/search/Web/1.htm">Web</a><a class="tag" taget="_blank" href="/search/%E5%AE%89%E5%85%A8/1.htm">安全</a>
<div>SQL Injection：就是通过把SQL命令插入到Web表单递交或输入域名或页面请求的查询字符串，最终达到欺骗服务器执行恶意的SQL命令。
具体来说，它是利用现有应用程序，将（恶意）的SQL命令注入到后台数据库引擎执行的能力，它可以通过在Web表单中输入（恶意）SQL语句得到一个存在安全漏洞的网站上的数据库，而不是按照设计者意图去执行SQL语句。
首先让我们了解什么时候可能发生SQ</div>
</li>
<li><a href="/article/2260.htm"
title="[光与电]光子信号战防御原理" target="_blank">[光与电]光子信号战防御原理</a>
<span class="text-muted">comsci</span>
<a class="tag" taget="_blank" href="/search/%E5%8E%9F%E7%90%86/1.htm">原理</a>
<div>
无论是在战场上,还是在后方,敌人都有可能用光子信号对人体进行控制和攻击,那么采取什么样的防御方法,最简单,最有效呢?
我们这里有几个山寨的办法,可能有些作用,大家如果有兴趣可以去实验一下
根据光</div>
</li>
<li><a href="/article/2387.htm"
title="oracle 11g新特性:Pending Statistics" target="_blank">oracle 11g新特性:Pending Statistics</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/dbms_stats/1.htm">dbms_stats</a>
<div>oracle 11g新特性:Pending Statistics 转
从11g开始，表与索引的统计信息收集完毕后，可以选择收集的统信息立即发布，也可以选择使新收集的统计信息处于pending状态，待确定处于pending状态的统计信息是安全的，再使处于pending状态的统计信息发布，这样就会避免一些因为收集统计信息立即发布而导致SQL执行计划走错的灾难。
在 11g 之前的版本中，D</div>
</li>
<li><a href="/article/2514.htm"
title="快速理解RequireJs" target="_blank">快速理解RequireJs</a>
<span class="text-muted">dengkane</span>
<a class="tag" taget="_blank" href="/search/jquery/1.htm">jquery</a><a class="tag" taget="_blank" href="/search/requirejs/1.htm">requirejs</a>
<div>RequireJs已经流行很久了，我们在项目中也打算使用它。它提供了以下功能：
声明不同js文件之间的依赖
可以按需、并行、延时载入js库
可以让我们的代码以模块化的方式组织
初看起来并不复杂。 在html中引入requirejs
在HTML中，添加这样的 <script> 标签：
<script src="/path/to</div>
</li>
<li><a href="/article/2641.htm"
title="C语言学习四流程控制if条件选择、for循环和强制类型转换" target="_blank">C语言学习四流程控制if条件选择、for循环和强制类型转换</a>
<span class="text-muted">dcj3sjt126com</span>
<a class="tag" taget="_blank" href="/search/c/1.htm">c</a>
<div># include <stdio.h>
int main(void)
{
int i, j;
scanf("%d %d", &i, &j);
if (i > j)
printf("i大于j\n");
else
printf("i小于j\n");
retu</div>
</li>
<li><a href="/article/2768.htm"
title="dictionary的使用要注意" target="_blank">dictionary的使用要注意</a>
<span class="text-muted">dcj3sjt126com</span>
<a class="tag" taget="_blank" href="/search/IO/1.htm">IO</a>
<div>NSDictionary *dict = [NSDictionary dictionaryWithObjectsAndKeys:
user.user_id , @"id",
user.username , @"username",
</div>
</li>
<li><a href="/article/2895.htm"
title="Android 中的资源访问(Resource)" target="_blank">Android 中的资源访问(Resource)</a>
<span class="text-muted">finally_m</span>
<a class="tag" taget="_blank" href="/search/xml/1.htm">xml</a><a class="tag" taget="_blank" href="/search/android/1.htm">android</a><a class="tag" taget="_blank" href="/search/String/1.htm">String</a><a class="tag" taget="_blank" href="/search/drawable/1.htm">drawable</a><a class="tag" taget="_blank" href="/search/color/1.htm">color</a>
<div>
简单的说，Android中的资源是指非代码部分。例如，在我们的Android程序中要使用一些图片来设置界面，要使用一些音频文件来设置铃声，要使用一些动画来显示特效，要使用一些字符串来显示提示信息。那么，这些图片、音频、动画和字符串等叫做Android中的资源文件。
在Eclipse创建的工程中，我们可以看到res和assets两个文件夹，是用来保存资源文件的，在assets中保存的一般是原生</div>
</li>
<li><a href="/article/3022.htm"
title="Spring使用Cache、整合Ehcache" target="_blank">Spring使用Cache、整合Ehcache</a>
<span class="text-muted">234390216</span>
<a class="tag" taget="_blank" href="/search/spring/1.htm">spring</a><a class="tag" taget="_blank" href="/search/cache/1.htm">cache</a><a class="tag" taget="_blank" href="/search/ehcache/1.htm">ehcache</a><a class="tag" taget="_blank" href="/search/%40Cacheable/1.htm">@Cacheable</a>
<div>Spring使用Cache
从3.1开始，Spring引入了对Cache的支持。其使用方法和原理都类似于Spring对事务管理的支持。Spring Cache是作用在方法上的，其核心思想是这样的：当我们在调用一个缓存方法时会把该方法参数和返回结果作为一个键值对存放在缓存中，等到下次利用同样的</div>
</li>
<li><a href="/article/3149.htm"
title="当druid遇上oracle blob(clob)" target="_blank">当druid遇上oracle blob(clob)</a>
<span class="text-muted">jackyrong</span>
<a class="tag" taget="_blank" href="/search/oracle/1.htm">oracle</a>
<div>http://blog.csdn.net/renfufei/article/details/44887371
众所周知，Oracle有很多坑, 所以才有了去IOE。
在使用Druid做数据库连接池后，其实偶尔也会碰到小坑，这就是使用开源项目所必须去填平的。【如果使用不开源的产品，那就不是坑，而是陷阱了，你都不知道怎么去填坑】
用Druid连接池，通过JDBC往Oracle数据库的</div>
</li>
<li><a href="/article/3276.htm"
title="easyui datagrid pagination获得分页页码、总页数等信息" target="_blank">easyui datagrid pagination获得分页页码、总页数等信息</a>
<span class="text-muted">ldzyz007</span>
<div>var grid = $('#datagrid');
var options = grid.datagrid('getPager').data("pagination").options;
var curr = options.pageNumber;
var total = options.total;
var max =</div>
</li>
<li><a href="/article/3403.htm"
title="浅析awk里的数组" target="_blank">浅析awk里的数组</a>
<span class="text-muted">nigelzeng</span>
<a class="tag" taget="_blank" href="/search/%E4%BA%8C%E7%BB%B4%E6%95%B0%E7%BB%84/1.htm">二维数组</a><a class="tag" taget="_blank" href="/search/array/1.htm">array</a><a class="tag" taget="_blank" href="/search/%E6%95%B0%E7%BB%84/1.htm">数组</a><a class="tag" taget="_blank" href="/search/awk/1.htm">awk</a>
<div>awk绝对是文本处理中的神器，它本身也是一门编程语言，还有许多功能本人没有使用到。这篇文章就单单针对awk里的数组来进行讨论，如何利用数组来帮助完成文本分析。
有这么一组数据：
abcd,91#31#2012-12-31 11:24:00
case_a,136#19#2012-12-31 11:24:00
case_a,136#23#2012-12-31 1</div>
</li>
<li><a href="/article/3530.htm"
title="搭建 CentOS 6 服务器(6) - TigerVNC" target="_blank">搭建 CentOS 6 服务器(6) - TigerVNC</a>
<span class="text-muted">rensanning</span>
<a class="tag" taget="_blank" href="/search/centos/1.htm">centos</a>
<div>安装GNOME桌面环境
# yum groupinstall "X Window System" "Desktop"
安装TigerVNC
# yum -y install tigervnc-server tigervnc
启动VNC服务
# /etc/init.d/vncserver restart
# vncser</div>
</li>
<li><a href="/article/3657.htm"
title="Spring 数据库连接整理" target="_blank">Spring 数据库连接整理</a>
<span class="text-muted">tomcat_oracle</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/jdbc/1.htm">jdbc</a>
<div>1、数据库连接jdbc.properties配置详解 jdbc.url=jdbc:hsqldb:hsql://localhost/xdb jdbc.username=sa jdbc.password= jdbc.driver=不同的数据库厂商驱动，此处不一一列举 接下来，详细配置代码如下：
Spring连接池 </div>
</li>
<li><a href="/article/3784.htm"
title="Dom4J解析使用xpath java.lang.NoClassDefFoundError: org/jaxen/JaxenException异常" target="_blank">Dom4J解析使用xpath java.lang.NoClassDefFoundError: org/jaxen/JaxenException异常</a>
<span class="text-muted">xp9802</span>
<div>用Dom4J解析xml,以前没注意,今天使用dom4j包解析xml时在xpath使用处报错
异常栈：java.lang.NoClassDefFoundError: org/jaxen/JaxenException异常
导入包 jaxen-1.1-beta-6.jar 解决;
&nb</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> 
