security/자바스크립트4 자바스크립크 개발 4 - DOM(2) 이번에는 DOM 개발 2를 해 볼 것이다. 개발 이미지는 다음과 같다. 실행 버튼을 누르면 example color 1 박스가 빨갛게 변한다. 이번에는 getElementsByClassName()을 사용할 것이다. getElementsByClassName()을 사용하면 모든 요소 콜렉션을 오브젝트로 리턴할 수 있다. 이렇게 예제가 있다. getElementsByClassName()을 이용한 예제이다. 이를 이용해서 개발을 한다. 2020. 7. 26. 자바스크립트 개발 3 - DOM(1) 이번에는 DOM을 써서 개발을 진행해 볼 것이다. Button을 클릭하면 계속 Good!이 출력하게 한다. 이때 insertAdjacentHTML을 사용한다. https://www.w3schools.com/JSREF/met_node_insertadjacenthtml.asp 이렇게 만들기 위한 코드는 다음과 같다. 여기서 insertAdjacentHTML을 사용하면 앞의 것처럼 Insert a paragraph버튼을 누르면 계속 My new paragraph 나온다. 이것을 응용하면 될 것이다. 2020. 7. 26. 자바스크립트 개발 2 - Bom 개발할 페이지는 다음과 같다. 여기서는 Bom을 사용할 것이다. Try it 이라는 버튼을 누르면 다음과 같은 alert 창이 뜨게 한다. 여기서 press a button! 이라는 글자가 출력되게 한다. 또한 확인, 취소 버튼이 나오게 만든다. 확인 버튼을 누르면 You pressed OK! 를 출력하도록 한다. 취소 버튼을 누르면 You pressed Cancel! 을 출력하게 한다. 그리고 location을 이용해서 다음을 출력하게 해준다. 코드는 다음과 같다. 2020. 7. 23. 자바스크립트 개발 1 - 자바스크립트 퀴즈 만들기 자바스크립트로 개발을 진행해보았다. 자바스크립트 문법 중에서 폼, 함수, 객체, 배열등을 사용해서 개발을 해보았다. 화면에서 보이는 것은 이렇게 만들어 놓았다. 이름을 적지 않으면 이렇게 창에 뜨게 했다. Name must be filled out 이라고 뜨게 해두었다. 그리고 자바스크립트 문법 문제를 만들어서 라디오 버튼을 만들고 Check 버튼을 클릭하면 정답일 때는 Correct를 오답일 때는 Wrong을 나오게 했다. html과 자바스크립트를 이용해서 이렇게 만든 것이다. 그래서 만든 코드는 다음과 같다 2020. 7. 18. 이전 1 다음
