본문 바로가기

Javascript

(7)
Javascript img src에 이미지가 없어서 엑박뜰때 이미지 안보이게 하기 태그에서 src경로에 이미지가 없어서 이미지가 보이지 않고 엑박이 뜰때 보이지 않게 하는 방법 img태그에 onerror에 display을 none으로 처리하여 안보이게 한다. 이렇게 사용할 경우 icon.png이미지를 찾고 해당 이미지가 없으면 onerror처리를 하기 때문에 화면에 잠시 엑박 이미지가 보이고 사라지는 현상이 발생한다. 이미지 대체하기 onerror에 this.src로 대체할 이미지 경로를 입력한다.
[Javascript] Chrome, IE 브라우저 종류 확인 navigator userAgent Javascript navigator로 브라우저 구분하기 IE 브라우저 var agent = navigator.userAgent.toLowerCase(); if( navigator.appName == 'Netscape' && navigator.userAgent.search('Trident') != -1 || (agent.indexOf("msie") != -1)) { console.log("Internet Explorer 브라우저입니다."); } Internet Explorer 11 mozilla/5.0 (windows nt 10.0; wow64; trident/7.0; .net4.0c; .net4.0e; .net clr 2.0.50727; .net clr 3.0.30729; .net clr 3.5.307..
[javascript] 자바스크립트로 label 요소 검색하기(querySelector) Jquery를 사용하지 않고 javascript로 label 요소 접근하기 document.querySelector() 는 문서 안에서 선택자와 일치하는 첫 번째 요소를 접근한다. 일치하는 요소가 없을 경우 null을 반환한다. document.querySelector('label[for="input-text"]') document.querySelector(".input-class");
[Javascript] getElementById Chrome 에러 IE7 버전 이전에서 getElementById가 에러없이 잘 동작하지만 Chrome에서 getElementById가 에러가 발생했다면 다음과 같은 에러일 수 있다. IE7 이전 버전에서는 getElementById 를 태그에서 찾을 때 ID와 NAME에서 먼저 찾는 것을 리턴한다. 다시 말하면 태그에 id와 name 둘 중 하나의 값만 있어도 그 값을 리턴받아서 사용한다. 예를 들어보자. input에 id값은 정의하지 않고 name값만 정의할 경우 ie7 이전 버전에서는 getElementById로 찾을 때 input에 id값이 없더라도 name값이 있으면 name의 값을 가져오기 때문에 에러가 발생하지 않는다. document.getElementById("test");
[Javascript] 웹표준 자바스크립트 마우스 우클릭 방지, 개발자모드(F12) 막기 Javascript 마우스 우클릭 방지 #1 document.captureEvents(Event.MOUSEDOWN) document.onmousedown = mouseRightClcik; function mouseRightClcik(event) { if(event.which != 1){ alert("마우스 우클릭 방지 #1"); return false; } } captureEvents 는 두개의 이벤트를 제어할 때 사용한다. captureEVents를 하게 되면 자신이 window, document에 속해있지 않더라도 capture 했기 때문에 이벤트를 호출할 수 있다. document.onmousedown 도큐먼트에 onmousedown 이벤트를 설정한다. onmouse event 종류 onmoused..
[자바스크립트] Javascript Spread(...) 연산자 Spread(...) 연산자를 사용해서 함수의 매개변수의 값들을 배열로 전달받을 수 있다. setArray의 아규먼트(argument)에 1, 2, 3, 4, 5의 값을 입력하면 ...array의 파라미터가 값들을 배열로 전달받게 된다. Array.isArray(array)로 파라미터의 값을 console.log에 찍어보면 true값이 나오는 것을 확인할 수 있다. function setArray(...array) { console.log(Array.isArray(array); console.log(array); } setArray(1, 2, 3, 4, 5); > (5) [1, 2, 3, 4, 5] true 주의할 점은 Spread(...) 를 사용할 때는 매개변수의 제일 마지막에 사용해야 한다. Res..
[JavaScript] 자바스크립트 ES6 문법 scope, var, let, const scope 자바스크립트를 사용하려면 scope를 잘 알아야 하는것 같다. scope란 용어를 잘 알진 못하지만 자바스크립트 내에서 중요한 역할을 한다. scope란 말 그대로 변수에 접근할 수 있는 '범위'를 나타낸다. scope는 지역변수, 전역변수 두 가지 종류가 존재한다. 지역변수는 함수와 같이 블록(block)안에서만 사용할 수 있고, 전역변수는 함수의 밖았에서 선언되어 어느 곳에서든 해당 변수에 접근할 수 있다. let data = 'a'; function print() { let data = 'b'; console.log(data); } print(); => b 호이스팅(Hoisting) 자바스크립트에서 호이스팅이란? 스크립트 내에서 변수를 선언하게 되면 유효범위의 최상위로 변경되는것을 말한다..