강의복습 jQuery, Javascript

<input type="text" value="이지훈" id="myName">

input 박스 안의 값을 가져오고 싶을 땐

jQuery

$('#myName').val();

Javascript

document.getElementById('myName').value

박스 숨기기 / 보이기

jQuery

$('#myName).hide(); >> 숨기기
$('#myName).hide(); >> 보이기

Javascript

document.getElementById('myName').style.display = 'none'; >> 숨기기
document.getElementById('myName').style.display = 'block'; >> 보이기 

<button id="Btn">버튼입니다</button>

버튼 박스 안의 텍스트를 바꾸고 싶을 땐

jQuery

$('#Btn').text('바꾸고 싶은 텍스트')

Javascript

document.getElementById('Btn').innerText = "바꾸고 싶은 텍스트"; 
>> 태그 입력시 태그도 문자취급되어 출력
document.getElementById('Btn').innerHTML = "바꾸고 싶은 텍스트";
>> 태그 입력시 태그는 출력되지 않음

태그를 덧붙이고 싶을 때

jQuery

let temp_html = `<button>이걸 넣을겁니다</button>`
$('#Btn').append(temp_html)

Javascript

let temp_html = document.createElement('button') >> 버튼 태그 생성을 변수로 지정
let temp_html_text = temp_html.innerHTML = '이걸 넣을겁니다'; >> 위 버튼 안의 텍스트 지정
document.getElementById('Btn').append(temp_html); >> 태그 덧붙이기

Javascript의 append는 한 번만 되는게 의아해서 계속 시도해보고 알아본 결과
jQuery에서는 append가 여러번 가능하지만 Javascript는 한 번만 되고 만다.
이는 reflow와 repaint와 관련이 있다고 한다.
아직은 잘 이해가 안되는 부분들이니 일단 다음 강의를 듣는 걸로..