반응형

Programming$/Web Develop 14

[Javascript] CountDown 구현

[Javascript] CountDown 구현A ~ B 까지의 특정 이벤트가 존재할 떄, 이벤트 시작 전에는 이벤트 시작까지 남은 시간이 나오고, 이벤트 중간에는 이벤트 종료 시각까지 않은 시간이 나온다. 이벤트 종료 후에는 Expired 메시지가 뜸. ​ var countDownDate; var check = function(){ var now = new Date(); now = now.getTime(); if (now > new Date("Sep 5, 2020 00:00:00").getTime()){ countDownDate = new Date("Sep 7, 2020 00:00:00").getTime(); } else { countDownDate = new Date("Sep 5, 2020 00:00:..

[php] xss, sql injection 막기

[php] xss, sql injection 막기 내가 하면 꿀잼이지만, 남이 하면 족같은 xss, sql injection을 방지할 수 있는 함수들을 정리한다.출처는 이고잉님의 생활코딩이다. htmlspecialchars("~~~~")html에서 특수한 의미를 갖는 다음의 문자들을 모양은 같고 의미는 다르도록 치환해준다. 삽입된 javascript 문이 실행되는 것을 막을 수 있다.CharacterReplacement& (ampersand)&" (double quote)", unless ENT_NOQUOTES is set' (single quote) ' (for ENT_HTML401) or &apos (for ENT_XML1, ENT_XHTML or ENT_HTML5), but on..

js 변수 값 php로 전달하기

js 변수 값 php로 전달하기 snake game에 db를 추가하는 업데이트를 진행하는 와중 javascript에서 전역변수로 선언된 score 값을 php로 어떻게 보내야할 지 고민을 했다.js나 php나 이제 막 배우는 와중이라서 라이브러리들도 잘 몰라서, 조금 막막했지만 javascript와 php 사이에 html을 낑겨 넣으니 어떻게 구현할 수는 있었다.form의 action에 인자를 넘길 때, 해당 form 태그 안에 존재하는 input의 value 값을 통해서 인자가 전달되는 점에서 착안하여 인자를 넘기기 위한 용도의 input 태그를 만들었다. type으로 hidden을 주면 화면에 출력되지 않는다. username은 인자의 이름을 지정하기 위한 용도이고, id는 js에서 해당 elemen..

[html] form submit action 주의

form submit action 주의 snake game 만드는 중이였는데, 게임 실행하고 잠시 후 갑자기 계속 새로고침이 되서 꽤나 곤란한 삽질을 수행했다.. 열심히 javascript 코드에서 삽질하고 있었는데, 설마하며 잠깐 살펴본 html에서 원인을 발견했다.다음 코드가 문제였다. START RESTART SUBMIT 세가지의 버튼이 존재하는데, start와 restart 버튼은 js에서 click 이벤트가 발생할 시, 특정 함수를 실행하는 쪽으로 구현했고, submit 버튼의 동작은 onclick Attribute를 이용해서 submitScore()와 인자들을 전달하여 process.php가 실행되도록 했다.근데 여기서 문제가 발생한 것이, 나는 process.php가 실행되도록 하는것이 ty..

[JavaScript] removeAttribute()

javascript removeAttribute() SUBMIT요렇게 설정해놓은 녀석을 다음과 같이 설정한 css를 통해서#submitBtn{ background-color: #f78fb3; } ​ #submitBtn:disabled { background-color: grey; cursor: default; }button의 ON/OFF를 만들기로 했다. submitBtn.setAttribute('disabled', 'true');로 disabled로 설정하는 거는 잘됐는데 submitBtn.setAttribute('disabled', 'false')로 disabled를 없애는 건 잘 안됐다... 구글 좀 뒤져보니 아예 disabled Attribute를 없애버리는 방법이 있었다.submitBtn.rem..

[.CSS] z-index element 우선순위

z-index 이녀석..css에서 position 속성을 이용하는 경우, 의도치 않게 element가 겹치는 경우가 발생할 수 있다.예를 들어 다음과 같은 경우.. ㅡㅡ 이럴 경우, z-index라는 녀석을 설정해주면 각 각의 element 들의 수직 위치를 지정하여 문제를 해결할 수 있다. z-index: 2; 와 같이 사용한다. 정수 값을 사용하며, 값이 클수록 우선순위가 높아진다.

[.CSS] 구글 폰트 적용하기

구글 폰트 사용하기 갓글에서 폰트까지 무료로 제공한다. 주소는 https://fonts.google.com/ 홈페이지에서 적당한 폰트를 추가한 뒤, 아래와 같은 화면에서 사용할 글자체를 선택한다. 나는 css에서 사용할 것이므로 @IMPORT를 살포시 선택하여 다음과 같이 갓글님께서 선사하시는 css url을 수령하도록 한다. stylesheet 사용하는 법은 뭐 다들 편한데로 사용하겠지만 나는 style.css에 다른 css 파일들을 추가하여 사용하는 편이므로 아래와 같이 적용한다. style.css@import url('https://fonts.googleapis.com/css?family=Roboto'); @import 'test.css'; ...이런 식으로 추가해주면 된다. 다만 해당 폰트를 사용..

반응형