[IT/Programming]/HTML related 썸네일형 리스트형 Getting html of container including the container itself # Getting html of container including the container itself jQuery 를 이용하거나 그냥 JavaScript 를 이용해서 내부의 html 은 다음과 같이 끄집어낼 수 있다. ```[.lang-js] let containerHTML = $("#container").html(); let containerInnerHTML = $("#container")[0].innerHTML; ```/ ## PH 2024-02-06 : First posting. ## TOC ## 예제 (innerHTML) 아래 html 은 다음과 같다. ```[.lang-html] ```/ 다음과 같은 함수들로 내부 html 을 뽑아와 보자. ```[#pre-code-innerHTML.lang.. 더보기 구글 크롬 브라우저 캐시 지우기 및 강력 새로고침 하는 방법 # 구글 크롬 브라우저 캐시 지우기 및 강력 새로고침 하는 방법 인터넷 브라우저들은 통신에 소비되는 비용을 아끼기 위해 바뀌지 않는 데이터들 (사진이나 동영상, javascript 파일, css 파일, html 파일 등) 을 브라우저 로컬 저장소에 저장/캐시 (cache) 해놓고, 사용자가 같은 사이트를 다시 방문할때 변하지 않았을거라 추측되는 데이터들은 다운받지 않고 캐시 해놓은 데이터를 이용해서 페이지를 띄우는 경우가 많다. 하지만 이 경우 접속하고자 하는 홈페이지의 몇 개의 파일/데이터들이 바뀌었는데도 새로 다운로드 받지 않고 캐시된 데이터를 써서 에러를 일으키는 경우가 있는데, 이를 방지하기 위해 캐시를 지우고, 강력하게 새로고침 하는 방법에 대해 설명해볼까 한다. 참고는 에서... ## PH 2.. 더보기 HTTP Cookie in Web / HTML / Javascript and Server # HTTP Cookie in Web / HTML / Javascript and Server 작성중... (아직 중구난방일 수 있으니 감안하고 보시길...) Client-side (browser) 에 일정 정보를 "key=value" 형태로 저장시켜놓고, 서버에서 사용자를 기억하는데 주로 사용되는 cookie 란 놈이 있다. 매번 browser 에서 server 로 HTTP request 보낼때 이 cookie 란 놈도 항상 같이 보내기 때문에 이런게 가능한 것인데, 보통 request.headers().get("Cookie") 같은 명령어로 server 에서 뽑아낼 수 있다. Server 측에서 주로 사용하는 데이터이긴 하지만, client 측에서도 javascript 를 통해서 접근 가능하기도 해서 .. 더보기 구글 검색 바로 할 수 있게 input 및 button 만들기 # 구글 검색 바로 할 수 있게 input 및 button 만들기 ## PH 2023-12-28 : First posting. ## TOC ## 구글 검색 구글 검색은 http://www.google.com/search?q=soccer 형태로 이루어진다. "q=검색하고 싶은 문구" 를 넣으면 되는거 같으니 다음과 같이 만들어 봅시다. Google Search ### Code HTML 과 Javascript 는 다음과 같음. ```[.linenums.lang-html] Google Search ```/ ### Using form submit ```[.linenums.lang-html] ```/ ## RRA https://inpa.tistory.com/ 에서 검색 구현해 놓으신 것 참고했음. 더보기 Parent DOM (Document Object Model) 이 hidden 일 때, child element 가 update 되면 hidden 이 풀릴 때 해결법 # Parent DOM (Document Object Model) 이 hidden 일 때, child element 가 update 되면 hidden 이 풀릴 때 해결법 Recoeve.net 개발하면서 목록 (ToR) 이 다른 카테고리로 옮겨갈때 갑자기 pop-up 되는 현상이 발생했는데, 이게 카테고리가 바뀌면서 목록이 update 되고 목록 (ToR) 의 child elements 가 update 되면서 발생하는 문제 같았다. 역시나 만능 ChatGPT 에 문의 결과 대충의 답의 힌트를 얻을 수 있었는데... children DOM 의 display 를 inherit 으로 하면 해결되는 문제였다. ## PH 2023-12-03 : First posting. ## TOC ## To ChatGPT in .. 더보기 브라우저에서 자동 비밀번호 완성 (Auto password completion) 일 때, 이를 파악해서 바로 로그인 시켜주는 방법 # 브라우저에서 자동 비밀번호 완성 (Auto password completion) 일 때, 이를 파악해서 바로 로그인 시켜주는 방법 요즘 브라우저는 사이트마다 비번을 기억하기 어렵기 때문에 자동으로 비번을 생성시켜주고 이를 브라우저가 기억해놓고 사이트에 로그인 페이지에 가면 자동으로 아이디와 비번을 채워주곤 한다. 그런데 채워지기만 하고 로그인 버튼을 따로 눌러야 하는 번거로움이 있기도 한데 이를 해결하는 방법을 찾아서 공유하고자 한다. 아마도 휴대폰 인증 번호가 문자로 오고 이걸 자동으로 입력해주고 입력 후엔 바로 인증하기 버튼이 자동으로 눌러지게 해놓은 어플들도 많은데 비슷한 방법을 쓰고 있지 않나 생각한다. ## PH 2023-12-01 : First posting. ## monitorEvents.. 더보기 jQuery.ripples - 이미지에 물결 그래픽 효과 주기 # jQuery.ripples - 이미지에 물결 그래픽 효과 주기 최근에 구글링을 하다가 블로그를 엄청 예쁘게 꾸미시고 글 퀄리티도 매우 뛰어난데를 발견했는데, 거기서 신기한게 있어서 나도 배우기 및 적용해볼겸 작성하는 글. ## PH 2023-11-29 : First posting. ## TOC ## jQuery.ripples.js jQuery 라이브러리니 당연히 jQuery 가 선행되어야 하고, 실행 메소드 하나만 해주면 바로 적용이 된단다. 유의 할점은 이미지는 태그가 아닌 css의 background-url 속성으로 적용되어야 한다고 한다. (객체 속성으로도 명시할 수 있음.) 아마도 그냥 img 로 load 되면 속성을 변화시키면서 img 를 바꾸는게 막혀서 그런듯 하다. (.gif 로 하면 더.. 더보기 imgur - Embed album # imgur - Embed album 앨범 만들어 놓으면 아래와 같이 embeding 할 수 있는 API 를 제공하긴 하는구나. CSS max-width:100% 같은거는 안먹혀서 responsible web 으로 만들긴 힘든듯도? 스마트폰에서 접속하면 parsing/rendering 이 다른식으로 이루어 질래나? 처음 로딩할때 width 체크해서 적당하게 만들어주긴 하는듯? ## TOC ## Embed imgur album 아무튼 코드는 아래와 같고. ```[.linenums.lang-html] HARAGU ```/ blockquote 부분에 아래와 같이 나타남. HARAGU ## Direct iframe Album URI | URL 에 /embed?pub=true&context=false 붙이면 d.. 더보기 이전 1 2 3 4 5 6 ··· 11 다음