Today I Learning---
바닐라 자바스크립트로 다양한 구현을 시도하고 싶기에
기초부터 탄탄히 쌓기로 한다.
(코딩애플 형님꺼 참고)
자바스크립트란?
단순히 이야기하자면, 웹개발을 할 때 쓰이는 것이 주 목적이다.
웹환경에서 자바스크립트의 주 목적은 HTML 조작과 변경으로 알고 있다.
if, for, var, function, array, object, class..
html 조작해보기
글자 변경해보기!!
- 바꾸고 싶은 html요소의 id를 적어줌
- 무엇을 바꿀지 뒤에 적음
<body>
<h2 id="hello">안녕하세요</h2>
<script>
document.getElementById('hello').innerHTML = '하이루';
</script>
</body>위 코드를 해석하자면,
document(html 문서).(dot은 '~의').getElementById()(바꾸고싶은녀석의 아이디를 가져와).???(이루고싶은목적) =(대입 우측을 좌측에 적용) '적용할것'
만약 innerHTML 자리에 스타일을 적용시키고 싶으면 구글링 바로 치기.(Ex. style.color 등등)
button 이용해서 alert 생성하기!!!
<body>
<div class="alert-box">Alert 박스</div>
<button onclick = "script 기입">버튼<button>
</body>onclick은 버튼을 클릭했을때 무엇을 실행시킬건지 담는 공간임
(근데 그안에 길쭉한 스크립트를 작성하면 매우 복잡하니까 바디 안에 ui작성한 것 밑에!!다가 script를 작성해주는것이 굿굿)
스크립트에 맨 위 document.getElement---블라블라 작성하고, 이루고싶은 목적에 display:none 혹은 block 적용하면은 나타나고 사라짐을 실행시킬 수 있게 된돠잉!
function 함수는 언제 쓰임?
길어지는 스크립트를 하나로 묶고 싶을때 사용한다.
function 담고싶은이름작성() {
//여기에다 스크립트 코드 작성
}
담고싶은이름작성();
//위에서 담고싶은 코드를 작성했으니, 설정한 이름을 가지고 사용할 수 있게 된다.이어서...
온전히 나를 위한 코딩 기록 공간