본문 바로가기

분류 전체보기131

DOM-querySelector 오늘은 querySelector에 대해서 알아볼텐데요~ querySelector는 객체를 조회하는 메소드라고 볼 수 있습니다. 그럼 바로 코딩을 통해 알아보도록 하겠습니다. 결과화면은 다음과 같게 나오게 됩니다. 더 나아가서 querySelectorAll의 메소드에 대해 알아보겠습니다. querySelectorAll은 특정속성의 값을 전부 선택하는 메소드라고 보면 되겠습니다. for(var name in li) 는 for문의 다른 형태 인데요 name=0 부터 li의 마지막 까지 반복문을 실행한다고 보시면 될것 같아요. for(name=0; name< li.length ; name++) 과 같은 의미라고 보시면 될것 같아요! 그럼 오늘 포스팅은 여기까지 하도록 하겠습니다~ 감사합니다! 2017. 5. 5.
DOM-getElementById 클래스 이름으로 선택하는것을 해보았으니 이번엔 ID로 요소 선택하는 방법을 알아보도록 하겠습니다. 메소드는 document.getElentById 입니다. 앞선 메소드와는 다른점이 있죠??ㅎㅎ 이번엔 메소드에 Element만 들어간다는 점입니다. s가 빠졌죠. class는 같은 이름으로 여러가지를 쓸 수 있지만 ID는 한가지 만을 써야 된다는 점을 알 수 있습니다. 그럼 마찬가지로 코딩을 통해 알아보도록 하겠습니다. 결과화면은 다음과 같습니다. 감사합니다~ 2017. 5. 5.
DOM-getElementsByClassName 오늘은 getElementsByClassName 에 대해 알아보도록 하겠습니다. 영어 그대로 클래스의 이름을 선택(?)/추출(?) 하는 메소드입니다. 그럼 코딩을 통해 알아보도록 하겠습니다. 결과화면은 다음과 같습니다. 감사합니다~ 2017. 5. 5.
DOM-getElementsByTagName 오늘은 JavaScript에서 DOM에 대해 알아보도록 하겠습니다. DOM은 Document Object Model 의 약자로 웹페이지를 자바스크립트로 제어하기 위한 객체 모델을 의미합니다. 첫번째로 getElementsByTagName에 대해 알아보겠습니다. getElementsByTagName은 인자로 전달된 태그명에 해당하는 객체들을 찾아서 그 리스트를 NodeList라는 유사 배열에 담아서 반환합니다. 그럼 거두절미 하고 코딩을 통해 알아보도록 하겠습니다. 우선 getElementsByTagName는 document라는 객체에 속해있습니다. 따라서 사용할땐 document.getElementsByTagName 으로 사용하면 됩니다. 결과화면은 다음과 같이 나오게 됩니다. 이해가 안가시면 소스를 차.. 2017. 5. 5.