PIXNET Logo登入

Bug倉庫 // 程式日記

跳到主文

Bug倉庫 // 程式日記已經搬家到 https://bugswarehouse.blogspot.tw/ 了喔

部落格全站分類：數位生活

  • 相簿
  • 部落格
  • 留言
  • 名片
  • 9月 02 週六 201700:12

  • childNode和nodeValue，我的html是一棵樹，啊哩啊紮都是節點


<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<ul>
<li>aa</li>
<li>bb</li>
<li>cc</li>
<li>dd</li>
<li>ee</li>
</ul>
<script type="text/javascript">
var value=document.getElementsByTagName('li')[2].childNodes[0].nodeValue;
document.write(value);
</script>
</body>
</html>
(繼續閱讀...)
文章標籤

Jerry 發表在 痞客邦 留言(0) 人氣(0)

  • 個人分類：Javascript
▲top
  • 9月 02 週六 201700:12

  • childNode和nodeValue，我的html是一棵樹，啊哩啊紮都是節點


<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<ul>
<li>aa</li>
<li>bb</li>
<li>cc</li>
<li>dd</li>
<li>ee</li>
</ul>
<script type="text/javascript">
var value=document.getElementsByTagName('li')[2].childNodes[0].nodeValue;
document.write(value);
</script>
</body>
</html>
(繼續閱讀...)
文章標籤

Jerry 發表在 痞客邦 留言(0) 人氣(7)

  • 個人分類：Javascript
▲top
  • 9月 01 週五 201723:58

  • previousSibling、nextSibling、firstChild、lastChild，請注意空白字元


<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<ul><li>aa</li><li>bb</li><li>cc</li><li>dd</li><li>ee</li></ul>
<!-- 註：空白字元會被算進去 -->
<script type="text/javascript">
var cc= document.getElementsByTagName('li')[2];
var ul=document.getElementsByTagName('ul')[0];
document.write('cc前一個是'+cc.previousSibling.textContent+'<br>');
document.write('cc後一個是'+cc.nextSibling.textContent+'<br>');
document.write('ul的第一個孩子是'+ul.firstChild.textContent+'<br>');
document.write('ul的最後一個孩子是'+ul.lastChild.textContent+'<br>');
</script>
</body>
</html>
(繼續閱讀...)
文章標籤

Jerry 發表在 痞客邦 留言(0) 人氣(0)

  • 個人分類：Javascript
▲top
  • 9月 01 週五 201723:58

  • previousSibling、nextSibling、firstChild、lastChild，請注意空白字元


<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<ul><li>aa</li><li>bb</li><li>cc</li><li>dd</li><li>ee</li></ul>
<!-- 註：空白字元會被算進去 -->
<script type="text/javascript">
var cc= document.getElementsByTagName('li')[2];
var ul=document.getElementsByTagName('ul')[0];
document.write('cc前一個是'+cc.previousSibling.textContent+'<br>');
document.write('cc後一個是'+cc.nextSibling.textContent+'<br>');
document.write('ul的第一個孩子是'+ul.firstChild.textContent+'<br>');
document.write('ul的最後一個孩子是'+ul.lastChild.textContent+'<br>');
</script>
</body>
</html>
(繼續閱讀...)
文章標籤

Jerry 發表在 痞客邦 留言(0) 人氣(12)

  • 個人分類：Javascript
▲top
  • 9月 01 週五 201723:49

  • querySelector和querySelectorAll，直接用css選取器方式


<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<ul class="ulooo">
<li>11</li>
<li>22</li>
<li>33</li>
<li>44</li>
<li>55</li>
<li>66</li>
</ul>
<script type="text/javascript">
document.write('第一個被選到的是：'+document.querySelector('.ulooo li').textContent+'<br>');
document.write('總共被選到的數量：'+document.querySelectorAll('.ulooo li').length);
</script>
</body>
</html>
(繼續閱讀...)
文章標籤

Jerry 發表在 痞客邦 留言(0) 人氣(0)

  • 個人分類：Javascript
