본문 바로가기

반응형

전체 글

(134)
문자열 안에 포함된 HTML 태그 내용 지우기 정규식 RegExp 이용 replace 화면에 출력하는 값은 데이터베이스로부터 가져온다. 그런데 화면에 HTML 태그들이 그대로 노출되는 경우가 있다. Hello World! 처럼 말이다. 데이터베이스에 들어 있는 값 안에 태그가 그대로 들어가 있는 경우다. 이런 경우에는 태그를 따로 제거해주어야 한다. 정규식 표현을 이용하면 편하다. 정규식 문법은 따로 공부해 두는 편이 좋다. // Java String textAfter = textBefore.replaceAll("]*)?(\\s)*(/)?>", ""); // JavaScript const textAfter = textBefore.replace(new RegExp("]*)?(\\s)*(/)?>"), ""); -220905
[JSP] <c:set var=""> 태그 안에 <c:url value=""> 태그 넣기 org.apache.jasper.JasperException: ~~~~ Unterminated &lt;c:set tag - 태그 안에 태그 넣기 - 태그는 뒤에 value 값을 붙여서 자동으로 url path 를 만들어 준다. 이렇게 만든 url 결과값을 변수에 저장하고 싶었다. 변수에 저장하는 기능은 태그를 이용하면 된다. 라고 하면 'b'라는 값을 'a' 라는 이름의 변수에 저장한다는 뜻이다. 이 둘을 활용해서 url 값을 변수에 저장하려고 했다. - 잘못된 코드 X - 그런데 위와 같은 코드는 에러를 발생시켰다. org.apache.catalina.core.StandardWrapperValve invoke Servlet.service() for servlet [~~~~] in context with path [~~~] threw exception [~~~~ Unterminated <c:set tag] with roo..
[JavaScript] 걸려 있는 클릭 이벤트 핸들러 제거하기 remove Event Listener - 걸려 있는 이벤트 핸들러 제거하기 - document.querySelector('#myBtn').removeEventListener('click', getEventListeners( document.querySelector('#myBtn') ).click[0].listener ); - 대략적인 과정 - 먼저 이벤트가 걸려 있는 요소에 접근한다. const target = document.querySelector('#myBtn'); 그리고 요소로부터 이벤트 제거 함수를 꺼내 실행한다. target.removeEventListener(); 여기서 removeEventListener() 함수에 필수로 넣어줘야 하는 전달인자는 두 가지다. 하나는 이벤트 종류이고, 다른 하나는 이벤트 리스너 함수 자체다. 세..
CSS 넘치는 텍스트 말줄임표 (···) 글자로 나타내기 + 2줄/3줄 조정하기 : ellipsis - 기본 (1줄) - 가장 간단하고 기본적인 형태로 치면 아래 두 줄이다. overflow: hidden; text-overflow: ellipsis; 일단 정해진 범위 밖으로 벗어나는 요소를 감추도록 한다. overflow: hidden; 범위를 벗어나는 요소가 텍스트라면 감추고 나서 말줄임표를 남기도록 한다. text-overflow: ellipsis; - 2줄, 3줄 등으로 맞춰서 줄이기 - text-overflow: ellipsis; overflow: hidden; white-space: normal; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; 여기서 "-webkit-line-clamp" 값을 원하는 대로 ..
[JavaScript] checkbox 체크박스 '전체' 버튼 선택/해제 클릭 이벤트 함수 //HTML varStatus="g"> - 만들고 싶은 기능 설명 - 화면에 버튼을 만드는 로직은 위와 같이 해두었다. contentTypeList가 넘어오고, 거기서 요소를 하나씩 꺼내서 codeId와 codeName 으로 버튼을 만든다. 만들고 싶은 기능은 이렇다. '전체' 버튼이 먼저 있고, 나머지 버튼들도 있다. '전체' 버튼을 클릭하면 나머지 버튼들도 그 값을 따라서 함께 체크되거나 해제된다. 나머지 버튼을 클릭해서 모두 선택된 상태가 되면 자동으로 '전체' 버튼도 선택된다. 나머지 버튼을 클릭해서 모두 선택된 상태가 아니게 되면 자동으로 '전체' 버튼도 해제된다. 위 기능을 구현하는 이벤트 로직을 아래와 같이 만들어 보았다. // JavaScript var checkContentHandler ..
[Java] DB에서 Select 해온 Row에 새로운 List 추가하기 //mapper SELECT A.seq , A.category_code , A.category_name , A.parent_category_code FROM table_category A WHERE A.category_code = COALESCE(#{cateCode}, '0002') AND A.parent_category_code = #{parentCategoryCode} - 원하는 기능 : 하위 카테고리 리스트를 상위 카테고리 - 카테고리 간의 상하 관계를 저장하고 있는 카테고리 테이블이 있다. 대분류, 중분류, 소분류로 총 세 가지 뎁스가 있다. 대분류는 중분류를 포함할 수도 있고, 속해 있는 중분류가 없을 수도 있다. 중분류는 소분류를 포함할 수도 있고, 속해 있는 소분류가 없을 수도 있다. 이러한..
MyBatis 마이바티스에서 조건절 쿼리에 와일드 카드 넣기 - 쿼리에 넣고 싶은 조건절 - 't' 라는 테이블이 있고, 그 테이블 안에 'name'이라는 칼럼이 있다. 이 'name'이라는 칼럼 값에 'myName'이 들어가는 데이터를 모두 뽑고 싶다. 그러면 아래와 같은 조건절을 넣어야 한다. where t.name = '%myName%' - MyBatis에서 와일드카드 넣기 : 문제점 - where t.name = '%myName%' 위와 같은 쿼리를 넣고 싶은데 어떻게 해야 하지? 일단 가장 먼저 생각난 방법은 아래였다. where t.name = '%#{searchText}%' -- 틀린 문법 위처럼 하면 우리가 원하는 대로 작동하지 않는다. MyBatis에서는 #{searchText} 자체에 앞뒤로 따옴표를 붙여주기 때문이다. 예를 들어서 searchT..
HTML 요소의 'data-' 속성 ele.dataset.? 활용하기 - HTML 요소에 속성 넣어 주는 법과 접근하는 법 - 교육 사과 HTML 요소들은 여러 가지 속성 값을 갖는다. id="--" / class="--" / style="--" / value="--" 이렇게 엘리먼트가 들고 있는 속성들에 접근할 때는 아래처럼 쓴다. const ele = document.querySelector('#target'); ele.id; // 엘리먼트의 ID 값 ele.tagName; // 엘리먼트의 tag 값 ele.style; // 엘리먼트의 style 값 ..... - HTML 요소에 'data-' 속성 넣어 주는 법과 접근하는 법 - 그중에서도 'data-' 로 시작하는 속성도 종종 보인다. data-color="red" / data-code="0016" / data-po..

반응형