BLANK, NULL AND BLACK

Object

JAVASCRIPT2016. 8. 18. 15:28

var obj = {

    한국 : 서울,

    미국 : 워싱턴,

    일본 : 도쿄

}


라는 json 형태의 데이터가 있다면

obj 의 타입과 내용만 확인이 가능할 뿐 (눈으로 보고 정보를 받아들이는 사람 입장에서)

데이터의 총 길이와 흔히 프로그래밍에서 할 수 있는 가공 작업에 한계가 있다.


찾다보니 이런게 나왔다. 


Object.keys(obj).length 


그렇다. 이제 데이터의 길이를 알 수 있다.

하지만 어디까지나 key 값을 이용해서 데이터의 길이를 알아내는 것이고

value에는 접근이 안된다.

혹시나 해서 Object.values(obj) 를 해봤지만 '언디파인드' 가 뜬다.


왜 키만 사용하도록 해놨을까..?

검색하니 한국 분이 친절하게 구현을 해놓으셨다.


주소: http://loustler.tistory.com/39


'JAVASCRIPT' 카테고리의 다른 글

window.opener  (0) 2016.08.18
Div 를 새창 팝업으로 띄우기  (0) 2016.07.01
자동 롤링 이미지  (0) 2016.06.02
setInterval(), setTimeout()  (0) 2016.06.02

window.opener

JAVASCRIPT2016. 8. 18. 15:00

윈도우.오프너

자식 윈도우에서 부모 윈도우를 가르키는 말이라고 생각하면 되겠다.


자식 윈도우 입장에서 

1) 나를 호출한 윈도우

2) 나를 오픈한 윈도우 등..

-------------------------------------------------------------------------------------------------------------

window.opener <- 부모 윈도우를 의미

document.getElementById('아이디') <- 아이디를 이용하여 요소를 찾기


위 두개를 합치면


window.opener.document.getElementById('아이디') <- 부모 윈도우에서 '아이디' 라는 아이디를 가진 요소 찾기


window.opener.함수이름() <- 부모 윈도우에 정의되어 있는 function을 실행


부모 윈도우의 함수 실행은 지금 사용하고 있는 크롬에서는 실행되지 않는다.

함수도 실행 시킬 수 있다는 걸 처음 알았을때 "이게 돼?" 하면서 놀랐는데 

내가 놀란 그 이유로 크롬에서는 막은 듯 하다. (보안 때문이겠지?)

-------------------------------------------------------------------------------------------------------------

[삽질]

아무생각없이 처음엔 window.opener.document.getElementsByName 를 사용하여

부모 윈도우의 텍스트박스에 값을 지정하려고 했다. (중복 되는 네임이 없었음)

값을 넣는 과정에서는 에러도 안나고, 마치 잘 들어가는거 처럼 나왔다. (크롬 디버그 모드에서)

근데 실제로는 값이 들어가지 않았다.


나의 무지가 죄겠지만, 

"이렇게 해서는 값이 들어가지 않아!!!" 라고 경고나 에러만 띄워줬어도 

"왜 안들어갈까" 라면서 돌지 않는 머리를 억지로 돌릴 필욘 없었는데 말이지.


좀 더 테스트가 필요하다.

-------------------------------------------------------------------------------------------------------------

현재 페이지에서 모든 input을 찾아서 그 중에 checkbox 만 찾는 방법 (역시 구글信)


var inputs = document.getElementsByTagName('input');


for (var i=0; i<=inputs.length-1; i++){

    if (inputs[i].type == 'checkbox'){

        //checkbox 를 찾아서 할 일

    }

}

'JAVASCRIPT' 카테고리의 다른 글

Object  (0) 2016.08.18
Div 를 새창 팝업으로 띄우기  (0) 2016.07.01
자동 롤링 이미지  (0) 2016.06.02
setInterval(), setTimeout()  (0) 2016.06.02

도움말 페이지를 새창으로 띄우는 방법을 생각하다 찾았다.
도움말은 여러개가 있고, 사용자의 요청에 따라 달라지는 도움말 페이지이다.
요청이란, 조그만한 물음표 이미지가 있는데 그 이미지를 누르면 그 요소에 해당되는 도움말이 출력되는 
예를 들면 A요소에 있는 물음표 이미지를 클릭하면 A에 대한 도움말
B요소에 있는 이미지를 클릭하면 B에 대한 도움말이 보여진다.



<button onClick="PopupExplain('도움말')">
<div id="도움말">
여기는 도움말 내용입니다.
</div>


<script>

function PopupExplain(param){

var val = document.getElementById(param).outerHTML;

var explain = document.getElementById("explain");


var w = window.open("","","");

w.document.write(val);

w.document.close();

}

</script>


참고: http://plaboratory.org/archives/3094

'JAVASCRIPT' 카테고리의 다른 글

Object  (0) 2016.08.18
window.opener  (0) 2016.08.18
자동 롤링 이미지  (0) 2016.06.02
setInterval(), setTimeout()  (0) 2016.06.02

자바스크립트 지식이 없는 관계로 노가다 코딩 일 듯 하다.

비효율적이고, 주먹구구식이지만 어쩔 수 없다. 허허허