▲top
  • 9月 01 週五 201723:49

  • querySelector和querySelectorAll，直接用css選取器方式


<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<ul class="ulooo">
<li>11</li>
<li>22</li>
<li>33</li>
<li>44</li>
<li>55</li>
<li>66</li>
</ul>
<script type="text/javascript">
document.write('第一個被選到的是：'+document.querySelector('.ulooo li').textContent+'<br>');
document.write('總共被選到的數量：'+document.querySelectorAll('.ulooo li').length);
</script>
</body>
</html>
(繼續閱讀...)
文章標籤

Jerry 發表在 痞客邦 留言(0) 人氣(435)

  • 個人分類：Javascript
▲top
  • 9月 01 週五 201716:50

  • do/while迴圈，做完再判斷的意思


<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script type="text/javascript">
var i = 0;
do{
document.write('很重要所以要跑三次，已經跑了'+(i+1)+'次<br>');
i++;
}while(i<3);
if(i>=3){
document.write('三次結束囉');
}
</script>
</body>
</html>
(繼續閱讀...)
文章標籤

Jerry 發表在 痞客邦 留言(0) 人氣(9)

  • 個人分類：Javascript
▲top
  • 9月 01 週五 201716:50

  • do/while迴圈，做完再判斷的意思


<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script type="text/javascript">
var i = 0;
do{
document.write('很重要所以要跑三次，已經跑了'+(i+1)+'次<br>');
i++;
}while(i<3);
if(i>=3){
document.write('三次結束囉');
}
</script>
</body>
</html>
(繼續閱讀...)
文章標籤

Jerry 發表在 痞客邦 留言(0) 人氣(0)

  • 個人分類：Javascript
▲top
  • 9月 01 週五 201716:38

  • 面試會考：寫出5的倍數的乘法表


<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script type="text/javascript">
var i = 1;
while(i<10){
document.write('5x'+i+'='+i*5+'<br>');
i++;
}
</script>
</body>
</html>
(繼續閱讀...)
文章標籤

Jerry 發表在 痞客邦 留言(0) 人氣(9)

  • 個人分類：Javascript
▲top
  • 9月 01 週五 201716:38

  • 面試會考：寫出5的倍數的乘法表


<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script type="text/javascript">
var i = 1;
while(i<10){
document.write('5x'+i+'='+i*5+'<br>');
i++;
}
</script>
</body>
</html>
(繼續閱讀...)
文章標籤

Jerry 發表在 痞客邦 留言(0) 人氣(0)

  • 個人分類：Javascript
▲top
«1...32333437»

文章搜尋

文章搜尋

文章分類

toggle 伺服器架設 (1)
  • AWS (2)
toggle 伺服器架設 (1)
  • AWS (2)
toggle 前端框架 (2)
  • Vue.js (26)
  • Angular.js (2)
toggle 前端框架 (2)
  • Vue.js (26)
  • Angular.js (2)
toggle HTML與開發工具 (2)
  • HTML (2)
  • 開發工具相關 (8)
toggle HTML與開發工具 (2)
  • HTML (2)
  • 開發工具相關 (8)
toggle CSS與framework (4)
  • CSS (9)
  • Bootstrap (26)
  • CSS插件 (1)
  • CSS工具 (3)
toggle CSS與framework (4)
  • CSS (9)
  • Bootstrap (26)
  • CSS插件 (1)
  • CSS工具 (3)
toggle JS與函式庫 (3)
  • js套件 (1)
  • jQuery (28)
  • Javascript (46)
toggle JS與函式庫 (3)
  • js套件 (1)
  • jQuery (28)
  • Javascript (46)
toggle 後端框架 (1)
  • Laravel (26)
toggle 後端框架 (1)
  • Laravel (26)
  • 自學資源 (1)
  • 自學資源 (1)
  • 未分類文章 (1)

文章分類

toggle 伺服器架設 (1)
  • AWS (2)
toggle 伺服器架設 (1)
  • AWS (2)
toggle 前端框架 (2)
  • Vue.js (26)
  • Angular.js (2)
