什麼是DOM (Document Object Model)

通过 JavaScript,您可以重構整个 HTML 文档。您可以添加、移除、改变或重排页 面上的项目。要改变页面的某个东西,JavaScript 就需要对 HTML 文档中所有元素进行访问的入口。 这个入口,连同对 HTML 元素进行添加、移动、改变或移除的方法和属性,都是通过文档对象模型来获 得的(DOM)。

在 1998 年,W3C 发布了第一级的 DOM 规範。这个规範允许访问和操作 HTML 页面中的每一个单独的元素。

所有的浏览器都执行了这个标准,因此,DOM 的相容性问题也幾乎难觅踪影了。

DOM 可被 JavaScript 用来读取、改变 HTML、XHTML 以及 XML 文 档。

DOM 被分为不同的部分(核心、XML及HTML)和级别(DOM Level 1/2/3):

Core DOM 定义了一套标准的针对任何结構化文档的对象

XML DOM 定义了一套标准的针对 XML 文档的对象

HTML DOM 定义了一套标准的针对 HTML 文档的对象。

HTML 文档中的每个成分都是一个节点。

节点

根據 DOM,HTML 文档中的每个成分都是一个节点。

DOM 是这样规定的:

  • 整个文档是一个文档节点
  • 每个 HTML 标签是一个元素节点
  • 包含在 HTML 元素中的文本是文本节点
  • 每一个 HTML 属性是一个属性节点
  • 注释属於注释节点

Node 层次

节点彼此都有等级关系。

HTML 文档中的所有节点组成了一个文档树(或节点树)。HTML 文档中的每个元素、 属性、文本等都代表着树中的一个节点。树起始于文档节点,並由此继续伸出枝条,直到处於这棵树
最低级别的所有文本节点为止。

下麵这个图片表示一个文档树(节点树):

HTML树结構

一棵节点树中的所有节点彼此都是有关系的。

文档树(节点数)

请看下麵这个HTML文档:

DOM Tutorial  

DOM Lesson one

Hello world!

上面所有的节点彼此间都存在_关系_。

除文档节点之外的每个节点都有_父节点_。举例, 和 的父节点是 节点,文本节点 “Hello
world!” 的父节点是

节点。

