當前位置：首頁 > 前端技术 > javascript >内容正文

javascript

js json制表符报错_JS自学_常见错误复盘

發布時間：2024/9/15 javascript 32 豆豆

生活随笔收集整理的這篇文章主要介紹了 js json制表符报错_JS自学_常见错误复盘小編覺得挺不錯的,現在分享給大家,幫大家做個參考.

> JavaScript作為Web的最主流編程語言之一，自學的時候還是要盡快拿下。

文章適合于同樣是初學或即將開始學習JS的小伙伴，你將看到鮮活的真實錯誤案例，還有學習的注意事項。

JavaScript自學概述：

錯誤案例：

1、JSON[解析JSON數據填到標簽內]

<body><script type="text/javascript">//步驟1、創建JS數組數據var stuarr = {"totalnum":3,"students":[{"uname":"zs", "uage":"12", "city":"shanghai"},{"uname":"ls", "uage":"11", "city":"shanghai"},{"uname":"ww", "uage":"13", "city":"shanghai"}]};//步驟4、遍歷數據寫到表格中window.onload = function(){var btnElt = document.getElementById("mybtn");btnElt.onclick=function(){ //★錯誤1_onclick不能加()var html = "";//alert(stuarr["students"].length);var emps = stuarr["students"];for(var i=0; i < emps.length; i++){ //★錯誤2_只能用;號不能用,號；且i要有起始值！html += "<tr>";html += "<td>" + emps[i].uname+"</td>";html += "<td>" + emps[i].uage+"</td>";html += "<td>" + emps[i].city+"</td>"; //★錯誤3_引用屬性不能既用.又用["city"]html += "</tr>";};//alert(html);用來調試用//★錯誤4_表單寫入也不能用value，而用innerHTMLdocument.getElementById("mytbody").innerHTML=html;//span不能用value而應該用innerHTML//★錯誤5_一定要放到btnElt.onclick的事件內，否則頁面未加載完成就會執行，會報錯document.getElementById("myspan").innerHTML = stuarr.totalnum;}} </script><input type="button", value="將JSON數據寫進表格中", id="mybtn" /><h2>員工信息列表</h2> <hr><table border="1px", width="50%"><tr><th>姓名</th><th>年齡</th><th>城市</th></tr><tbody id="mytbody"></tbody></table>總數等于<span id="myspan">0</span>個人</body> </html>

復盤備注：

2、文本框內的字符串經過刪掉前后空格后顯示在頁面上

window.onload = function(){var btn = document.getElementById("mybtn");btn.onclick = function(){var username = document.getElementById("mytxt").value//★錯誤1_JS的代碼末尾最好都加封號username = username.trim();alert("-->" + username + "<--"); } window.onload = function(){var btn = document.getElementById("mybtn");btn.onclick = function(){var username = document.getElementById("mytxt").value;//★錯誤1_JS的代碼末尾最好都加封號username = username.trim();alert("-->" + username + "<--"); }

復盤備注：解決這個錯誤花了很長時間...網上查了對JS代碼的封號有很多討論，其中一部分場景一定要加封號，以后還是盡量都加封號吧。

3、聲明兩個函數實現文本框內容變遷影響

window.onload=function(){document.getElementById("mybtn").onclick = function(){var usernameElt1 = document.getElementById("mytxt1");usernameElt2 = document.getElementById("mytxt2");usernameElt2.value = usernameElt1.value;}document.getElementById("mytxt1").onchange = function(){ //★錯誤1_如果是單獨的函數，不要拿另一個注冊函數的全局變量，要單獨聲明usernameElt2 = document.getElementById("mytxt2");usernameElt2.value=""} } window.onload=function(){document.getElementById("mybtn").onclick = function(){var usernameElt1 = document.getElementById("mytxt1");var usernameElt2 = document.getElementById("mytxt2");usernameElt2.value = usernameElt1.value;}document.getElementById("mytxt1").onchange = function(){//★錯誤1_如果是單獨的函數，不要拿另一個注冊函數的全局變量，要單獨聲明var usernameElt2 = document.getElementById("mytxt2");usernameElt2.value=""} }

復盤備注：本質要理解函數注冊很可能只在方法區內存占用空間，還沒有實際可調用的對象的堆內存。

最后，謝謝大家查看，希望幫忙點贊評論~

總結

以上是生活随笔為你收集整理的js json制表符报错_JS自学_常见错误复盘的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。

上一篇： in 用不用索引_MySQL 索引最佳实
下一篇：已知p是一个指向类a的数据成员m的指针_