toggle 前端框架 (2)
  • Vue.js (26)
  • Angular.js (2)
toggle HTML與開發工具 (2)
  • HTML (2)
  • 開發工具相關 (8)
toggle HTML與開發工具 (2)
  • HTML (2)
  • 開發工具相關 (8)
toggle CSS與framework (4)
  • CSS (9)
  • Bootstrap (26)
  • CSS插件 (1)
  • CSS工具 (3)
toggle CSS與framework (4)
  • CSS (9)
  • Bootstrap (26)
  • CSS插件 (1)
  • CSS工具 (3)
toggle JS與函式庫 (3)
  • js套件 (1)
  • jQuery (28)
  • Javascript (46)
toggle JS與函式庫 (3)
  • js套件 (1)
  • jQuery (28)
  • Javascript (46)
toggle 後端框架 (1)
  • Laravel (26)
toggle 後端框架 (1)
  • Laravel (26)
  • 自學資源 (1)
  • 自學資源 (1)
  • 未分類文章 (1)

最新文章

  • 部落格搬家囉！ 網址：https://bugswarehouse.blogspot.tw/
  • 部落格搬家囉！ 網址：https://bugswarehouse.blogspot.tw/
  • 用vue寫出：有頁碼表格，可排序，搜尋，限制出現之資料
  • 用vue寫出：有頁碼表格，可排序，搜尋，限制出現之資料
  • 使用laravel內建的vue componet
  • 使用laravel內建的vue componet
  • Vuetify
  • Vuetify
  • VS code安裝後相關
  • VS code安裝後相關

最新文章

  • 部落格搬家囉！ 網址：https://bugswarehouse.blogspot.tw/
  • 部落格搬家囉！ 網址：https://bugswarehouse.blogspot.tw/
  • 用vue寫出：有頁碼表格，可排序，搜尋，限制出現之資料
  • 用vue寫出：有頁碼表格，可排序，搜尋，限制出現之資料
  • 使用laravel內建的vue componet
  • 使用laravel內建的vue componet
  • Vuetify
  • Vuetify
  • VS code安裝後相關
  • VS code安裝後相關

個人資訊

Jerry
暱稱：
Jerry
分類：
數位生活
好友：
累積中
地區：

個人資訊

Jerry
暱稱：
Jerry
分類：
數位生活
好友：
累積中
地區：

文章精選

文章精選

熱門文章

  • (1,572)用vue寫購物車（小計、總計、數量計算）
  • (474)用js寫一個時鐘，用Date物件
  • (388)Autoprefixer CSS 自動加前綴工具（以符合各瀏覽器）
  • (44)過濾器，排列方式依據名稱字首，1與-1切換升冪與降冪
  • (43)createElement、createTextNode、appendChild，動態新增元素組合技
  • (13)Laravel，view視圖
  • (9)面試會考：寫出5的倍數的乘法表
  • (7)childNode和nodeValue，我的html是一棵樹，啊哩啊紮都是節點
  • (7)counter-increment與counter-rest，文章分段可用
  • (3)on綁定傳入四個參數，事件物件的type和data.自定義

熱門文章

  • (1,572)用vue寫購物車（小計、總計、數量計算）
  • (474)用js寫一個時鐘，用Date物件
  • (388)Autoprefixer CSS 自動加前綴工具（以符合各瀏覽器）
  • (44)過濾器，排列方式依據名稱字首，1與-1切換升冪與降冪
  • (43)createElement、createTextNode、appendChild，動態新增元素組合技
  • (13)Laravel，view視圖
  • (9)面試會考：寫出5的倍數的乘法表
  • (7)childNode和nodeValue，我的html是一棵樹，啊哩啊紮都是節點
  • (7)counter-increment與counter-rest，文章分段可用
  • (3)on綁定傳入四個參數，事件物件的type和data.自定義

最新留言

    最新留言

      動態訂閱

      動態訂閱

      誰來我家

      誰來我家

      參觀人氣

      • 本日人氣：
      • 累積人氣：

      參觀人氣

      • 本日人氣：
      • 累積人氣：