1. 사과
2. 바나나
3. 딸기
가고 싶은곳 먹고 싶은"> 08-04_dom-search DOM 객체 검색 과일 click 1. 사과 2. 바나나 3. 딸기 가고 싶은곳, 먹고 싶은거 가고 싶은곳 먹고 싶은"> 08-04_dom-search DOM 객체 검색 과일 click 1. 사과 2. 바나나 3. 딸기 가고 싶은곳, 먹고 싶은거 가고 싶은곳 먹고 싶은"> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>08-04_dom-search</title> <script type="text/javascript"> function change(){ let spanList = document.getElementsByTagName('span'); for(let i=0; i<spanList.length; i++){ spanList[i].style.fontSize='30px'; spanList[i].style.color='red'; } } function onPlace(){ let placeAll = document.querySelectorAll('.place'); for(let i=0; i<placeAll.length; i++){ placeAll[i].style.fontSize='30px'; placeAll[i].style.color='gold'; } } function onFood(){ let FoodAll = document.querySelectorAll('.food'); for(let i=0; i<FoodAll.length; i++){ FoodAll[i].style.fontSize='30px'; FoodAll[i].style.color='green'; } } </script> </head> <body> <h1>DOM 객체 검색</h1> <h2>과일 <button onclick="change()">click</button></h2> <p>1. <span>사과</span></p> <p>2. <span>바나나</span></p> <p>3. <span>딸기</span></p> <br/> <h2>가고 싶은곳, 먹고 싶은거</h2> <p> <button onclick="onPlace()">가고 싶은곳</button> <button onclick="onFood()">먹고 싶은거</button> </p> <p><span class='place'>제주도</span> : <span class="food">흑돼지</span></p> <p><span class='place'>부산</span> : <span class="food">호래기</span></p> <p><span class='place'>광주</span> : <span class="food">육전</span></p> </body> </html>
가고 싶은곳 먹고 싶은"> 08-04_dom-search DOM 객체 검색 과일 click 1. 사과 2. 바나나 3. 딸기 가고 싶은곳, 먹고 싶은거 가고 싶은곳 먹고 싶은"> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>08-04_dom-search</title> <script type="text/javascript"> function change(){ let spanList = document.getElementsByTagName('span'); for(let i=0; i<spanList.length; i++){ spanList[i].style.fontSize='30px'; spanList[i].style.color='red'; } } function onPlace(){ let placeAll = document.querySelectorAll('.place'); for(let i=0; i<placeAll.length; i++){ placeAll[i].style.fontSize='30px'; placeAll[i].style.color='gold'; } } function onFood(){ let FoodAll = document.querySelectorAll('.food'); for(let i=0; i<FoodAll.length; i++){ FoodAll[i].style.fontSize='30px'; FoodAll[i].style.color='green'; } } </script> </head> <body> <h1>DOM 객체 검색</h1> <h2>과일 <button onclick="change()">click</button></h2> <p>1. <span>사과</span></p> <p>2. <span>바나나</span></p> <p>3. <span>딸기</span></p> <br/> <h2>가고 싶은곳, 먹고 싶은거</h2> <p> <button onclick="onPlace()">가고 싶은곳</button> <button onclick="onFood()">먹고 싶은거</button> </p> <p><span class='place'>제주도</span> : <span class="food">흑돼지</span></p> <p><span class='place'>부산</span> : <span class="food">호래기</span></p> <p><span class='place'>광주</span> : <span class="food">육전</span></p> </body> </html>
가고 싶은곳 먹고 싶은"> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>08-04_dom-search</title> <script type="text/javascript"> function change(){ let spanList = document.getElementsByTagName('span'); for(let i=0; i<spanList.length; i++){ spanList[i].style.fontSize='30px'; spanList[i].style.color='red'; } } function onPlace(){ let placeAll = document.querySelectorAll('.place'); for(let i=0; i<placeAll.length; i++){ placeAll[i].style.fontSize='30px'; placeAll[i].style.color='gold'; } } function onFood(){ let FoodAll = document.querySelectorAll('.food'); for(let i=0; i<FoodAll.length; i++){ FoodAll[i].style.fontSize='30px'; FoodAll[i].style.color='green'; } } </script> </head> <body> <h1>DOM 객체 검색</h1> <h2>과일 <button onclick="change()">click</button></h2> <p>1. <span>사과</span></p> <p>2. <span>바나나</span></p> <p>3. <span>딸기</span></p> <br/> <h2>가고 싶은곳, 먹고 싶은거</h2> <p> <button onclick="onPlace()">가고 싶은곳</button> <button onclick="onFood()">먹고 싶은거</button> </p> <p><span class='place'>제주도</span> : <span class="food">흑돼지</span></p> <p><span class='place'>부산</span> : <span class="food">호래기</span></p> <p><span class='place'>광주</span> : <span class="food">육전</span></p> </body> </html>
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>08-04_dom-search</title> <script type="text/javascript"> function change(){ let spanList = document.getElementsByTagName('span'); for(let i=0; i<spanList.length; i++){ spanList[i].style.fontSize='30px'; spanList[i].style.color='red'; } } function onPlace(){ let placeAll = document.querySelectorAll('.place'); for(let i=0; i<placeAll.length; i++){ placeAll[i].style.fontSize='30px'; placeAll[i].style.color='gold'; } } function onFood(){ let FoodAll = document.querySelectorAll('.food'); for(let i=0; i<FoodAll.length; i++){ FoodAll[i].style.fontSize='30px'; FoodAll[i].style.color='green'; } } </script> </head> <body> <h1>DOM 객체 검색</h1> <h2>과일 <button onclick="change()">click</button></h2> <p>1. <span>사과</span></p> <p>2. <span>바나나</span></p> <p>3. <span>딸기</span></p> <br/> <h2>가고 싶은곳, 먹고 싶은거</h2> <p> <button onclick="onPlace()">가고 싶은곳</button> <button onclick="onFood()">먹고 싶은거</button> </p> <p><span class='place'>제주도</span> : <span class="food">흑돼지</span></p> <p><span class='place'>부산</span> : <span class="food">호래기</span></p> <p><span class='place'>광주</span> : <span class="food">육전</span></p> </body> </html>