웹요소의 내용을 수정하는 innerText, innerHTML프로퍼티

자바스크립트에서는 웹요소에 내용도 수정할 수 있다.
가장쉬운 방법은 innerText, innerHTML 프로퍼티를 사용하는 방법이다.
innerText프로퍼티는 텍스트 내용을 표시하고
innerHTML프로퍼티는 태그까지 반영하여 표시한다.
innerText, innerHTML프로퍼티는 선택한 태그 안에 내용을 바꾸는
역할을 하는 프로퍼티이다.

    [기본형]
    요소명.innerText ='내용'
    요소명.innerHTML ='내용'
    
    

해당버튼을 누르면 현재시간과 날짜가 뜬다.
옆을 누르면 뜬 날짜와 시간이 기울여진다
em은 글자기울기이다.

속성을 가져오거나 수정하는 getAttribute(), setAttribute()메서드

웹 요소를 문서에 삽입할때 태그 속성을 함께 사용하면
DOM트리에 속성노드가 추가되면서 속성값이 지정된다.
이때 속성에 접근하려면 getAttribute()를 사용하고,
속성을 수정하려면 setAttribute()메서드를 사용한다.

    [기본형]
    요소명 getAttribute('속성명')
    :선택한 요소의 해당 속성명에 들어있는 값을 반환한다.

    요소명 .setAttribute('속성명','값')
    :선택한 요소의 해당 속성을 지정한 속성값으로 바꾼다.
    만약 해당 속성이 태그에 없다면 속성과 속성값을 새로 추가한다.

+getAttribute()예제


이미지를 갖고온다.

무조건 속성에 접근해야하므로 커리셀렉터로 이미지 태그를
선택한 것이다.


선택한 이미지 태그의 src속성과 alt속성을 출력

+setAttribute()예제

html에 onclick넣어줌

누르면 다른 사진으로 변경이 된다.

js