본문 바로가기

각 종 it/티스토리 등 프로그래밍

JavaScript 출력 방법 中 html DOM innerHTML 이전 게시글에서 document.write()를 다룬 적이 있었다. https://aldkzm.tistory.com/433?category=738830 그 당시 필자는 이것만 알고 있으면 html에 무리 없이java 값을, 그것도 변경값을 반영할 수 있다 설명했다. 하지만 이는 도큐의 특성을 몰랐을 때 이야기다. 도큐의 특성은 재차 소환 되면 이전 도큐 내용들을 삭제하고 새로운 도큐를 불러온다는 것이다. 예를 들어 html 안에 document.write()를 작동하는 버튼을 만들었다 치고, 이를 누르면 도큐가 작성 된 구간에 새로운 객체가 생기는 것이 아니라, 마치 새로운 페이지에 이동하듯, 모든 내용이 사라지고 새롭게 작성 한 내용만 화면에 출력된다. 처음 코드가 읽혔을 때 도큐는 유효하지만, 막상 ..
javaScript 새로고침, location.reload(); 기존의 검색기에서 북마크를 사용하면 몇 번에 몇 페이지에 저장이 되었는지 알려주는 알림창이 나온다.일일히 확인 눌러주는 것도 그렇고 이 참에 북마크 도출(result) 부분만 으로 별도의 공간으로 만들어 거기다 location.reload();를 적용 해 북마크 버튼을 누를 때 마다 브라우저(부분 페이지)가 새로고침 되도록 만드는 방법을 적용 하려고 하다... 아이프레임에 document.write()을 어떻게 적용 해야 할 지 막막하다. 아이프레임이 안 먹혀요. 그렇다고 죽은 태그인 이나 을 다시 쓰기는 거시기 하고... 그럼 차라리 location.reload();를 북마크 함수 전체에 적용 해 페이지 전체를 리프레쉬하는 방법은 어떨까도 생각 해 봤다.필자한테는 광고 cpm이 늘기 때문에 득이 될 거..
JavaScript localStorage(), 지난 검색어 제공하기 을 사용하여 그 안에 를 사용하면 검색기록이 남아 ‘자동완성’기능을 제공 해 준다. 하지만, 이대로 쓰면 자체 페이지 내에서만 검색이 되기에 지금 사용하고 있는 여러 검색기에 적용하기 힘들다. 이에, localStorage()를 이용 사용자 검색 기록을 저장하는 북마크 기능을 달기로 하였다.물론 배열을 응용하여 각 객체를 로 묶은 뒤 지우기 버튼을 첨부하여 기존의 즐겨찾기 기능을 구현하면 되지만... 그렇게 까지 해서, 뭘하고자 하는 의지가 없음으로 그저 북마크 순서대로 저장하는 간단한 기능을 구현하기로 했다. 참고로, localStorage()와 sessionStorage()의 차이점은 브라우저를 종료하고 난 뒤에도 값을 저장하는가 이다. localStorage()는 간단하게 캐쉬를 생각하면 쉬운데, ..
웹페이지에 필요한 간단한 이미지는 외부 url로 삽입하면... 최소한 저장 공간은 걱정 안하겠지. 티스토리 자체 제공 파일업로드 공간은 20mb이다.적다. 요즘 같이 시각성이 부각 되는 현실에 비추어보건데 많이 부족하다. 그리하야 이번에는 간단하게 아이콘의 url을 따와 웹페이지에 적용하는 방법에 대해 서슴없이 서술하겠다. https://icons8.com/icons위의 유알엘은 무료로 아이콘 이미지를 제공 해 주는 사이트다. 비록 ios 위주지만, 무척 쓸만하다. 우선, 원하는 아이콘을 클릭하면 3가지 선택지가 나온다. 그 中 html을 선택한다. 그럼 드래그 한 것과 같이 이미지 소스가 나오는데 그것을 이용하면 된다. 결과물은 지난번에 더보기 앞에 이미지를 넣었다고 했는데 바로 그거다. 2019/03/16 - [각 종 it/티스토리 등 프로그래밍] - ‘더보기’ 꾸미기 & 웹글자 stroke & ..
‘더보기’ 꾸미기 & 웹글자 stroke & 웹글자 앞 뒤 이미지 또는 글자 넣기 2019/03/14 - [각 종 it/티스토리 등 프로그래밍] - html style 지정 시 왜 css을 사용 할까? & 간단한 css 사용법 지난 번에 css 간단 사용법에 대해 언급 한 적이 있다. 그런 의미에서 다음이나 티스토리에서 제공하는 기능인 더보기를 꾸미기로 한다. 보통 티스토리에서 제공하는 기본 스킨에서는 더보기 옆에 아래 화살표를 표시하거나 해서 더보기라는 티를 내주는데, 이번 스킨은 그림을 강조하는데 중점을 두었는지 글자들은 참 눈에 띄지 않는다. 그리하야 한동안은 웹텍스트를 깜빡이게도 해 보았다. 만든 이는 알지만 모르는 이는 모른다.(필자도 가끔 깜빡하고 그냥 지나친다.) 그래서 이번에는 글자 색깔을 바꾸기로 했지만, 어딘가에 css의 저주(span과 관련 색 지정)에 걸려져 있어..
티스토리 toolbar(menubar) 없애는 것은 가능한데 위치변경은 좀... 티스토리에서 제공하는 반응형 웹페이지의 헤더를 강제로 fixed(플로팅 된 제목)를 시켜버리니, 뒤에 있는 티스토리 툴바 일부를 사용 못하게 되었다. 이는 html 태그 中 z-index에 의한 것으로 헤더를 위에 띄우다 보니 그에 가려 툴바가 사용 못하게 된 것이다.그리하여 위치를 변경하려 코드를 보니... html이나 css에 작성 된 것이 아니라, 티스토리 본사(?)에서 참조해서 값을 받아오는 형식이라 수정하기가 어려워졌다. 우선 #tistorytoolbarid { display : none; } 이 코드로 툴바는 간단하게 없앨 수 있지만 요즘은 설정에 들어가서도 툴바를 없애는 것은 가능하다. 위치를 옮기려고 하니 애초에 받아오는 코드에서 style로 지정 해 버렸으니...없애버리고 새로 만들려고 ..
html style 지정 시 왜 css을 사용 할까? & 간단한 css 사용법 티스토리를 운영 하다 보면 css라는 부분을 쉽게 찾아 볼 수 있다. 처음에는 이게 뭐지?하고 생각하다 익숙 해 지고 나니 아, 별거 없네라는 결론을 도출하게 되었다.html 스타일 지정 時 크게 세 가지 방법이 있는데,첫째, 스타일 바꾸고 싶은 태그 자체에 스타일 지정. 둘째, html 안에 스타일태그를 별도로 만들어 지정. 마지막으로, css안에 스타일지정.button{} 즉흥적이고 직관적인 방법은 첫 번째 방법이나, 익숙 해 지고 나면 css를 이용하는 것이 여러 가지면에서 이득이다. 우선 복잡하고 장문의 스타일 지정 時 별도의 css에 넣어두면 html의 가독성에 좋고, button에 대한 공통된 스타일 지정에 있어 css만 바꿔주면 되니 관리면에서 편하다. 물론 두 번째 방법도 html 안에 따..
html 태그코드에 자바 변수를 적용할려면? html에서 자바를 선언 하려 하면 우선 자바스크립트 태그로 선언 하고 난뒤 사용한다.마무리는 자바스크립트태그로 해 줘야 하고. 그렇다면 이 안에 갇힌 자바의 변수를 html에서 사용 하려 하면 어떻게 해야 할까? 물론 함수를 이용하여 집어 넣으면 된다. 예를 들어, 이렇게 만들면 된다.(java()의 상세 내용은 생략) 하지만 자바스크립트 內에 있는 변수를 이 코드에서 이용하려면??? 해당 태그에 아이디를 부여하여 스크립트 내에서 getElementById()를 이용하여 값을 받아내면 된다.는 이론을 어딘가에서 본적이 있으나 더 간단한 방법이 있어 소개하려 한다. document.write();스크립트 안에서 이 함수 안에 html 태그 코드를 집어 넣으면 그대로 출력 해 준다. 2019/03/10 -..