사내시스템 메인화면에서 배너형식으로 이미지 몇개를 돌게해서 직원들에게 보여주고 있다.

요약된 정보를 작은 이미지에서 보여주고 (실제 5초마다 바뀌는 이미지)

관심 있는 이미지를 클릭하면 큰 이미지로 그 내용을 상세하게 보여주는 .... 그런 형식이다.

이미지는 디자이너가 만드니까 신경 쓸게 아니다만,


1. 요약된 정보 이미지

2. 요약된 정보 이미지 클릭 시 큰 이미지를 새창에 띄워서 전체 내용 보여줌.

3. 큰 이미지, 그러니까 전체 내용이 있을 수도 있고, 없을 수도 있음.


3번이 좀 맘에 걸렸다.

1번부터 10번까지 이미지가 있다면, 1~5번은 큰 이미지가 없고 나머지는 있고 이런식도 아니였다.

1,2,5,8 큰 이미지 없음. 나머지 큰 이미지 있음. 뭐 이런식..

언제나 예외와 싸우는게 프로그래밍이라 하지만 짜증이 안날래야 안날 수가 없다.


그래서 만들었는데,,

다시 처음부터 만들라면 할 수 있을지 모르겠다.

완성도도 떨어지고.. 아무튼 그렇다. 허허헣~


대략적인 구조는

1. 파일이름이 제각각 일 수 있으니 폴더에 있는 이미지 파일이름을 먼저 배열에 넣는다.

2. 파일 이름앞에 '파일경로', 파일이름 뒤에 '확장자' 를 붙여서 이미지 주소를 완성 시킨다.

3. 큰 이미지를 가지는, 다시 말해 클릭 했을 때 크게 보여줄 이미지를 가지고 있는 파일이름을 특정 함수 파라미터에 넣는다.

3-1. 특정 함수에 파일이름이 적힌 이미지는 클릭 시 새창으로 큰 이미지 표시, 나머지는 표시안함.

4. setInterval() 과 setAttribute() 를 이용해서 이미지를 지정된 시간 만큼 보여주고 이미지 교체 (현재는 5초)


소스를 다 적긴 좀 거시기 하니까 첨부파일로 올려놔야겠다.

이미지는 사내에서 사용하는 이미지가 아닌, 사이즈만 같은, 동물 이미지로 교체.


이미지에 대해서 간략히 설명한다면

파일이름은 "00","01".. 이런식의 숫자로 돼있다.

어차피 파일이름을 배열에 직접 넣어주니까 추후에 수정이 가능하다.

작은 이미지를 클릭 했을때 띄워질 큰 이미지는 파일 이름은 같지만 뒤에 알파벳 "L" 을 붙였다. 라지의 첫글자.

이 부분 또한 맘대로 바꿀 수 있다. 소스랑 매칭만 시켜주면 뭐....... (예: 00.jpg, 00L.jpg, 01.jpg, 01L.jpg.....)


일단 올려보자.

틈틈히 소스를 보면서 수정도 하고 해야하는데

잘 돌아간다면 그냥 그런가 보다 하니까 잘 안봐진다. 에휴.. 맨날 그 밥에 그 나물..


Rolling.zip



'JAVASCRIPT' 카테고리의 다른 글

Object  (0) 2016.08.18
window.opener  (0) 2016.08.18
Div 를 새창 팝업으로 띄우기  (0) 2016.07.01
setInterval(), setTimeout()  (0) 2016.06.02

우후! 자바스크립트 첫 글이다.


이상하게 빡세다. 될듯 한데, 안되고, 안되겠지 했는데 결과가 나온다! ㅡ_ㅡ

확실히 제이쿼리가 편하긴 하다는걸 느낀다.

VS만 만지다가 sublime 에서 작업을 해보니 여간 갑갑한게 아니다.

오류도 안띄워주고, 되면 된다. 안되면 안된다 말이 없으니.. 크롬 없었으면 어찌했을꼬~


일단은 자주 쓸 일은 없지만

사내시스템 메인화면에서 이미지 몇장을 돌리면서 직원들이 보게 해달라는 요청이 있기 때문에

찾아본거 까먹지 않도록 적어본다.


우선 참고 했던 블로그주소 : http://stove99.tistory.com/56


보고 있지만, 인터벌과 타임아웃의 정확한 차이를 모르겠다.

아직 다른점이 뭔지 정확히 안찾아봤으니 찾으면 나오겠지.


setInterval('함수()', 시간)


저 함수 부분을 왜 문자열처럼(따옴표로 감싸서) 적어야 할까?!

따옴표 안붙였다가 한참 찾았다. 어찌보면 이 포스트는 '저 함수부분이 문자열' 이라는 것을 까먹지 않기 위해 작성하는 것이다!!

시간 부분을 0.1초 정도로 줄여보니 유흥가에서 많이 보던 간판이 생각나서 얼른 다시 원래대로 돌렸다.... (으흠..)


잘되면 재밌는데, 잘 안되면 지독하게 안된다.

'JAVASCRIPT' 카테고리의 다른 글

Object  (0) 2016.08.18
window.opener  (0) 2016.08.18
Div 를 새창 팝업으로 띄우기  (0) 2016.07.01
자동 롤링 이미지  (0) 2016.06.02