본문 바로가기

Html,Css,JavaScript

(14)
AJAX 데이터 보기 alert(JSON.stringify(result)); 크리에이티브 커먼즈 라이선스 이 저작물은 크리에이티브 커먼즈 코리아 저작자표시-비영리-동일조건변경허락 3.0 Unported 라이센스에 따라 이용하실 수 있습니다.
HTTP와 HTTPS를 구분해서 이미지, CSS, Javascript 로딩하기 다른 브라우저에서는 별 문제 없는데 IE에서는 스키마가 https 로 된 홈페이지에서 http로 이미지나 CSS, Javascript등의 리소스를 로딩하면 경고가 발생한다. 그래서 현재 주소에 따라 리소스의 주소를 적을때 https인지 http인지 잘 구분해서 적어줘야 한다. 사실 나는 별로 납득가지 않는데, 일반적으로 암호화 대상이 되는 데이터는 HTML에 거의 다 들어있고, 혹은 폼을 통해 전송하는 데이터에 들어있지 화면을 꾸미는 이미지, CSS, ... 등(이하 리소스 resource)에 들어있는게 아니기 때문이다. 따라서 경고를 안 내는게 맞는 것 같다. 아무튼 이런 상황에서 HTTPS인 페이지와 HTTP인 페이지별로 따로 모든 리소스의 경로를 구분해서 줘야 할까? 당연히 그럴필요 없어서 글 쓴다..
escape(), encodeURI(), encodeURIComponent() 자바스크립트에서 지원하는 url encode / url decode 함수는 3가지가 있다. escape() 는 ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 1234567890 @*-_+./ 위에서 열거된 문자가 아니면 모두 변환을 합니다. 1바이트문자는 %XX 형태로 2바이트 문자는 %uXXXX 식으로 변환합니다. (아스키문자가 아니라면 모두 유니코드 형식으로 변한) encodeURI()는 escape()와 비슷하지만 인터넷 주소표시에 쓰이는 특수문자들은 인코딩하지않는다. 즉, : ; / = ? & 등의 특수문자는 인코딩 되지않는다 . 보통 파라미터 전달하는 인터넷주소 전체를 인코딩할때 사용 encodeURIComponent()는 escape()와 비슷..
문자열 치환 // fnReplace(원본 문자열, 변경대상 문자열, 변경할 문자열) function fnReplace(str, str1, str2) { var pattern = new RegExp(str1, "gi"); return String(str).replace(pattern, str2); } function replaceText() { document.getElementById("tmp2").value = fnReplace(document.getElementById("tmp").value, "
W3C 기술문서(Technical report)의 단계 * W3C의 기술 의사록 권고안 확정까지의 작업 사이클 입니다. 1단계: 초안 (Working Draft) – 권고안에 대한 기술 의사록은 초안 단계부터 출발한다. 초안은 워킹 그룹이 특허 받은 작업 항목이며 일반적으로 특정 분야의 작업을 수행하기 위해 W3C가 처리 중인 작업과 향후 반영될 사항에 대한 공약을 의미한다. “Working Draft”라고 표기된 것은 아직 기술 의사록에 관해 W3C 내부에서 합의가 이뤄지지 않은 사안이다. 2단계: 최종 공개 초안 (Last Call (Working Draft)) – 최종 공개 초안은 특허 관련 요건들과 부수적인 필요조건 서류들의 내용을 충족시키기 위해 워킹 그룹이 고려하는 특수 버전의 초안을 의미한다. 최종 공개 초안은 워킹 그룹이 타 W3C 그룹, 멤버..
디바이스별 미디어 쿼리 정리 속성으로 구분 스마트폰 (가로/세로): @media only screen and (min-device-width : 320px) and (max-device-width : 480px) { /* Styles */ } 스마트폰 (가로): @media only screen and (min-width : 321px) { /* Styles */ } 스마트폰 (세로): @media only screen and (max-width : 320px) { /* Styles */ } iPad (가로/세로): @media only screen and (min-device-width : 768px) and (max-device-width : 1024px) { /* Styles */ } iPad (가로): @media only ..
tr을 display:none, display:block 할때의 문제점 해결법 을 하게 되면 IE 계열에서는 잘 표현이 되나 여타 브라우저에서는 테이블이 일그러집니다. 그 이유와 해결 방법은 아래와 같습니다. 표준 기반 브라우저에서 tr 요소의 기본 display 속성 값은 block이 아니라 table-row입니다. 그런데 display = "table-row" 이렇게 지정하면 IE에서 제대로 동작하지 않습니다. 그래서 sytle.display = "" 처럼 그냥 빈 문자열("")을 써서 요소의 기본 display 속성 값으로 초기화시키거나 style="display:table-row; *display:block;" 으로 써 주면 됩니다. 크리에이티브 커먼즈 라이선스 이 저작물은 크리에이티브 커먼즈 코리아 저작자표시-비영리-동일조건변경허락 3.0 Unported 라이센스에 따라 ..
커서모양 auto crosshair default pointer move e-resize ne-resize nw-resize n-resize se-resize sw-resize s-resize w-resize text wait help 크리에이티브 커먼즈 라이선스 이 저작물은 크리에이티브 커먼즈 코리아 저작자표시-비영리-동일조건변경허락 3.0 Unported 라이센스에 따라 이용하실 수 있습니다.
현재 스크롤의 위치값 function getScrollPosition() { var de = document.documentElement; var b = document.body; var oScroll = {}; oScroll.X = document.all ? (!de.scrollLeft ? b.scrollLeft : de.scrollLeft) : (window.pageXOffset ? window.pageXOffset : window.scrollX); oScroll.Y = document.all ? (!de.scrollTop ? b.scrollTop : de.scrollTop) : (window.pageYOffset ? window.pageYOffset : window.scrollY); return oScroll; } 크리..
[삽질방지] Firefox에서 외부 css파일을 일어오지 못하는 문제 * 원인(발생조건) DTD를 Strict로 선언하고 일부 웹서버(Apache, iPlanet)에서 MIME Type을 "text/css"가 아닌 "text/plain" 이나 "text/x-pointplus" 같이 부정확한 MIME Type으로 전송할 경우 * 해결방법 아파치를 사용한다면, 루트 디렉토리의 .htaccess 파일에 다음을 추가한다. AddType text/css .css 즉 웹서버에 .css 파일에 대한 정확한 MIME Type를 설정해 준다. * 참고사항 css파일은 UTF-8 형식으로 저장하고 로 호출하면 스타일시트 적용은 되지만 한글로 적은 글꼴에 대한 스타일 선언 무시되는 경우도 있으므로 UTF-8 형식으로 저장했을 경우 명확하게 로 호출해야 합니다. [참고] http://bomnu..