1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 | <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> <style type="text/css"> th{ background-color: green; color: white; } </style> </head> <body> <h1>포털 사이트</h1> "열기"버튼을 클릭하면 해당 홈페이지를 새창에서 볼 수 있습니다. <br><br> <table border="1" style="width: 350px; height: 180px"> <tr> <th align="center">네이버</th> <td align="center">http://www.naver.com/</td> <td align="center"> <button type="button" onclick="link(this)">열기</button> </td> </tr> <tr> <th align="center">다음</th> <td align="center">http://www.daum.net/</td> <td align="center"> <button type="button" onclick="link(this)">열기</button> </td> </tr> <tr> <th align="center">줌</th> <td align="center">http://zum.com/</td> <td align="center"><button type="button" onclick="link(this)">열기</button></td> </tr> </table> <script type="text/javascript"> function link(url) { var parent = url.parentNode.parentNode.childNodes; //alert(parent[3].innerHTML); //주소값 받아옴 window.open(parent[3].innerHTML); } </script> </body> </html> | cs |
'IT Study > Web' 카테고리의 다른 글
| [JavaScript] DOM - Node 예제 (0) | 2018.08.06 |
|---|---|
| [JavaScript] DOM (0) | 2018.08.06 |
| [JavaScript] Node 응용 예제 (0) | 2018.08.06 |
| [JavaScript] 기본 문법 - Node관련 예제 (0) | 2018.08.06 |
| [JavaScript] 기본 문법 - key이벤트, mouse이벤트, onBlur (0) | 2018.08.06 |