mobssie

JSON(JavaScript Object Notation) JSON.parse() : parse 메소드는 string 객체를 json 객체로 변환 JSON.stringify() : stringify 메소드는 json 객체를 String 객체로 변환

화면을 구성할때 스타일 내기위해 자주사용하는 자바스크립트를 정리해보려고 한다. 1. 부모의 자식요소 갯수를 구해 스타일로 분기처리 할때 - 부모에 아이디값을 셀렉 후 자식요소의 length를 구한다. - classList를 사용해 부모에 클라스를 추가해 스타일을 조건에 따라 활성화한다. var listOrder = document.getElementById('listOrder'); var nodelist = listOrder.getElementsByTagName('li').length; if(nodelist < 16){ listOrder.classList.add('few') } else{ listOrder.classList.add('many') } 2. 스크롤 헤더 sticky 효과 - 부모에 아이디값을..

.setAttribute() .setAttribute()는 선택한 요소(element)의 속성(attribute) 값을 정한다. element.setAttribute( 'attributename', 'attributevalue' ) attributename에는 속성 이름을, attributevalue에는 속성값을 넣습니다. document.getElementById( 'xyz' ).setAttribute( 'title', 'This is title' ) ▶ id 값이 xyz인 요소의 title 속성을 This is title로 정합니다. 만약 이미 속성값이 존재한다면 그 값을 지우고 새 값을 적용합니다. CODING FACTORY ▶ id 값이 abc인 요소의 href 속성값을 변경하는 예제입니다. fu..

여러가지 아코디언액션을 적용하는 방법이 잇는데 CSS 클래스로 컨트롤 하는 방식이 가장 좋은 방법인 것 같다. [html] onclick="toggleClass( this.parentNode, 'fold')" 클릭시 부모에 fold라는 클래스를 토글하고 싶을때 (추가/제거) this에 parentNode 붙여준다. [vanilla javascript] // 아코디언 var toggleClass = function (element, tClass) { tClass = tClass.replace(/\s/g, ""); var classes = element.className; element.className = classes.indexOf(tClass) !== -1 ? classes.replace(" " + t..

Array.prototype.slice.call 이해하기 우선,slice() 메서드는 어떤 배열의 begin부터 end까지(end 미포함)에 대한 얕은 복사본을 새로운 배열객체로 반환한다. (원본 배열은 수정되지 않는다.)Array는 new Array()에서 새 배열을 만드는 객체이다. Array는 프로토타입에 모든 원시 배열 메서드가 있는 객체.이러한 새로운 배열에는 slice와 같은 메서드와 속성이 전달되며, 이러한 메서드는 [Class].prototype 개체에 저장된다. var arr = new Array(); Array으로 인스턴스를 만든다. 이것은 기본적으로 arr 객체가 프로토타입 체인에 Array의 프로토타입을 추가한다는 것을 의미한다. 인스턴스를 만드는 대신 Array 프로토타입에서 's..

[vanilla javascript] 기초이미지 찾아서 경로 바꾸기 if (document.getElementById('imgThumb').getAttribute('src') == "pictures/imgThumb.png") 배열에 SRC 값을 추출 해서 넣기 var imgFind = function(){ var imgs = document.getElementsByTagName("img"); var imgSrcs = []; for (var i = 0; i