데이터 타입 typeof
javascript 에서 '= ' 은 안에 넣어라 라는 뜻이다.
*함수는 데이터 처리전 저장 후 내가 사용하고 싶을때 사용 할수 있다.
사용하려면 사용한다는 명령을 줘야한다.
()안에 변수를 줄수있다.
sum(1+2+3);
function sum(a,b,c){
return a+b+c;
}
a= sum(3,4,5);
console.log(typeof(a));
변수는 데이터 타입이 있어야 사용할수 있다.
*return 값은 계산은 해서 담아두는 역할이다. 쓰려면 꺼내서 써야한다.
*객체 (object)는 결과물!
핸드폰이라는 객체 안에 볼륨키 전원키 등 기능키들이 있다.
핸드폰,볼륨크게 하고 싶을때 ()메서드 안에 모션을 준다.
document 객체 querySelector() 은 매서드
<script type="text/javascript">
function btnEvent(){
text = document.querySelector('#text');
list = document.querySelector('.card_list');
li = document.createElement('li');
li.innerHTML=text.value;
box=document.createElement('button');
box.innerHTML='X';
box.onclick=function(){
list.removeChild(this.parentNode);
}
li.appendChild(box);
list.appendChild(li);
}
function rolling(){
list = document.querySelector('.card_list');
li =document.querySelectorAll('.card_list>li');
list.appendChild(li[0]);
}
setInterval( rolling , 2000);
</script>
이런식으로 코드를 짜면 인기 검색어 처럼 만들수있을거 같다. 완벽하진 않지만 원리는 알거같다.
*document.getElementByClassName 을 사용하면 class를 로 뮦은 애들이 배열되어 불러진다.
어제 그림이 움직이는 효과을 넣을때 document.qurySelectAll('#text>li') 를 썼던거랑 같은 효과를 가져 왔다.
li=document.getElementByClassName('list') li에 class로 list로 주고 저렇게 코드를 주고
나중에 내가원하는 위치 3번째를 원하면 ( li [2]) 를 사용하면 된다.
*Math Object:Math.random();
*[Javascript] 반올림(round), 올림(ceil), 내림(floor) - 소수점, 음수,자리수 지정
<input id="btn" type="button" value="★" onclick="fat()">
<script type="text/javascript">
function fat() {
var jbRandom = Math.floor(Math.random()*100);
document.write(jbRandom);
console.log(jbRandom);
}
</script>
*랜덤 수 생성 코드 이다. 간단하게 버튼을 눌렀을때 숫자가 랜덤으로 나오게 하는 방법이다.
math,random() 만 줄경우 1보다 작고0보다 큰 수가 나온다. 여기서 math.floor를 쓰면 소수점 첫번째 자리부터 버리기
때문에 *100 을 줘서 만들었다.
String Object:String.replace();
var str = 'Twas the night before Xmas...';
var newstr = str.replace(/xmas/i, 'Christmas');
console.log(newstr);
는 내가 원하는 부분을 다르게 바꿀수 있다. replace를 쓰면 가장 첫번째 것만 바뀜으로 모든 부분을 바꾸길 원하면
replaceAll을 사용하면 된다.
Document Object:Element.getAttribute();
let div1 = document.getElementById("div1");
let align = div1.getAttribute("align");
alert(align); // id가 "div1"인 요소(element)의 align 값을 보여줍니다.
getAttribute는 내가 원하는 요소(엘리먼트) 값을 가져오는 역할을 한다.
속성이 존재 하지 않는 다면, null 로 나온다.
*롤링을 주고 버튼을 클릭을 했을때 정지하는 걸 만들어 봤다.
setInterval 에 변수를 정해주고 clearInterval ()안에 변수 값을 넣어서 원하는 버튼안에 onclick 에 넣어주면 눌렀을때 정지한다.
x= setInterval( rolling , 100);
onclick="clearInterval(x);"
하지만 다시 시작하는 방법을 못찾아서 다시 하려면 새로고침을 해야한다. 다른방법을 찾아봐야 겠다.