大部分元素节点都有_子节点_。比方说, 节点有一个子节点 : 节点。 节点也有一个子节点:文本节点<br />“DOM Tutorial”。</p><br /><p>当节点分享同一个父节点时,它们就是<em>同辈(同级节点)</em>。比方说,<h1> 和 <p>是同辈,因为它们的父节点均是 <body> 节点。</p><br /><p>节点也可以拥有<em>後代</em>,後代指某个节点的所有子节点,或者这些子节点的子 节点,以此类推。比方说,所有的文本节点都是 <html>节点的後代,而第一个文本节点是<br /><head> 节点的後代。</p><br /><p>节点也可以拥有<em>先辈</em>。先辈是某个节点的父节点,或者父节点的父节点,以此 类推。比方说,所有的文本节点都可把 <html> 节点作为先辈节点。</p><br /><p><strong><span style="font-size:180%;color:#ff0000;">下麵 来看幾个简单的例子 我想一下子就明白了!</span></strong></p><br /><strong>通过 DOM,您可访问 HTML 文档中的每个节点。</strong><br /><br /><br /><h2>查找並访问节点</h2><p>你可通过若干種方法来查找您希望操作的元素:</p><ul><li>通过使用 getElementById() 和 getElementsByTagName() 方法 </li><li>通过使用一个元素节点的 parentNode、firstChild 以及 lastChild 属性 </li></ul><p><span style="color:#800000;">getElementById() 和 getElementsByTagName()</span></p><p>getElementById() 和 getElementsByTagName() 这两種方法,可查找整个 HTML 文档中的任何 HTML 元素。</p><p>这两種方法会忽略文档的结構。假如您希望查找文档中所有的 <p> 元素,getElementsByTagName() 会把它们全部找到,不管 <p><br />元素处于文档中的哪个层次。同时,getElementById() 方法也会返回正確的元素,不论它被隐藏在文档结構中的什麼位置。</p><p>这两種方法会像您提供任何你所需要的 HTML 元素,不论它们在文档中所处的位置!</p><p>getElementById() 可通过指定的 ID 来返回元素:</p><br /><h3><span style="font-size:130%;color:#800080;">getElementById() 语法</span></h3><pre>document.getElementById("ID");</pre><pre>注释:getElementById() 无法工作在 XML 中。在 XML 文档中,您必须通过拥有类型 id 的属性来进行搜索,而此类型必须在<br />XML DTD 中进行声明。</pre><br /><p>getElementsByTagName() 方法会使用指定的标签名返回所有的元素(作 为一个节点列表),这些元素是您在使用此方法时所处的元素的後代。</p><br /><p>getElementsByTagName() 可被用於任何的 HTML 元素:</p><br /><h3><span style="font-size:130%;color:#800080;">getElementsByTagName() 语法</span></h3><pre>document.getElementsByTagName("标签名称");</pre><pre>或者:</pre><pre>document.getElementById('ID').getElementsByTagName("标签名称");</pre><br /><h3>實例1</h3><p>下麵这个例子会返回文档中所有 <p> 元素的一个节点列表:</p><p>document.getElementsByTagName(“p”);</p><h3>實例2</h3><p>下麵这个例子会返回所有 <p> 元素的一个节点列表,且这些 <p> 元素必须是 id 为 “maindiv” 的元素的後代:</p><p>document.getElementById(‘maindiv’).getElementsByTagName(“p”);</p><br /><h3>节点列表(nodeList)</h3><p>当我们使用节点列表时,通常要把此列表保存在一个变量中,就像这样:</p><pre>var x=document.getElementsByTagName("p");</pre><p>现在,变量 x 包含着页面中所有 <p> 元素的一个列表,並且我们可以通过它们的索引 号来访问这些 <p> 元素。</p><p class="note">注释:索引号从 0 开始。</p><p>您可以通过使用 length 属性来循环遍历节点列表:</p><pre>var x=document.getElementsByTagName("p");<br />for (var i=0;i<x.length;i++)<br /> {<br /> // do something with each paragraph<br /> }</pre><p>您也可以通过索引号来访问某个具體的元素。</p><p>要访问第三个 <p> 元素,您可以这麼写:</p><pre>var y=x[2];</pre><br /><h2><span style="color:#800080;">parentNode、firstChild以及lastChild</span></h2><p>这三个属性 parentNode、firstChild 以及 lastChild 可遵循文档的结構,在文档中进行“短距離的旅行”。</p><p>请看下麵这个 HTML 片段:</p><br /><pre><table><br /> <tr><br /> <td>John</td><br /> <td>Doe</td><br /> <td>Alaska</td><br /> </tr><br /></table></pre><br /><p>在上面的HTML代码中,第一个 <td> 是 <tr> 元素的首个子元素(firstChild),而最後一 个 <td> 是 <tr>元素的最後一个子元素(lastChild)。</p><p>此外,<tr> 是每个 <td>元 素的父节点(parentNode)。</p><p>对 firstChild 最普遍的用法是访问某个元素的文本:</p><pre>var x=[a paragraph];<br />var text=x.firstChild.nodeValue;</pre><pre>parentNode 属性常被用来改变文档的结構。假设您希望从文档中删除带有 id 为 "maindiv" 的节点:</pre><pre>var x=document.getElementById("maindiv");<br />x.parentNode.removeChild(x);</pre><p>首先,您需要找到带有指定 id 的节点,然後移至其父节点並执行 removeChild() 方法。</p><br />Link from : <a target="_blank" rel="noopener" href="http://hi.baidu.com/haomao/blog/item/4b8639c753bb3ad8d10060b0.html">http://hi.baidu.com/haomao/blog/item/4b8639c753bb3ad8d10060b0.html</a><div class="blogger-post-footer">Copyright © Bruce Huang All rights reserved.</div></x-turndown></p> <!-- more --> </div> <footer class="article-footer"> <a data-url="https://blog.xispace.app/2009/02/%E4%BB%80%E9%BA%BC%E6%98%AFDOM-Document-Object-Model/" data-id="clt2m4ta50086iw0m5gjl2ihw" class="article-share-link">Share</a> <ul class="article-tag-list" itemprop="keywords"><li class="article-tag-list-item"><a class="article-tag-list-link" href="/tags/HTML/" rel="tag">HTML</a></li><li class="article-tag-list-item"><a class="article-tag-list-link" href="/tags/javascript/" rel="tag">javascript</a></li></ul> </footer> </div> <nav id="article-nav"> <a href="/2009/02/Document-Object-Model-DOM/" id="article-nav-newer" class="article-nav-link-wrap"> <strong class="article-nav-caption">Newer</strong> <div class="article-nav-title"> Document Object Model (DOM) </div> </a> <a href="/2009/02/Flexigrid-for-jQuery/" id="article-nav-older" class="article-nav-link-wrap"> <strong class="article-nav-caption">Older</strong> <div class="article-nav-title">Flexigrid for jQuery</div> </a> </nav> </article> </section> <aside id="sidebar"> <div class="widget-wrap"> <h3 class="widget-title">Categories</h3> <div class="widget"> <ul class="category-list"><li class="category-list-item"><a class="category-list-link" href="/categories/news/">news</a></li><li class="category-list-item"><a class="category-list-link" href="/categories/terminal/">terminal</a></li></ul> </div> </div> <div class="widget-wrap"> <h3 class="widget-title">Tag Cloud</h3> <div class="widget tagcloud"> <a href="/tags/ASP-NET/" style="font-size: 16.67px;">ASP.NET</a> <a href="/tags/ActionScript/" style="font-size: 12.67px;">ActionScript</a> <a href="/tags/Bot/" style="font-size: 10px;">Bot</a> <a href="/tags/C/" style="font-size: 14.67px;">C#</a> <a href="/tags/CSS3/" style="font-size: 16px;">CSS3</a> <a href="/tags/Command-line/" style="font-size: 14px;">Command line</a> <a href="/tags/ConvertToPDF/" style="font-size: 10px;">ConvertToPDF</a> <a href="/tags/Database/" style="font-size: 10px;">Database</a> <a href="/tags/Django/" style="font-size: 14px;">Django</a> <a href="/tags/DotNet-Library/" style="font-size: 12.67px;">DotNet Library</a> <a href="/tags/Email/" style="font-size: 10px;">Email</a> <a href="/tags/Express/" style="font-size: 10px;">Express</a> <a href="/tags/Git/" style="font-size: 10px;">Git</a> <a href="/tags/GitBook/" style="font-size: 10px;">GitBook</a> <a href="/tags/GitHub/" style="font-size: 10px;">GitHub</a> <a href="/tags/Glances/" style="font-size: 10px;">Glances</a> <a href="/tags/HTML/" style="font-size: 19.33px;">HTML</a> <a href="/tags/Hexo/" style="font-size: 10px;">Hexo</a> <a href="/tags/IE/" style="font-size: 12px;">IE</a> <a href="/tags/IIS/" style="font-size: 11.33px;">IIS</a> <a href="/tags/JSON/" style="font-size: 11.33px;">JSON</a> <a href="/tags/Linux/" style="font-size: 10px;">Linux</a> <a href="/tags/MP3/" style="font-size: 10px;">MP3</a> <a href="/tags/MS-SQL/" style="font-size: 12.67px;">MS-SQL</a> <a href="/tags/MVC/" style="font-size: 10px;">MVC</a> <a href="/tags/Mac/" style="font-size: 14px;">Mac</a> <a href="/tags/Markdown/" style="font-size: 14px;">Markdown</a> <a href="/tags/Nodejs/" style="font-size: 13.33px;">Nodejs</a> <a href="/tags/Pycharm/" style="font-size: 11.33px;">Pycharm</a> <a href="/tags/Python/" style="font-size: 15.33px;">Python</a> <a href="/tags/Reactjs/" style="font-size: 10px;">Reactjs</a> <a href="/tags/SublimeText/" style="font-size: 11.33px;">SublimeText</a> <a href="/tags/TelegramBot/" style="font-size: 10px;">TelegramBot</a> <a href="/tags/Ubuntu/" style="font-size: 10px;">Ubuntu</a> <a href="/tags/VM/" style="font-size: 10px;">VM</a> <a href="/tags/WebSocket/" style="font-size: 10px;">WebSocket</a> <a href="/tags/Windowns-Service/" style="font-size: 10.67px;">Windowns Service</a> <a href="/tags/Windows-%E7%9B%B8%E9%97%9C/" style="font-size: 18.67px;">Windows 相關</a> <a href="/tags/blog/" style="font-size: 10.67px;">blog</a> <a href="/tags/color-code/" style="font-size: 10px;">color code</a> <a href="/tags/docker/" style="font-size: 10px;">docker</a> <a href="/tags/ejs/" style="font-size: 10px;">ejs</a> <a href="/tags/ffempg/" style="font-size: 10px;">ffempg</a> <a href="/tags/glances/" style="font-size: 10px;">glances</a> <a href="/tags/graylog/" style="font-size: 10px;">graylog</a> <a href="/tags/hexo/" style="font-size: 10px;">hexo</a> <a href="/tags/jQuery/" style="font-size: 18px;">jQuery</a> <a href="/tags/javascript/" style="font-size: 20px;">javascript</a> <a href="/tags/mov-convert-mp4/" style="font-size: 10px;">mov-convert-mp4</a> <a href="/tags/pm2/" style="font-size: 10.67px;">pm2</a> <a href="/tags/sqlite/" style="font-size: 10px;">sqlite</a> <a href="/tags/terminal/" style="font-size: 10px;">terminal</a> <a href="/tags/vscode/" style="font-size: 11.33px;">vscode</a> <a href="/tags/web2py/" style="font-size: 11.33px;">web2py</a> <a href="/tags/%E5%8D%9A%E5%AE%A2%E6%A1%86%E6%9E%B6/" style="font-size: 10px;">博客框架</a> <a href="/tags/%E7%80%8F%E8%A6%BD%E5%99%A8/" style="font-size: 11.33px;">瀏覽器</a> <a href="/tags/%E7%B7%9A%E4%B8%8A%E5%B7%A5%E5%85%B7/" style="font-size: 13.33px;">線上工具</a> <a href="/tags/%E8%B7%A8%E5%B9%B3%E5%8F%B0/" style="font-size: 10.67px;">跨平台</a> <a href="/tags/%E8%BB%9F%E4%BD%93%E6%87%89%E7%94%A8%E7%9B%B8%E9%97%9C/" style="font-size: 17.33px;">軟体應用相關</a> <a href="/tags/%E8%BB%9F%E5%B7%A5%E6%96%87%E4%BB%B6%E5%B7%A5%E5%85%B7/" style="font-size: 10px;">軟工文件工具</a> <a href="/tags/%E9%9A%A8%E4%BE%BF%E5%AF%AB%E5%AF%AB/" style="font-size: 12px;">隨便寫寫</a> </div> </div> <div class="widget-wrap"> <h3 class="widget-title"> Archives </h3> <div class="widget"> <!-- <ul class="archive-list"><li class="archive-list-item"><a class="archive-list-link" href="/archives/2023/05/">五月 2023</a></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2021/09/">九月 2021</a></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2021/08/">八月 2021</a></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2020/09/">九月 2020</a></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2020/08/">八月 2020</a></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2018/10/">十月 2018</a></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2018/06/">六月 2018</a></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2018/05/">五月 2018</a></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2017/08/">八月 2017</a></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2017/07/">七月 2017</a></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2017/05/">五月 2017</a></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2017/03/">三月 2017</a></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2016/08/">八月 2016</a></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2016/03/">三月 2016</a></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2015/10/">十月 2015</a></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2015/09/">九月 2015</a></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2015/08/">八月 2015</a></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2015/07/">七月 2015</a></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2015/03/">三月 2015</a></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2014/11/">十一月 2014</a></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2014/01/">一月 2014</a></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2012/10/">十月 2012</a></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2012/04/">四月 2012</a></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2012/03/">三月 2012</a></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2012/02/">二月 2012</a></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2011/11/">十一月 2011</a></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2011/08/">八月 2011</a></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2011/06/">六月 2011</a></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2011/05/">五月 2011</a></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2011/02/">二月 2011</a></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2011/01/">一月 2011</a></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2010/11/">十一月 2010</a></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2010/10/">十月 2010</a></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2010/08/">八月 2010</a></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2010/06/">六月 2010</a></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2010/05/">五月 2010</a></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2010/04/">四月 2010</a></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2010/03/">三月 2010</a></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2009/11/">十一月 2009</a></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2009/10/">十月 2009</a></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2009/09/">九月 2009</a></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2009/06/">六月 2009</a></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2009/05/">五月 2009</a></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2009/04/">四月 2009</a></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2009/03/">三月 2009</a></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2009/02/">二月 2009</a></li></ul> --> <!-- 20190304修改 --> <ul class="archive-list"><li class="archive-list-item"><a class="archive-list-link" href="/archives/2023/05/">2023-05</a><span class="archive-list-count">4</span></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2021/09/">2021-09</a><span class="archive-list-count">6</span></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2021/08/">2021-08</a><span class="archive-list-count">1</span></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2020/09/">2020-09</a><span class="archive-list-count">1</span></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2020/08/">2020-08</a><span class="archive-list-count">2</span></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2018/10/">2018-10</a><span class="archive-list-count">1</span></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2018/06/">2018-06</a><span class="archive-list-count">2</span></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2018/05/">2018-05</a><span class="archive-list-count">1</span></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2017/08/">2017-08</a><span class="archive-list-count">1</span></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2017/07/">2017-07</a><span class="archive-list-count">1</span></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2017/05/">2017-05</a><span class="archive-list-count">1</span></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2017/03/">2017-03</a><span class="archive-list-count">1</span></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2016/08/">2016-08</a><span class="archive-list-count">1</span></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2016/03/">2016-03</a><span class="archive-list-count">7</span></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2015/10/">2015-10</a><span class="archive-list-count">3</span></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2015/09/">2015-09</a><span class="archive-list-count">4</span></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2015/08/">2015-08</a><span class="archive-list-count">3</span></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2015/07/">2015-07</a><span class="archive-list-count">2</span></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2015/03/">2015-03</a><span class="archive-list-count">2</span></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2014/11/">2014-11</a><span class="archive-list-count">3</span></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2014/01/">2014-01</a><span class="archive-list-count">1</span></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2012/10/">2012-10</a><span class="archive-list-count">1</span></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2012/04/">2012-04</a><span class="archive-list-count">2</span></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2012/03/">2012-03</a><span class="archive-list-count">3</span></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2012/02/">2012-02</a><span class="archive-list-count">2</span></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2011/11/">2011-11</a><span class="archive-list-count">1</span></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2011/08/">2011-08</a><span class="archive-list-count">6</span></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2011/06/">2011-06</a><span class="archive-list-count">1</span></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2011/05/">2011-05</a><span class="archive-list-count">1</span></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2011/02/">2011-02</a><span class="archive-list-count">2</span></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2011/01/">2011-01</a><span class="archive-list-count">3</span></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2010/11/">2010-11</a><span class="archive-list-count">6</span></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2010/10/">2010-10</a><span class="archive-list-count">2</span></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2010/08/">2010-08</a><span class="archive-list-count">1</span></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2010/06/">2010-06</a><span class="archive-list-count">5</span></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2010/05/">2010-05</a><span class="archive-list-count">2</span></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2010/04/">2010-04</a><span class="archive-list-count">3</span></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2010/03/">2010-03</a><span class="archive-list-count">4</span></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2009/11/">2009-11</a><span class="archive-list-count">2</span></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2009/10/">2009-10</a><span class="archive-list-count">10</span></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2009/09/">2009-09</a><span class="archive-list-count">4</span></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2009/06/">2009-06</a><span class="archive-list-count">1</span></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2009/05/">2009-05</a><span class="archive-list-count">12</span></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2009/04/">2009-04</a><span class="archive-list-count">6</span></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2009/03/">2009-03</a><span class="archive-list-count">18</span></li><li class="archive-list-item"><a class="archive-list-link" href="/archives/2009/02/">2009-02</a><span class="archive-list-count">14</span></li></ul> </div> </div> <div class="widget-wrap"> <h3 class="widget-title">Recent Posts</h3> <div class="widget"> <ul> <li> <a href="/2023/05/ffempg-install/">ffmpeg 是您的不二之選</a> </li> <li> <a href="/2023/05/%E7%94%A8-Hexo%EF%BC%8C%E5%B0%87%E4%BD%A0%E7%9A%84%E6%83%B3%E6%B3%95%E4%BB%A5%E6%9C%80%E7%B0%A1%E6%BD%94%E3%80%81%E6%9C%80%E7%BE%8E%E9%BA%97%E7%9A%84%E6%96%B9%E5%BC%8F%E5%91%88%E7%8F%BE%E7%B5%A6%E4%B8%96%E7%95%8C/">用 Hexo,將你的想法以最簡潔、最美麗的方式呈現給世界</a> </li> <li> <a href="/2023/05/New-Hexo-app-for-ChatGPT/">Hexo教學 from ChatGPT</a> </li> <li> <a href="/2023/05/Glances%E6%98%AF%E4%B8%80%E5%80%8B%E8%B7%A8%E5%B9%B3%E5%8F%B0%E7%9A%84%E7%B3%BB%E7%B5%B1%E7%9B%A3%E8%A6%96%E5%B7%A5%E5%85%B7/">Glances是一個跨平台的系統監視工具</a> </li> <li> <a href="/2021/09/Markdown%E5%BD%B1%E9%9F%B3/">Markdown影音與圖片</a> </li> </ul> </div> </div> </aside> </div> <footer id="footer"> <div class="outer"> <div id="footer-info" class="inner"> © 2024 cn27529  Powered by <a href="http://hexo.io/" target="_blank">Hexo</a> </div> </div> </footer> </div> <nav id="mobile-nav"> <a href="/" class="mobile-nav-link">Home</a> <a href="/archives" class="mobile-nav-link">Archives</a> <a target="_blank" rel="noopener" href="https://cv.xispace.app/" class="mobile-nav-link">CV</a> <a target="_blank" rel="noopener" href="https://facebook.com/cn27529/" class="mobile-nav-link">FB</a> <a target="_blank" rel="noopener" href="https://instagram.com/cn27529/" class="mobile-nav-link">IG</a> <a target="_blank" rel="noopener" href="https://github.com/cn27529/" class="mobile-nav-link">Github</a> </nav> <script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script> <link rel="stylesheet" href="/fancybox/jquery.fancybox.css"> <script src="/fancybox/jquery.fancybox.pack.js"></script> <script src="/js/script.js"></script> </div> <script type="module"> import { initializeApp } from "https://www.gstatic.com/firebasejs/9.21.0/firebase-app.js"; import { getAnalytics } from "https://www.gstatic.com/firebasejs/9.21.0/firebase-analytics.js"; const firebaseConfig = { apiKey: "AIzaSyBgXKl6hYkm-K7tTuOwU-Vosj2XvaJDGj8", authDomain: "xispace.firebaseapp.com", projectId: "xispace", storageBucket: "xispace.appspot.com", messagingSenderId: "839395447140", appId: "1:839395447140:web:755533aa23c2ee81d76a71", measurementId: "G-WFWZBQS9M2" }; const app = initializeApp(firebaseConfig); const analytics = getAnalytics(app); </script> </body> </html>