본문 바로가기

JavaScript26

jQuery - selector 요약 정리 셀렉터는 jQuery의 가장 강력한 기능이다. 간단하게 설명을 하자면, HTML 문서 안에는 다양한 엘리먼트들이 포함되어 있는데, 이를 컨트롤 하기란 결코 간단한 일이 아니다. 일반적으로 자바스크립트에서 엘리먼트를 얻기 위해 많이 쓰이는 방법은 document.getElementById("엘리먼트 ID 속성 값") 함수를 사용하면 되지만, 일단 소스 코드가 길어지고 얻을 수 있는 엘리먼트들도 매우 한정적이다. 하지만 jQuery에서는 $("셀렉터 문법") 함수를 사용하여 매우 간단하고 다양한 스타일의 엘리먼트들을 쉽게 얻을 수 있다. 셀렉터로 얻은 엘리먼트들을 확장 집합이라 하는데, 특수한 배열 형태의 객체로 반환이 된다. 이렇게 반환된 객체들은 jQuery가 지원하는 매우 다양한 함수들을 사용할 수 있.. 2018. 11. 2.
jQuery - each() 메서드 jQuery를 사용해 배열을 관리하고자 할 때 each() 메서드를 사용할 수 있습니다.each() 메서드는 매개 변수로 받은 것을 사용해 for in 반복문과 같이 배열이나 객체의 요소를 검사할 수 있는 메서드입니다. each() 메서드는 다음과 같은 두 가지 타입이 있습니다.JAVASCRIPT// jQuery 유틸리티 메서드$.each(object, function(index, item){});// jQuery 일반 메서드$(selector).each(function(index, item){})위의 메서드를 차례로 알아보도록 하겠습니다. $.each()$.each() 메서드는 object 와 배열 모두에서 사용할 수 있는 일반적인 반복 함수입니다.다시 말해, 배열과 length 속성을 갖는 배열과 .. 2018. 11. 2.
jQuery - 속성으로 노드찾기 ( attribute selector ) 요약 [name] 해당하는 속성을 가지고있는 노드 [name=value] 주어진 문자열과 속성이 동일한 노드 [name~=value]공백으로 구분된 단어와 속성이 일치하는 노드 [name*=value] 주어진 문자열을 포함하고있는 노드 [name$=value] 주어진 문자열로 끝나는 노드 [name!=value] 주어진 문자열이 속성과 다른 노드 [name^=value] 주어진 문자열로 시작하는 노드 [name=value][name2=value2] 다중속성선택자 해당하는 속성을 가지고있는 노드 (" [name] ")해당하는 attribute을 있는 노드를 가져옵니다. html123456div> ul> li>1.a href="example.html">링크a>로연결li> .. 2018. 11. 2.
parseFloat() 과 parseInt () parseInt(), parseFloat() 함수는 둘다 문자열을 숫자로 변경하는 함수이다.근데 Number()함수도 문자를 숫자로 바꿔줄 수 있는데Number 함수는 안의 내용중에 문자형 숫자 외에 다른 문자가 들어가면 NaN(Not a Number) 를 띄운다.예)123var won = Number('1000원');var dollar = Number('1.5$');document.write(won + ' : ' + dollar);cs결과)NaN : NaN parseInt(), parseFloat() 함수는 숫자로 변환할 수 있는 부분까지는 모두 숫자로 변환한다.예)1234var won = '1000원';var dollar = '1.5$';document.write(parseInt(won) + ' : .. 2018. 10. 28.
.is() Method .is() Method 설명선택한 요소 중 하나 또는 하나 이상이 selectorElement 와 일치하는지 확인하여 일치하는 경우 true를 반환 통사론$(selector).is(selectorElement,function(index,element))ParameterDescription selectorElement요소의 인덱스 위치function(index,element)* 선택 과목. 선택한 요소 그룹에 대해 실행할 함수를 지정합니다.index - 요소의 인덱스 위치element - 현재의 요소 (「this」셀렉터도 사용할 수있다) 예의 부모가 요소 인 경우 일부 텍스트에 경고합니다.123if ($("p").parent().is("div")) { alert("Parent of p is div".. 2018. 10. 28.
자바스크립트 성능 최적화 팁 대부분의 언어가 그렇듯이 자바스크립트는 배우기도 쉽고 사용하기도 쉽지만, 잘 사용하기는 아주 어려운 언어이다. 그냥 작성해도 돌아는 가지만, 더욱 최적화 할 수 있는 방법을 알아보려한다.문법|| 연산자|| 연산자는 참을 만나면 그 뒤는 연산을 하지 않으므로 if문 대신 사용 하면 코드량과 연산 횟수를 줄일 수 있다.var result;if( some_var ){ result = some_var;}else{ result = 'default value';}// || 연산자 사용const result = some_var || 'default value';&& 연산자&& 연산자는 참을 만나야 다음 연산을 하므로 어떤 조건을 만족할 때 실행하도록 하는 코드에서 사용하면 코드량과 연산 횟수를 줄일 수 있.. 2018. 10. 28.
반응형