const width = window.innerWidth;
const height = window.innerHeight;
// 브라우저의 width, height 값

 

스크롤을 얼마나 했는지 확인

window.scrollY

 

일반 div박스나 다른 요소의 스크롤을 확인하고 싶을 때

const section = document.querySeletor('section');
let sectionHeight = section.scrollHeight; 
// 스크롤 포함 실제 높이, 페이지가 로드완료되야 정확함(body태그 밑에 써주는게 좋음)
let scroll = section.scrollTop;
// 하면 페이지 내 scroll이 있는 section 박스의 scroll이 어디인지 확인가능
// 위에서 얼마나 내렸는지 알려주지만 전체적으로 내린것이 아님
let 실제setion높이 = section.clientHeight;
// 실제 section의 높이값

 

 

원하는 위치로 강제 스크롤

window.scrollTo(x, y);
window.moveTo(x, y);

원하는 위치로 이동 후 설정한 x, y 좌표 말고 움직일 수 없음

 

 

현재 위치에서부터 어디까지 추가로 이동

위와 마찬가지로 움직일 수 없음

window.scrollBy(x, y);
window.moveBy(x, y);

'개발 > js & jquery' 카테고리의 다른 글

[Javascript] this  (0) 2022.10.27
[Javascript] javascript로 태그 만들어서 집어넣기  (0) 2022.10.25
[Javascript] return  (0) 2022.10.25
[Javascript] 정규식(regular expression)  (0) 2022.10.25
function test(){
  return 1234;
  // return 밑에 있는 코드들은 실행되지 않음
}

let number = test();
// 값 확인해보고 싶으면 변수에 넣어서 확인 가능
console.log(number);
// 1234

 

정규식으로 해당 문자가 들어있는지 검사하고 싶을 때

/[a-z]/.test('abcde');
// a부터 z까지 글자가 들어있는지?
// 하나만 찾아줌!🙃

/a+/.test('aaaaaaaaaaaaa');
// a가 여러개 있는지?

/[A-Z]/.test('abcde');
// 대문자 A부터 Z까지 글자가 있는지?

/[ㄱ-ㅎ가-힣]/.test('abcdeA');
// 한국어가 들어있는지?

/\S/.test('abcde');
// 아무 문자 하나, 특수기호 포함

/^a/.test('abcd');
// a로 시작하는지

/a$/.test('abcd');
// a로 끝나는지

/a|b/.test('abcd');
// a또는b

 

// 이메일 정규식
/\S+@\S+\.\S+/.test('이메일주소');

// \S+ 는 문자 여러개(몇개인지는 상관없음)
// .은 정규식 안에서 특수한 문법이기 때문에 앞에 \를 추가해줌

'개발 > js & jquery' 카테고리의 다른 글

[Javascript] scroll  (0) 2022.10.25
[Javascript] return  (0) 2022.10.25
[Javascript] setTImeout, setInterval 쓰는 법  (0) 2022.10.25
[Javascript] 값이 숫자인지 확인하기  (0) 2022.10.25

setTimeout 기본 문법

setTimeout(function(){
    
}, 1000);
// 1000은 1초뒤에 실행하라는 뜻



// 이렇게도 사용 가능
setTimeout(text, 1000);
function text(){
	console.log('안녕하세요');
}

 

 

 

setInterval 기본 문법

setInterval(function(){
    
}, 5000);
// 5초 간격으로 계속 실행

 

let count = 0;

const timer = setInterval(function(){
	count++;
    if(count === 10){
    	clearInterval(timer);
        // count가 10이 됐을 때 clearInterval 메소드로 timer 멈춤
    }
}, 1000);

'개발 > js & jquery' 카테고리의 다른 글

[Javascript] return  (0) 2022.10.25
[Javascript] 정규식(regular expression)  (0) 2022.10.25
[Javascript] 값이 숫자인지 확인하기  (0) 2022.10.25
[Javascript] padStart, padEnd  (0) 2022.10.10

isNaN 함수 사용!

const number = 123;
const text = '123';
// isNaN 사용

isNaN(number) // false
isNaN(text) // true

number 값이 아닐 때 true출력

+ Recent posts