본문 바로가기
반응형

분류 전체보기706

[JavaScript] arr.join() - 배열을 특정 구분자를 기준으로 문자열로 변환하기 (ft. Array.prototype.join()) 스크립트로 배열을 다룰때 배열안에 있는 값들을 특정 구분자를 기준으로 문자열로 변환해주는 Array.prototype.join() 메서드에 대해 알아보자. ▷ 구문 arr.join([separator]) separator: 배열의 각 요소를 구분할 문자열을 지정한다. 일명 구분자로 생략 시 기본값은 쉼표(,)이다. 예제를 통해 알아보자. ▷ 예제1) Array.prototype.join() 기본 사용법 var arr = ['mine', 'it', 'record'] // mine,it,record var joinA = arr.join(); // mine-it-record var joinB = arr.join('-'); // mineitrecord var joinC = arr.join(''); ▷ 예제2) .. 2021. 3. 27.
[jQuery] dom 요소 복사하기 (ft. clone()) jQuery에 있는 .clone() 메서드를 사용하여 특정 dom 요소를 복사해보자. ▷ 구문 .clone( [withDataAndEvents ] ) //withDataAndEvents : true/false (default : false) 일반적인 구문은 위와 같으며 withDataAndEvents 매개변수를 boolean값으로 줄 수 있으며 빈값으로 쓸 경우 기본적으로 false로 들어가게된다. 좀 더 파고들자면 공홈에 아래와 같이 나와있다. 사실 그렇게 까지 깊게 파고들필요는 없어보이며 매개변수에 true/false를 제어할 수 있다는점과 true를 줄 경우 요소가 가지고 있는 이벤트까지 복사할 수 있는 정도로만 알고있으면 된다. 예제를 통해 가볍게 알아보자. (예제는 공식 jQeury API Do.. 2021. 3. 23.
[JavaScript] iframe 부모창 새로고침하기 iframe을 사용해보면 알겠지만 iframe 특성상 새로고침이나 url 이동을 하게되면 해당 iframe 창만 새로고침되고 이동하게 되는 상황이 발생한다. 이때 그냥 페이지 자체를 새로고침 하고 싶은데 그 방법에 대해 가볍게 알아보자. 그냥 별다른거 없이 parent에 접근만 해주면된다. window.parent.location.reload(); // 부모창 새로고침 window.parent.location.href = url; //url 입력 2021. 3. 13.
[JavaScript] 현재 브라우저 버전 체크하기 (ft. navigator.userAgent) 언제 사용될지는 모르겠지만 나 같은 경우는 Edge 버전을 체크하는데 사용하였다. Edge역시 구버전 신버전(Chromium)이 존재하는데 이 역시 사용 가능한 함수들이 다르기때문에 체크해주었다. 일단 현재 브라우저 버전 체크에 사용되는 navigator.userAgent를 예제를 통해 살펴보자. ▶예제1) 브라우저 별 navigator.userAgnet ▷ IE (익스플로러) 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.30729; rv:11.0) like Gecko ▷ Edge (엣지) Mozilla/5.0 (Windows NT.. 2021. 3. 13.
[JavaScript] IE 에서 Edge browser 열기 (ft. microsoft-edge) 끔찍한 IE에서 접근했을 시 Edge browser를 강제로 여는 방법에 대해 알아보자. 사실 그렇게 어려운 코드는 아니다. window.location에 'microsoft-edge:'를 추가해주면된다. 일단 이걸 사용하기에 앞서서 현재 브라우저의 상태를 체크해주는게 존재하는데 navigator.userAgent 라는 녀석이다. 이걸 염두에 두고 예제를 통해 알아보자. ▶예제1) if(navigator.userAgent.indexOf("Trident") > 0){ console.log("exLog") window.location = 'microsoft-edge:' + url //url : 이동할 주소 } else if(/MSIE \d |Trident.*rv:/.test(navigator.userAgen.. 2021. 3. 13.
[jsTree] dnd plugin - node 이동시 이벤트 감지/처리하기 (ft. move_node.jstree) [jsTree] jstree 드래그 앤 드롭(dnd) 적용하기 (ft. Drag & drop plugin) 2021. 3. 1.
[jsTree] 선택된 node 선택해제 하기 (ft. deselect_all) ★jstree 그 외 유용한 함수 모음 ★jstree 선택한 node 정보 가져오기 ★jstree 단축키를 활용한 node 다중 선택 jstree에 선택을 제공해준다면 당연히 해제하는것도 제공해준다. 전부 선택해제 시켜주는건데 예제를 통해 가볍게 알아보자. ▶javascript $('#tree').jstree({ 'core' : { 'data' : [ { "id" : "ajson1", "parent" : "#", "text" : "Simple root node" }, { "id" : "ajson2", "parent" : "#", "text" : "Root node 2" }, { "id" : "ajson3", "parent" : "ajson2", "text" : "Child 1" }, { "id" : "a.. 2021. 2. 20.
[jsTree] node 다중 선택(multiple select) 하기 (ft. 단축키) 사실 보면 진짜 별거 아닌데 검색할때 잘 안나와서 정리해둔다. (물론 영어로 검색하니까 바로 나오긴 하더라.) ▶javascript $('#tree').jstree({ 'core' : { 'data' : [ { "id" : "ajson1", "parent" : "#", "text" : "Simple root node" }, { "id" : "ajson2", "parent" : "#", "text" : "Root node 2" }, { "id" : "ajson3", "parent" : "ajson2", "text" : "Child 1" }, { "id" : "ajson4", "parent" : "ajson2", "text" : "Child 2" }, ] } }); 그냥 하던데로 jstree를 만들어주고나서.. 2021. 2. 20.
[jsTree] 선택된 node 정보 가져오기 (ft. get_selected) ★jstree 그 외 유용한 함수 모음 jstree를 사용할 때 선택한 node의 정보를 가져오는 방법에 대해 알아보자. plugins과 다르게 따로 뭔가를 설정해줄 필요없이 바로 가져오는게 가능하다. 예제를 통해 쉽게 알아보자. ▶javascript $('#tree').jstree({ 'core' : { 'data' : [ { "id" : "ajson1", "parent" : "#", "text" : "Simple root node" }, { "id" : "ajson2", "parent" : "#", "text" : "Root node 2" }, { "id" : "ajson3", "parent" : "ajson2", "text" : "Child 1" }, { "id" : "ajson4", "parent.. 2021. 2. 20.
반응형
TOP

티스토리툴바