[0324 개발일지] javascript 2/3
1. 학습한 내용
style.css 사용
ipsum image 사이트에서 이미지 찾기
css background image 태그 찾아 사용하면 레이어 표현도 가능
style 안의 태그를
style.css 파일에 붙여넣고
기존 자리에는 아래 링크 붙여넣기<link rel="stylesheet" href="style.css">
비교연산자
<script> 비교연산자
console.log(1<1);
console.log(1===1);
console.log(1!==1); (1과 1이 같지않으면)
</script>
조건문(conditional statement)
<h1>Conditional Statements</h1>
<script>
console.log(1); 조건
if(true){
console.log('2 - true'); 맞으면 실행
} else {
console.log('2 - false'); 그 외는 실행안됨
}
console.log(3);
반복문(Loop)
<script>
console.log(1);
for(let i=0; i<3 ;i=i+1){ 약속덩어리
console.log(2);
console.log(3);
}
console.log(4);
</script>
배열+반복(Array+Loop)
</script>
<h1>array+loop</h1>
<script>
var topics = ['html', 'css', 'js'];
for(let i=0; i<topic.length; (토픽의길이) i=i+1){
console.log('i=>',i);
}
document.write ('<li>'+topics[i]+'</li>'); (화면에나타남)
-> 리스트를 다 꺼내서 컴퓨터에게 처리를 위임
</script>
if ~ else 조건문으로 로그인 창
<script>
let input_id = prompt('아이디가?');
if(input_id === 'jiwon'){
alert(input_id+'님 반갑습니다');
}
else {
alert('누구세욘')
}
</script>
night에서 day로 반응하는 버튼
<input type="button" id="dnbtn" value="night" onclick="
let button = document.querySelector('#dnbtn')
if (button.value === 'night'){
document.querySelector('body').style.backgroundColor='black';
document.querySelector('body').style.color='white';
button.value = 'day';
} else {
document.querySelector('body').style.backgroundColor='yellow';
document.querySelector('body').style.color='black';
button.value = 'night';
}
">
2. 어려웠던 점
여기서 = 는 동등하다는 의미가 아니다.
=== 가 동등하다는 의미.
조건문까지는 재미있고 간단해보였는데 ..
3. 해결방법
주말에 다시 복습 또 복습
4. 학습소감
if~else를 직접 적용해서 반응하는 버튼을 만든 것이 흥미로웠다.
쌩초보에게는 점점 어려워지는 것 같아서 잠시라도 눈을 떼면 안될 것 같다.
; { ( " ' 가 난무하는 스크립트를 보니 머리가 아파옴.
Author And Source
이 문제에 관하여([0324 개발일지] javascript 2/3), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://velog.io/@jwon11/0324-개발일지-javascript-23저자 귀속: 원작자 정보가 원작자 URL에 포함되어 있으며 저작권은 원작자 소유입니다.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)