javascript怎麼加輸入框

隨著現代網頁應用程式的崛起，JavaScript已成為Web開發中不可或缺的一部分。其中之一的主要用途之一就是與使用者交互，以便收集資料或接收使用者的輸入。在這篇文章中，我們將深入探討在JavaScript中如何新增輸入框來收集使用者輸入的資料。

1. 使用HTML建立輸入框

在JavaScript中新增輸入框的最簡單方法是透過在HTML中使用元素。下面是一個基本的輸入框範例，它將建立一個文字方塊並提供一個佔位符，以引導使用者鍵入所需的值。

 姓名:  
  

在上面的範例中，我們使用了

 请选择性别: 
  男 
  女 
 
 电话号码: 
  
 
 留言: 
  
  

在這個範例中，我們使用元素來建立單選框和電話輸入框。我們也使用</code>元素來建立多行文字方塊。</p> <ol start="2"> <li>使用JavaScript建立輸入框</li> </ol> <p>除了在HTML中定義輸入方塊之外，您還可以使用JavaScript動態地建立和新增輸入框。正如您將在下面的範例中看到的那樣，可以使用<code>createElement()</code>和<code>appendChild()</code>方法來建立和新增輸入框。</p> <div class="code" style="position:relative; padding:0px; margin:0px;"> <pre class="brush:php;toolbar:false">let form = document.createElement('form'); let label = document.createElement('label'); let input = document.createElement('input'); let submit = document.createElement('input'); label.textContent = "请输入您的邮箱地址:"; input.type = "email"; input.id = "email"; input.name = "email"; submit.type = "submit"; submit.value = "提交"; form.appendChild(label); form.appendChild(input); form.appendChild(submit); document.body.appendChild(form);</pre> <div class="contentsignin"> 登入後複製 </div> </div> <p>在上面的範例中，我們首先使用<code>createElement()</code>方法建立了一個<code><form></code>元素和三個子元素：一個<code>< ;label></code>元素，一個<code><input></code>元素和一個提交按鈕。然後，我們設定了<code><label></code>和<code><input></code>元素的文字和屬性值，最後使用<code>appendChild()</code>方法將所有元素加入到<code><form></code>元素中。最終，我們將<code><form></code>元素加入文件的主體。</p> <ol start="3"> <li>從輸入框中取得資料</li> </ol> <p>一旦您的輸入框已經創建，您通常需要取得使用者輸入資料。在JavaScript中，可以使用<code>value</code>屬性來存取輸入框的值，例如下面的程式碼片段:</p> <div class="code" style="position:relative; padding:0px; margin:0px;"> <pre class="brush:php;toolbar:false">let nameInput = document.getElementById('name'); let name = nameInput.value; console.log(name);</pre> <div class="contentsignin"> 登入後複製 </div> </div> <p>在上面的程式碼中，我們首先使用<code>getElementById()</code>方法找到ID為"name"的輸入框，然後讀取<code>value</code>屬性，以取得輸入框中的值。我們將該值儲存在一個變數中並列印在控制台中。</p> <p>除了取得文字輸入框的資料之外，還可以使用類似的技術來取得單選框，複選框和下拉式選單等其他類型的輸入框的值。以下是幾個範例：</p> <div class="code" style="position:relative; padding:0px; margin:0px;"> <pre class="brush:php;toolbar:false">let genderInput = document.querySelector('input[name="gender"]:checked'); let gender = genderInput.value; console.log(gender); let checkboxInput = document.getElementById('agree'); let isChecked = checkboxInput.checked; console.log(isChecked); let selectInput = document.getElementById('language'); let language = selectInput.value; console.log(language);</pre> <div class="contentsignin"> 登入後複製 </div> </div> <p>在上述程式碼中，我們使用<code>querySelector()</code>方法選擇具有已選取選項的單選框元素，使用<code>checked</code>屬性取得複選框元素的選取狀態，以及使用<code>value</code>屬性取得下拉式選單元素的選取值。</p> <p>結論</p> <p>無論您是在HTML中定義輸入框還是在JavaScript中建立它們，都可以使用上述技術來存取和取得輸入框中的資料。</p> <p>在實際應用程式中，您通常需要校驗使用者輸入的資料以確保其有效性。您也可以使用JavaScript來動態變更輸入框和表單的屬性和樣式，以使其更具吸引力和易於使用。</p> <p>希望本文能夠幫助您在JavaScript中新增輸入框，以便您可以更輕鬆地從使用者那裡獲取資料。</p> <p>以上是javascript怎麼加輸入框的詳細內容。更多資訊請關注PHP中文網其他相關文章！</p> </div> </div> <div style="height: 25px;"> <div style="display: inline-flex;float: right; color:#333333;"> 來源：php.cn </div> </div> <div class="wzconOtherwz"> <a href="//m.sbmmt.com/zh-tw/faq/527320.html" title=""><span>上一篇：html表格居中怎麼設定</span></a> <a href="//m.sbmmt.com/zh-tw/faq/527322.html" title=""><span>下一篇：html5如何學習</span></a> </div> <div class="wzconShengming"> <div class="bzsmdiv"> 本網站聲明 </div> <div> 本文內容由網友自願投稿，版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容，請聯絡admin@php.cn </div> </div> <div class="wwads-cn wwads-horizontal" data-id="156" style="max-width:955px"></div> <div class="wzconZzwz"> <div class="wzconZzwztitle"> 作者最新文章 </div> <ul> <li> <div class="wzczzwzli"> <span class="layui-badge-dots"></span> <a target="_blank" href="//m.sbmmt.com/zh-tw/faq/1796571706.html">《心動小鎮手遊》升級發展家方法</a> </div> <div> 2024-08-16 19:47:18 </div></li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots"></span> <a target="_blank" href="//m.sbmmt.com/zh-tw/faq/1796571700.html">《逆水寒手游》玄目说早早早任务攻略</a> </div> <div> 2024-08-16 19:46:10 </div></li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots"></span> <a target="_blank" href="//m.sbmmt.com/zh-tw/faq/1796571697.html">《找到下一关》第1-5关通关攻略</a> </div> <div> 2024-08-16 19:45:14 </div></li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots"></span> <a target="_blank" href="//m.sbmmt.com/zh-tw/faq/1796571690.html">《FGO》泳装徐福羁绊礼装内容一览</a> </div> <div> 2024-08-16 19:42:49 </div></li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots"></span> <a target="_blank" href="//m.sbmmt.com/zh-tw/faq/1796571681.html">《她說》清除快取方法</a> </div> <div> 2024-08-16 19:39:34 </div></li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots"></span> <a target="_blank" href="//m.sbmmt.com/zh-tw/faq/1796571670.html">《原神》5.0版本更新时间介绍</a> </div> <div> 2024-08-16 19:37:27 </div></li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots"></span> <a target="_blank" href="//m.sbmmt.com/zh-tw/faq/1796571658.html">《王者荣耀》姬小满战舞者皮肤上线时间一览</a> </div> <div> 2024-08-16 19:33:28 </div></li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots"></span> <a target="_blank" href="//m.sbmmt.com/zh-tw/faq/1796571644.html">真我13 Pro系列首曝！莫內靈感碰撞油墨質感，顏值天花板？</a> </div> <div> 2024-08-16 19:03:46 </div></li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots"></span> <a target="_blank" href="//m.sbmmt.com/zh-tw/faq/1796571636.html">小米SUV來了？老頭樂廠商搶跑，雷軍表情亮了...</a> </div> <div> 2024-08-16 19:01:03 </div></li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots"></span> <a target="_blank" href="//m.sbmmt.com/zh-tw/faq/1796571634.html">K網交易平台究竟怎麼樣？ K網交易平台安全嗎？</a> </div> <div> 2024-08-16 19:00:02 </div></li> </ul> </div> <div class="wzconZzwz"> <div class="wzconZzwztitle"> 最新問題 </div> <div class="wdsyContent"> <div class="wdsyConDiv flexRow wdsyConDiv1"> <div class="wdcdContent flexColumn"> <a href="//m.sbmmt.com/zh-tw/wenda/176411.html" target="_blank" title="function_exists()無法判定自訂函數" class="wdcdcTitle">function_exists()無法判定自訂函數</a> <a href="//m.sbmmt.com/zh-tw/wenda/176411.html" class="wdcdcCons">function test() { return true; } if (function_exists('TEST')) { ech...</a> <div class="wdcdcInfo flexRow"> <div class="wdcdcileft"> <span class="wdcdciSpan">來自於 2024-04-29 11:01:01</span> </div> <div class="wdcdciright flexRow"> <div class="wdcdcirdz flexRow ira"> <b class="wdcdcirdzi"></b>0 </div> <div class="wdcdcirpl flexRow ira"> <b class="wdcdcirpli"></b>1 </div> <div class="wdcdcirwatch flexRow ira"> <b class="wdcdcirwatchi"></b>926 </div> </div> </div> </div> </div> <div class="wdsyConLine wdsyConLine2"></div> <div class="wdsyConDiv flexRow wdsyConDiv1"> <div class="wdcdContent flexColumn"> <a href="//m.sbmmt.com/zh-tw/wenda/176410.html" target="_blank" title="google 瀏覽器 手機版顯示的怎麼實現" class="wdcdcTitle">google 瀏覽器 手機版顯示的怎麼實現</a> <a href="//m.sbmmt.com/zh-tw/wenda/176410.html" class="wdcdcCons">老師您好，google 瀏覽器怎麼變成手機版樣式的？</a> <div class="wdcdcInfo flexRow"> <div class="wdcdcileft"> <span class="wdcdciSpan">來自於 2024-04-23 00:22:19</span> </div> <div class="wdcdciright flexRow"> <div class="wdcdcirdz flexRow ira"> <b class="wdcdcirdzi"></b>0 </div> <div class="wdcdcirpl flexRow ira"> <b class="wdcdcirpli"></b>9 </div> <div class="wdcdcirwatch flexRow ira"> <b class="wdcdcirwatchi"></b>1006 </div> </div> </div> </div> </div> <div class="wdsyConLine wdsyConLine2"></div> <div class="wdsyConDiv flexRow wdsyConDiv1"> <div class="wdcdContent flexColumn"> <a href="//m.sbmmt.com/zh-tw/wenda/176407.html" target="_blank" title="子窗口操作父窗口，輸出沒反應" class="wdcdcTitle">子窗口操作父窗口，輸出沒反應</a> <a href="//m.sbmmt.com/zh-tw/wenda/176407.html" class="wdcdcCons">前兩句可執行，最後一句沒辦法應</a> <div class="wdcdcInfo flexRow"> <div class="wdcdcileft"> <span class="wdcdciSpan">來自於 2024-04-19 15:37:47</span> </div> <div class="wdcdciright flexRow"> <div class="wdcdcirdz flexRow ira"> <b class="wdcdcirdzi"></b>0 </div> <div class="wdcdcirpl flexRow ira"> <b class="wdcdcirpli"></b>1 </div> <div class="wdcdcirwatch flexRow ira"> <b class="wdcdcirwatchi"></b>921 </div> </div> </div> </div> </div> <div class="wdsyConLine wdsyConLine2"></div> <div class="wdsyConDiv flexRow wdsyConDiv1"> <div class="wdcdContent flexColumn"> <a href="//m.sbmmt.com/zh-tw/wenda/176406.html" target="_blank" title="父視窗沒有輸出" class="wdcdcTitle">父視窗沒有輸出</a> <a href="//m.sbmmt.com/zh-tw/wenda/176406.html" class="wdcdcCons">document.onclick = function(){ window.opener.document.write('我是子視窗的輸出'); ...</a> <div class="wdcdcInfo flexRow"> <div class="wdcdcileft"> <span class="wdcdciSpan">來自於 2024-04-18 23:52:34</span> </div> <div class="wdcdciright flexRow"> <div class="wdcdcirdz flexRow ira"> <b class="wdcdcirdzi"></b>0 </div> <div class="wdcdcirpl flexRow ira"> <b class="wdcdcirpli"></b>0 </div> <div class="wdcdcirwatch flexRow ira"> <b class="wdcdcirwatchi"></b>782 </div> </div> </div> </div> </div> <div class="wdsyConLine wdsyConLine2"></div> <div class="wdsyConDiv flexRow wdsyConDiv1"> <div class="wdcdContent flexColumn"> <a href="//m.sbmmt.com/zh-tw/wenda/176405.html" target="_blank" title="關於CSS心智圖的課件在哪？" class="wdcdcTitle">關於CSS心智圖的課件在哪？</a> <a href="//m.sbmmt.com/zh-tw/wenda/176405.html" class="wdcdcCons">課件</a> <div class="wdcdcInfo flexRow"> <div class="wdcdcileft"> <span class="wdcdciSpan">來自於 2024-04-16 10:10:18</span> </div> <div class="wdcdciright flexRow"> <div class="wdcdcirdz flexRow ira"> <b class="wdcdcirdzi"></b>0 </div> <div class="wdcdcirpl flexRow ira"> <b class="wdcdcirpli"></b>0 </div> <div class="wdcdcirwatch flexRow ira"> <b class="wdcdcirwatchi"></b>862 </div> </div> </div> </div> </div> <div class="wdsyConLine wdsyConLine2"></div> </div> </div> <div class="wzconZt"> <div class="wzczt-title"> <div> 相關專題 </div> <a href="//m.sbmmt.com/zh-tw/faq/zt" target="_blank">更多></a> </div> <div class="wzcttlist"> <ul> <li class="ul-li"><a target="_blank" href="//m.sbmmt.com/zh-tw/faq/bazmzc"><img src="https://img.php.cn/upload/subject/202407/22/2024072212253772880.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="幣安怎麼註冊"></a><a target="_blank" href="//m.sbmmt.com/zh-tw/faq/bazmzc" class="title-a-spanl" title=""><span>幣安怎麼註冊</span></a></li> <li class="ul-li"><a target="_blank" href="//m.sbmmt.com/zh-tw/faq/sbglqdbkzmjj"><img src="https://img.php.cn/upload/subject/202407/22/2024072213523927443.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="裝置管理員打不開怎麼解決"></a><a target="_blank" href="//m.sbmmt.com/zh-tw/faq/sbglqdbkzmjj" class="title-a-spanl" title=""><span>裝置管理員打不開怎麼解決</span></a></li> <li class="ul-li"><a target="_blank" href="//m.sbmmt.com/zh-tw/faq/pycharmbxyxss"><img src="https://img.php.cn/upload/subject/202407/22/2024072212075850841.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="pycharm並行運行是啥意思"></a><a target="_blank" href="//m.sbmmt.com/zh-tw/faq/pycharmbxyxss" class="title-a-spanl" title=""><span>pycharm並行運行是啥意思</span></a></li> <li class="ul-li"><a target="_blank" href="//m.sbmmt.com/zh-tw/faq/dsjpt"><img src="https://img.php.cn/upload/subject/202407/22/2024072214391327550.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="大數據平台"></a><a target="_blank" href="//m.sbmmt.com/zh-tw/faq/dsjpt" class="title-a-spanl" title=""><span>大數據平台</span></a></li> <li class="ul-li"><a target="_blank" href="//m.sbmmt.com/zh-tw/faq/pszmhxx"><img src="https://img.php.cn/upload/subject/202407/22/2024072214293531556.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="ps怎麼畫虛線"></a><a target="_blank" href="//m.sbmmt.com/zh-tw/faq/pszmhxx" class="title-a-spanl" title=""><span>ps怎麼畫虛線</span></a></li> <li class="ul-li"><a target="_blank" href="//m.sbmmt.com/zh-tw/faq/smsbdzs"><img src="https://img.php.cn/upload/subject/202407/22/2024072214370974997.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="什麼是百度指數"></a><a target="_blank" href="//m.sbmmt.com/zh-tw/faq/smsbdzs" class="title-a-spanl" title=""><span>什麼是百度指數</span></a></li> <li class="ul-li"><a target="_blank" href="//m.sbmmt.com/zh-tw/faq/smsszhb"><img src="https://img.php.cn/upload/subject/202407/22/2024072213250620612.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="數位貨幣是什麼"></a><a target="_blank" href="//m.sbmmt.com/zh-tw/faq/smsszhb" class="title-a-spanl" title=""><span>數位貨幣是什麼</span></a></li> <li class="ul-li"><a target="_blank" href="//m.sbmmt.com/zh-tw/faq/dyplqdtpzmbcd"><img src="https://img.php.cn/upload/subject/202407/22/2024072212083868148.jpg?x-oss-process=image/resize,m_fill,h_145,w_220" alt="抖音評論區的圖片怎麼存到手機"></a><a target="_blank" href="//m.sbmmt.com/zh-tw/faq/dyplqdtpzmbcd" class="title-a-spanl" title=""><span>抖音評論區的圖片怎麼存到手機</span></a></li> </ul> </div> </div> </div> </div> <div class="phpwzright"> <div class="wzrOne"> <div class="wzroTitle"> 熱門推薦 </div> <div class="wzroList"> <ul> <li> <div class="wzczzwzli"> <span class="layui-badge-dots wzrolr"></span> <a style="height: auto;" title="什麼是URL地址" href="//m.sbmmt.com/zh-tw/faq/414430.html">什麼是URL地址</a> </div></li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots wzrolr"></span> <a style="height: auto;" title="web端是什麼意思" href="//m.sbmmt.com/zh-tw/faq/417340.html">web端是什麼意思</a> </div></li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots wzrolr"></span> <a style="height: auto;" title="程式語言有哪些" href="//m.sbmmt.com/zh-tw/faq/414438.html">程式語言有哪些</a> </div></li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots wzrolr"></span> <a style="height: auto;" title="什麼是IT產業" href="//m.sbmmt.com/zh-tw/faq/419217.html">什麼是IT產業</a> </div></li> <li> <div class="wzczzwzli"> <span class="layui-badge-dots wzrolr"></span> <a style="height: auto;" title="error是什麼意思" href="//m.sbmmt.com/zh-tw/faq/414287.html">error是什麼意思</a> </div></li> </ul> </div> </div> <div class="wzrThree"> <div class="wzrthree-title"> <div> 熱門教學 </div> <a target="_blank" href="//m.sbmmt.com/zh-tw/course.html">更多></a> </div> <div class="wzrthreelist swiper2"> <div class="wzrthreeTab swiper-wrapper"> <div class="check tabdiv swiper-slide" data-id="one"> 相關教學 <div></div> </div> <div class="tabdiv swiper-slide" data-id="two"> 熱門推薦 <div></div> </div> <div class="tabdiv swiper-slide" data-id="three"> 最新課程 <div></div> </div> </div> <ul class="one"> <li><a target="_blank" href="//m.sbmmt.com/zh-tw/course/812.html" title="" class="wzrthreelaimg"><img src="https://img.php.cn/upload/course/000/000/041/620debc3eab3f377.jpg" alt="最新ThinkPHP 5.1全球首發影片教學(60天成就PHP大牛線上訓練課程)"></a> <div class="wzrthree-right"> <a target="_blank" title="最新ThinkPHP 5.1全球首發影片教學(60天成就PHP大牛線上訓練課程)" href="//m.sbmmt.com/zh-tw/course/812.html">最新ThinkPHP 5.1全球首發影片教學(60天成就PHP大牛線上訓練課程)</a> <div class="wzrthreerb"> <div> 1394729 <b class="kclbcollectb"></b> </div> <div class="courseICollection" data-id="812"> <b class="nofollow small-nocollect"></b> </div> </div> </div></li> <li><a target="_blank" href="//m.sbmmt.com/zh-tw/course/74.html" title="" class="wzrthreelaimg"><img src="https://img.php.cn/upload/course/000/000/068/6253d1e28ef5c345.png" alt="php入門教程之一週學會PHP"></a> <div class="wzrthree-right"> <a target="_blank" title="php入門教程之一週學會PHP" href="//m.sbmmt.com/zh-tw/course/74.html">php入門教程之一週學會PHP</a> <div class="wzrthreerb"> <div> 4206440 <b class="kclbcollectb"></b> </div> <div class="courseICollection" data-id="74"> <b class="nofollow small-nocollect"></b> </div> </div> </div></li> <li><a target="_blank" href="//m.sbmmt.com/zh-tw/course/286.html" title="" class="wzrthreelaimg"><img src="https://img.php.cn/upload/course/000/000/068/62590a2bacfd9379.png" alt="JAVA 初級入門影片教學"></a> <div class="wzrthree-right"> <a target="_blank" title="JAVA 初級入門影片教學" href="//m.sbmmt.com/zh-tw/course/286.html">JAVA 初級入門影片教學</a> <div class="wzrthreerb"> <div> 2347153 <b class="kclbcollectb"></b> </div> <div class="courseICollection" data-id="286"> <b class="nofollow small-nocollect"></b> </div> </div> </div></li> <li><a target="_blank" href="//m.sbmmt.com/zh-tw/course/504.html" title="" class="wzrthreelaimg"><img src="https://img.php.cn/upload/course/000/000/068/62590a67ce3a6655.png" alt="小甲魚零基礎入門學習Python影片教學"></a> <div class="wzrthree-right"> <a target="_blank" title="小甲魚零基礎入門學習Python影片教學" href="//m.sbmmt.com/zh-tw/course/504.html">小甲魚零基礎入門學習Python影片教學</a> <div class="wzrthreerb"> <div> 493052 <b class="kclbcollectb"></b> </div> <div class="courseICollection" data-id="504"> <b class="nofollow small-nocollect"></b> </div> </div> </div></li> <li><a target="_blank" href="//m.sbmmt.com/zh-tw/course/2.html" title="" class="wzrthreelaimg"><img src="https://img.php.cn/upload/course/000/000/068/6253de27bc161468.png" alt="PHP 零基礎入門教學"></a> <div class="wzrthree-right"> <a target="_blank" title="PHP 零基礎入門教學" href="//m.sbmmt.com/zh-tw/course/2.html">PHP 零基礎入門教學</a> <div class="wzrthreerb"> <div> 826203 <b class="kclbcollectb"></b> </div> <div class="courseICollection" data-id="2"> <b class="nofollow small-nocollect"></b> </div> </div> </div></li> </ul> <ul class="two" style="display: none;"> <li><a target="_blank" href="//m.sbmmt.com/zh-tw/course/812.html" title="" class="wzrthreelaimg"><img src="https://img.php.cn/upload/course/000/000/041/620debc3eab3f377.jpg" alt="最新ThinkPHP 5.1全球首發影片教學(60天成就PHP大牛線上訓練課程)"></a> <div class="wzrthree-right"> <a target="_blank" title="最新ThinkPHP 5.1全球首發影片教學(60天成就PHP大牛線上訓練課程)" href="//m.sbmmt.com/zh-tw/course/812.html">最新ThinkPHP 5.1全球首發影片教學(60天成就PHP大牛線上訓練課程)</a> <div class="wzrthreerb"> <div> 1394729次學習 </div> <div class="courseICollection" data-id="812"> <b class="nofollow small-nocollect"></b> </div> </div> </div></li> <li><a target="_blank" href="//m.sbmmt.com/zh-tw/course/286.html" title="" class="wzrthreelaimg"><img src="https://img.php.cn/upload/course/000/000/068/62590a2bacfd9379.png" alt="JAVA 初級入門影片教學"></a> <div class="wzrthree-right"> <a target="_blank" title="JAVA 初級入門影片教學" href="//m.sbmmt.com/zh-tw/course/286.html">JAVA 初級入門影片教學</a> <div class="wzrthreerb"> <div> 2347153次學習 </div> <div class="courseICollection" data-id="286"> <b class="nofollow small-nocollect"></b> </div> </div> </div></li> <li><a target="_blank" href="//m.sbmmt.com/zh-tw/course/504.html" title="" class="wzrthreelaimg"><img src="https://img.php.cn/upload/course/000/000/068/62590a67ce3a6655.png" alt="小甲魚零基礎入門學習Python影片教學"></a> <div class="wzrthree-right"> <a target="_blank" title="小甲魚零基礎入門學習Python影片教學" href="//m.sbmmt.com/zh-tw/course/504.html">小甲魚零基礎入門學習Python影片教學</a> <div class="wzrthreerb"> <div> 493052次學習 </div> <div class="courseICollection" data-id="504"> <b class="nofollow small-nocollect"></b> </div> </div> </div></li> <li><a target="_blank" href="//m.sbmmt.com/zh-tw/course/901.html" title="" class="wzrthreelaimg"><img src="https://img.php.cn/upload/course/000/000/067/64be28a53a4f6310.png" alt="Web前端開發極速入門"></a> <div class="wzrthree-right"> <a target="_blank" title="Web前端開發極速入門" href="//m.sbmmt.com/zh-tw/course/901.html">Web前端開發極速入門</a> <div class="wzrthreerb"> <div> 213403次學習 </div> <div class="courseICollection" data-id="901"> <b class="nofollow small-nocollect"></b> </div> </div> </div></li> <li><a target="_blank" href="//m.sbmmt.com/zh-tw/course/234.html" title="" class="wzrthreelaimg"><img src="https://img.php.cn/upload/course/000/000/068/62611f57ed0d4840.jpg" alt="零基礎精通 PS 影片教學"></a> <div class="wzrthree-right"> <a target="_blank" title="零基礎精通 PS 影片教學" href="//m.sbmmt.com/zh-tw/course/234.html">零基礎精通 PS 影片教學</a> <div class="wzrthreerb"> <div> 842464次學習 </div> <div class="courseICollection" data-id="234"> <b class="nofollow small-nocollect"></b> </div> </div> </div></li> </ul> <ul class="three" style="display: none;"> <li><a target="_blank" href="//m.sbmmt.com/zh-tw/course/1648.html" title="" class="wzrthreelaimg"><img src="https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png" alt="【web前端】Node.js快速入門"></a> <div class="wzrthree-right"> <a target="_blank" title="【web前端】Node.js快速入門" href="//m.sbmmt.com/zh-tw/course/1648.html">【web前端】Node.js快速入門</a> <div class="wzrthreerb"> <div> 3072次學習 </div> <div class="courseICollection" data-id="1648"> <b class="nofollow small-nocollect"></b> </div> </div> </div></li> <li><a target="_blank" href="//m.sbmmt.com/zh-tw/course/1647.html" title="" class="wzrthreelaimg"><img src="https://img.php.cn/upload/course/000/000/067/6628cc96e310c937.png" alt="國外Web開發全端課程全集"></a> <div class="wzrthree-right"> <a target="_blank" title="國外Web開發全端課程全集" href="//m.sbmmt.com/zh-tw/course/1647.html">國外Web開發全端課程全集</a> <div class="wzrthreerb"> <div> 2480次學習 </div> <div class="courseICollection" data-id="1647"> <b class="nofollow small-nocollect"></b> </div> </div> </div></li> <li><a target="_blank" href="//m.sbmmt.com/zh-tw/course/1646.html" title="" class="wzrthreelaimg"><img src="https://img.php.cn/upload/course/000/000/067/662221173504a436.png" alt="Go語言實戰之 GraphQL"></a> <div class="wzrthree-right"> <a target="_blank" title="Go語言實戰之 GraphQL" href="//m.sbmmt.com/zh-tw/course/1646.html">Go語言實戰之 GraphQL</a> <div class="wzrthreerb"> <div> 1958次學習 </div> <div class="courseICollection" data-id="1646"> <b class="nofollow small-nocollect"></b> </div> </div> </div></li> <li><a target="_blank" href="//m.sbmmt.com/zh-tw/course/1645.html" title="" class="wzrthreelaimg"><img src="https://img.php.cn/upload/course/000/000/067/662077e163124646.png" alt="550W粉絲大佬手把手從零學JavaScript"></a> <div class="wzrthree-right"> <a target="_blank" title="550W粉絲大佬手把手從零學JavaScript" href="//m.sbmmt.com/zh-tw/course/1645.html">550W粉絲大佬手把手從零學JavaScript</a> <div class="wzrthreerb"> <div> 464次學習 </div> <div class="courseICollection" data-id="1645"> <b class="nofollow small-nocollect"></b> </div> </div> </div></li> <li><a target="_blank" href="//m.sbmmt.com/zh-tw/course/1644.html" title="" class="wzrthreelaimg"><img src="https://img.php.cn/upload/course/000/000/067/6616418ca80b8916.png" alt="python大神Mosh，零基礎小白6小時完全入門"></a> <div class="wzrthree-right"> <a target="_blank" title="python大神Mosh，零基礎小白6小時完全入門" href="//m.sbmmt.com/zh-tw/course/1644.html">python大神Mosh，零基礎小白6小時完全入門</a> <div class="wzrthreerb"> <div> 10687次學習 </div> <div class="courseICollection" data-id="1644"> <b class="nofollow small-nocollect"></b> </div> </div> </div></li> </ul> </div> </div> <div class="wzrFour"> <div class="wzrfour-title"> <div> 最新下載 </div> <a href="//m.sbmmt.com/zh-tw/xiazai">更多></a> </div> <div class="wzrfourList swiper3"> <div class="wzrfourlTab swiper-wrapper"> <div class="check swiper-slide" data-id="onef"> 網站特效 <div></div> </div> <div class="swiper-slide" data-id="twof"> 網站源碼 <div></div> </div> <div class="swiper-slide" data-id="threef"> 網站素材 <div></div> </div> <div class="swiper-slide" data-id="fourf"> 前端模板 <div></div> </div> </div> <ul class="onef"> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a target="_blank" title="[表單按鈕] jQuery企業留言表單聯絡程式碼" href="//m.sbmmt.com/zh-tw/xiazai/js/8071">[表單按鈕] jQuery企業留言表單聯絡程式碼</a> </div></li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a target="_blank" title="[播放器特效] HTML5 MP3音樂盒播放特效" href="//m.sbmmt.com/zh-tw/xiazai/js/8070">[播放器特效] HTML5 MP3音樂盒播放特效</a> </div></li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a target="_blank" title="[選單導航] HTML5酷炫粒子動畫導覽選單特效" href="//m.sbmmt.com/zh-tw/xiazai/js/8069">[選單導航] HTML5酷炫粒子動畫導覽選單特效</a> </div></li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a target="_blank" title="[表單按鈕] jQuery可視化表單拖曳編輯程式碼" href="//m.sbmmt.com/zh-tw/xiazai/js/8068">[表單按鈕] jQuery可視化表單拖曳編輯程式碼</a> </div></li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a target="_blank" title="[播放器特效] VUE.JS仿酷狗音樂播放器代碼" href="//m.sbmmt.com/zh-tw/xiazai/js/8067">[播放器特效] VUE.JS仿酷狗音樂播放器代碼</a> </div></li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a target="_blank" title="[html5特效] 經典html5推箱子小遊戲" href="//m.sbmmt.com/zh-tw/xiazai/js/8066">[html5特效] 經典html5推箱子小遊戲</a> </div></li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a target="_blank" title="[圖片特效] jQuery滾動添加或減少圖片特效" href="//m.sbmmt.com/zh-tw/xiazai/js/8065">[圖片特效] jQuery滾動添加或減少圖片特效</a> </div></li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a target="_blank" title="[相簿特效] CSS3個人相簿封面懸停放大特效" href="//m.sbmmt.com/zh-tw/xiazai/js/8064">[相簿特效] CSS3個人相簿封面懸停放大特效</a> </div></li> </ul> <ul class="twof" style="display:none"> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="//m.sbmmt.com/zh-tw/xiazai/code/8328" title="[前端模板] 家居裝潢清潔維修服務公司網站模板" target="_blank">[前端模板] 家居裝潢清潔維修服務公司網站模板</a> </div></li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="//m.sbmmt.com/zh-tw/xiazai/code/8327" title="[前端模板] 清新配色個人求職履歷引導頁模板" target="_blank">[前端模板] 清新配色個人求職履歷引導頁模板</a> </div></li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="//m.sbmmt.com/zh-tw/xiazai/code/8326" title="[前端模板] 設計師創意求職履歷網頁模板" target="_blank">[前端模板] 設計師創意求職履歷網頁模板</a> </div></li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="//m.sbmmt.com/zh-tw/xiazai/code/8325" title="[前端模板] 現代工程建築公司網站模板" target="_blank">[前端模板] 現代工程建築公司網站模板</a> </div></li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="//m.sbmmt.com/zh-tw/xiazai/code/8324" title="[前端模板] 教育服務機構響應式HTML5模板" target="_blank">[前端模板] 教育服務機構響應式HTML5模板</a> </div></li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="//m.sbmmt.com/zh-tw/xiazai/code/8323" title="[前端模板] 網上電子書店商城網站模板" target="_blank">[前端模板] 網上電子書店商城網站模板</a> </div></li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="//m.sbmmt.com/zh-tw/xiazai/code/8322" title="[前端模板] IT技術解決互聯網公司網站模板" target="_blank">[前端模板] IT技術解決互聯網公司網站模板</a> </div></li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="//m.sbmmt.com/zh-tw/xiazai/code/8321" title="[前端模板] 紫色風格外匯交易服務網站模板" target="_blank">[前端模板] 紫色風格外匯交易服務網站模板</a> </div></li> </ul> <ul class="threef" style="display:none"> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="//m.sbmmt.com/zh-tw/xiazai/sucai/3078" target="_blank" title="[PNG素材] 可愛的夏天元素向量素材(EPS+PNG)">[PNG素材] 可愛的夏天元素向量素材(EPS+PNG)</a> </div></li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="//m.sbmmt.com/zh-tw/xiazai/sucai/3077" target="_blank" title="[PNG素材] 四個紅色的 2023 畢業徽章的向量素材(AI+EPS+PNG)">[PNG素材] 四個紅色的 2023 畢業徽章的向量素材(AI+EPS+PNG)</a> </div></li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="//m.sbmmt.com/zh-tw/xiazai/sucai/3076" target="_blank" title="[banner圖] 唱歌的小鳥和裝滿花朵的推車設計春天banner向量素材(AI+EPS)">[banner圖] 唱歌的小鳥和裝滿花朵的推車設計春天banner向量素材(AI+EPS)</a> </div></li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="//m.sbmmt.com/zh-tw/xiazai/sucai/3075" target="_blank" title="[PNG素材] 金色的畢業帽向量素材(EPS+PNG)">[PNG素材] 金色的畢業帽向量素材(EPS+PNG)</a> </div></li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="//m.sbmmt.com/zh-tw/xiazai/sucai/3074" target="_blank" title="[PNG素材] 黑白風格的山脈圖示向量素材(EPS+PNG)">[PNG素材] 黑白風格的山脈圖示向量素材(EPS+PNG)</a> </div></li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="//m.sbmmt.com/zh-tw/xiazai/sucai/3073" target="_blank" title="[PNG素材] 不同顏色披風和不同姿勢的超級英雄剪影向量素材(EPS+PNG)">[PNG素材] 不同顏色披風和不同姿勢的超級英雄剪影向量素材(EPS+PNG)</a> </div></li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="//m.sbmmt.com/zh-tw/xiazai/sucai/3072" target="_blank" title="[banner圖] 扁平風格的植樹節banner向量素材(AI+EPS)">[banner圖] 扁平風格的植樹節banner向量素材(AI+EPS)</a> </div></li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="//m.sbmmt.com/zh-tw/xiazai/sucai/3071" target="_blank" title="[PNG素材] 九種漫畫風格的爆炸聊天氣泡向量素材(EPS+PNG)">[PNG素材] 九種漫畫風格的爆炸聊天氣泡向量素材(EPS+PNG)</a> </div></li> </ul> <ul class="fourf" style="display:none"> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="//m.sbmmt.com/zh-tw/xiazai/code/8328" target="_blank" title="[前端模板] 家居裝潢清潔維修服務公司網站模板">[前端模板] 家居裝潢清潔維修服務公司網站模板</a> </div></li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="//m.sbmmt.com/zh-tw/xiazai/code/8327" target="_blank" title="[前端模板] 清新配色個人求職履歷引導頁模板">[前端模板] 清新配色個人求職履歷引導頁模板</a> </div></li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="//m.sbmmt.com/zh-tw/xiazai/code/8326" target="_blank" title="[前端模板] 設計師創意求職履歷網頁模板">[前端模板] 設計師創意求職履歷網頁模板</a> </div></li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="//m.sbmmt.com/zh-tw/xiazai/code/8325" target="_blank" title="[前端模板] 現代工程建築公司網站模板">[前端模板] 現代工程建築公司網站模板</a> </div></li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="//m.sbmmt.com/zh-tw/xiazai/code/8324" target="_blank" title="[前端模板] 教育服務機構響應式HTML5模板">[前端模板] 教育服務機構響應式HTML5模板</a> </div></li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="//m.sbmmt.com/zh-tw/xiazai/code/8323" target="_blank" title="[前端模板] 網上電子書店商城網站模板">[前端模板] 網上電子書店商城網站模板</a> </div></li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="//m.sbmmt.com/zh-tw/xiazai/code/8322" target="_blank" title="[前端模板] IT技術解決互聯網公司網站模板">[前端模板] IT技術解決互聯網公司網站模板</a> </div></li> <li> <div class="wzrfourli"> <span class="layui-badge-dots wzrflr"></span> <a href="//m.sbmmt.com/zh-tw/xiazai/code/8321" target="_blank" title="[前端模板] 紫色風格外匯交易服務網站模板">[前端模板] 紫色風格外匯交易服務網站模板</a> </div></li> </ul> </div> </div> </div> </div> <div class="phpFoot"> <div class="phpFootIn"> <div class="phpFootCont"> <div class="phpFootLeft"> <dl> <dt> <a href="//m.sbmmt.com/zh-tw/about/us.html" rel="nofollow" target="_blank" title="關於我們" class="cBlack">關於我們</a> <a href="//m.sbmmt.com/zh-tw/about/disclaimer.html" rel="nofollow" target="_blank" title="免責聲明" class="cBlack">免責聲明</a> <a href="//m.sbmmt.com/zh-tw/update/article_0_1.html" target="_blank" title="Sitemap" class="cBlack">Sitemap</a> <div class="clear"></div> </dt> <dd class="cont1"> PHP中文網：公益線上PHP培訓，幫助PHP學習者快速成長！ </dd> </dl> </div> </div> </div> </div> <input type="hidden" id="verifycode" value="/captcha.html"> <link rel="stylesheet" id="_main-css" href="//m.sbmmt.com/static/css/viewer.min.css?2" type="text/css" media="all"> </body> </html>