본문 바로가기

분류 전체보기207

[JavaScript] DOMContentLoaded, onload 차이점. DOM(Document Object Model) 트리란? 오늘은 DOMContentLoaded, onload의 차이점과 DOM 트리의 대해 간단하게 적어보려고 합니다. 전부터 제이쿼리를 많이 사용했었지만 최근에는 DOM형으로 사용한다고 하여 공부할 겸 적어봐요. ㅎㅎ 1. DOM 넌 뭐야!? DOM(Document Object Model) : document(문서) Object(객체) Model(모델) 즉, HTML 문서를 구성하는 요소(Element)를 객체 로 표현한 것을 트리 형태로 구성한 것입니다. 트리 형태 : | Hello, Java 화면 개발을 하실 때 위에 같은 요소들을 많이 접해봤을거에요. 같은 HTML문서의 요소들을 JavaScript가 이용할 수 있는 객체를 "문서의 객체"라고 하는데요. 구현 방법은 1. 위에 HTML를 작성해서 로드를 하.. 2024. 2. 5.
[의정부] 식탁에 반찬들이 한가득! 푸짐한 한식 식당 "소반" 리뷰 소반 > 경기 의정부시 범골로82번길 30 1층 소반 > 10:30 ~ 22:00 (화요일 휴무) > 031-837-3040 > 없음 (공영주차장 이용) 안녕하세요! 오늘은 한식당에 가봤는데요. 이곳은 전에도 꼭 가봐야지 리스트에 적어놨는데 혼자 갈 수가 없어서 ㅋㅋ 드디어 파티원을 찾았고 가보았습니다!!! 가게 이름은 "소반" 이구요. 한식전문점 식당입니다. 여기가 정식을 시키면 테이블에 반찬이 한가득! 차려주신다고 하더라구요 ㅋㅋ 그래서 블로그나 인스타에서도 뜨고 있었던 식당입니다. (점심에는 웨이팅도 있는 것 같아요) [메뉴판] 소반한상차림으로 시키면 여러가지 반찬이 한가득 차려주시는데 그게 부담된다면 옆에 1인 메뉴도 따로 있습니다. 저희는 소반한상차림으로 주문을 했어요! 가게는 엄청 크진 않지만.. 2024. 2. 3.
[tag/CSS] Text 띄어쓰기 JSP에서 적용하기 위해서는 <pre> 사용 pre : HTML에서 미리 서식이 지정된 텍스트를 정의하는 태그로 공백이나 줄바꿈을 유지해야하는 코드나 텍스트를 표시할 때 주로 사용된다. 사용방법은 두 가지가 있는데요. 1. HTML 태그 사용 띄어쓰기가 들어간 텍스트 2. CSS 스타일 적용 pre-wrap : CSS에서 사용되는 속성 중 하나로, 텍스트의 줄바꿈과 공백을 유지하는 기능을 가진다. 저렇게 사용할 수도 있고 도 가능하다. 이렇게 하면 DB에서 가져온 띄어쓰기가 적용된 텍스트를 가져올 수 있다. - 을 입혀서 가져올 수 있지만, 해킹 방지로 특수기호를 텍스트로 바꾸는 필터를 거친다면 태그를 사용할 수 없게 되므로 저렇게 사용해도 되고, 아니면 다시 필터를 해서 특수 부분만 적용되게 할 수도 있다. 그건 개발자가 알아서 잘 활용하면 된다. 2024. 1. 30.
[Java] 문자열 필터는 어떻게? CharAt 와 replace, replaceAll 로 해결하자! 오늘은 문자열 필터를 해보려고 합니다. 개발을 하다보면 데이터 값을 고대로 받는 경우도 있지만, 문제가 있을 법한 기호라던가 문장을 제외 시켜야 하는 경우도 있잖아요?? 그럴때는 charAt()와 replace()로 필터해서 수정 할 수 있어요. 1. charAt : 문자열에서 특정 인덱스에 위치한 문자를 반환하는 Java 프로그래밍 언어의 메서드입니다. 예를 들어 "Hello Java" 문자열이 있다고 쳤을 때 4번째 문자를 추출하면 'o'가 출력 될 것이다. String charDatas = "Hello Java"; String charData = charAt(charDatas(4)); System.out.println("4번째 데이터는 : "+charData); ============= 출력 : o.. 2024. 1. 26.
[하림] FOODYBUDDY 어른이와아이들을 위한 라면 "하양라면" 칼로리도 적고 나트륨 함량이 쏙! 안녕하세요! 오늘은 컵라면을 리뷰해보려고 합니다. 고것은 바로! 요즘? 뭐 몇 달 전부터 핫했죠 ㅋㅋㅋㅋ 하림에서 아이들을 위한 라면을 출시했었는데요. FOODYBUDDY 하양라면과 빨강라면 입니다. GS25에서 2+1으로 구매를 했는데요. 가격은 2,400원 ㄷㄷ 4,800원으로 3개 샀어요. (개당 1,600원 꼴이네요) 라면 뚜껑 부분을 보시면 위에 사진처럼 나옵니다. 기름을 쪽 뺀 1mm 건면을 사용했다고 해요. 일반 컵라면 면들 생각하면 약간의 두께가 있잖아요 그래서 저는 면이 얇은 육개장 사발면을 좋아하는데요. 이 면 역시 1mm로 육개장 면발과 비슷하지 않을까 기대를 하며 구입하게 되었습니다. (뭐, 칼로리도 적고 건면에다가 나트륨 함량도 적어서 저녁에 식사 대용으로 괜찮을 것 같아서요) ... 2024. 1. 20.
[Event] 반응형 - 페이지 이동 및 화면 크기 변경으로 load, resize 이벤트 화면 크기 변경해보자!! 오늘은 브라우저 페이지 이동으로 onload 진행과 화면 크기가 갑자기 변경 되었을 때 발생하는 이벤트를 알아보려고 합니다. 이걸 사용하는 이유는 반응형을 사용할 때 좋은 이벤트로 예를 들어 핸드폰 화면과 태블릿 화면 크기가 다르잖아여 이벤트 발생으로 인해 그 화면의 맞게 크기 조정을 해주는 겁니다. 제일 먼저 함수를 사용하려면 load 할때와 화면 크기가 변경 될 때 발생하는 이벤트를 1 순위로 작성해야겠죠?? 위에 코드를 보시면 로드시와 화면크기 변경 시 해당 이벤트가 발생해요. 그 안에 원하는 로직을 작성하면 되는데요. console.log(); 찍어서 확인을 하시면, 새로고침과 페이지 이동시에는 load 이벤트가 발생하고, F12 눌러서 모바일 디바이스로 바꾼 후 모바일 버전을 변경하면 resiz.. 2024. 1. 17.
[의정부] 아담하고, 담소 나누기 좋은 분위기 있는 카페 unicoff. "유니코프" 리뷰 카페명 : unicoff. (유니코프) 주소 : 경기 의정부시 평화로 542 1층 영업시간 : 월~목 11:00 ~ 22:30, 금~일 11:00 ~ 23:00 주차 : 주차 할 곳이 없어서 공영 주차장 추천. 연락처 : 0507-1390-4899 unicoff. 오늘은 의정부 작은 카페를 소개하려고 합니다. 의정부에서 일이 있어 잠시 나왔는데, 월요일에는 카페가 대부분 문을 닫더라구요. ㅜㅜ 그래서 카페를 찾다보니 이쁜 트리가 보이고, 아담한 공간이 있는 카페를 발견해서 들어가봤습니다. ㅎㅎ 카페 이름은 "유니코프" 이구요. 작은 골목 안쪽에 있는데요. 골목으로 들어가자마자. 이쁜 트리가 떡! 하니 저희를 반겼습니다. ㅎㅎ (밑에는 unicoff. 라고 적혀있네요) 입구 바로 옆에 트리가 있으니까. 들.. 2024. 1. 14.
[JavaScript] TextArea 작성 및 유효성(특수기호) 검사, 복사 붙이기 오늘은 TextArea를 가지고 유효성 검사와 복사붙이기 어떻게 활용하는지 알아볼건데요. (이게 웹개발 할 때 은근 많이 사용하더라구요....) 물론 저는 html이나 jsp로 작성할 때 쓰고 있어서 다른 프론트는 어떻게 하는지 잘 모릅니다.. 일단 먼저 TextArea를 만들어봐야겠죠?? [기본 html 작성] TextArea 테스트 이렇게 기본적으로 html파일을 만듭니다. 그 다음 그냥 작성하셔도 상관없긴해요. 하지만! 이대로 사용하면 데이터를 넣을 때 문제들이 발생할 수 있어 몇 가지 옵션을 넣어볼거에요. 1. document.on("",function(){}) 사용 - Textarea를 사용하면 아무래도 작성이 중점이니 paste, keyup, change, input를 주로 사용합니다. 그래서.. 2024. 1. 12.
반응형

티스토리툴바