Front-End9 [JS] 메뉴 이동시 선택한 메뉴 클릭 유지 되도록 메뉴 이동시 선택한 메뉴가 클릭 유지 되도록 하려면 다음과 같은 코드를 작성하면 됩니다. const menuItems = document.querySelectorAll(".class_nav .class_ul li a");임의의 class_nav를 가진 요소 내부의 class_ul를 가진 요소 내부의 모든 li 요소의 자손인 a요소들을 선택합니다. const currentPath = window.location.pathname;현재 URL에서 도메인 다음에 오는 경로를 가져옵니다. menuItems.forEach(function(link) { const li = link.parentElement; if (link.getAttribute('href') === currentPath) { .. 2024. 5. 29. [React] 기초 JSX 사용법 react 코딩시 태그에 class를 주고 싶으면 function App() { return ( 개발 Blog ); } react 쓰는 이유: 데이터 바인딩이 쉽기 때문 데이터 바인딩: 서버에서 가져온 데이터를 HTML에 넣는 작업 데이터 바인딩 사용법: { 변수명, 함수 등 } function App() { let posts = '강남 고기 맛집'; return ( { posts } ); } style 사용법 style= {object 자료형으로 만든 스타일} 개발 Blog 참고: 코딩애플 유튜브 https://www.youtube.com/watch?v=FqnAFX9lQPQ&list=PLfLgtT94nNq1e6tr4sm2eH6ZZC2jcqGOy&index=3 2024. 3. 12. [error] node fileName.js 실행 오류. 'MODULE_NOT_FOUND' terminal에서 node [fileName].js를 실행시켰는데 다음과 같은 에러가 났다. module이 없으니 npm install로 모듈을 설치하면 된다. npm install 2023. 6. 15. [javascript] DB컬럼에 여러 값을 넣고 싶을 경우 JSON.stringfy() 데이터 유형이 문자열인 DB 컬럼에 여러개의 값을 넣고 싶을 경우 JSON.stringfy()를 사용한다. JSON.stringfy()는 JavaScript 값이나 객체를 JSON 문자열로 변환하기에 데이터 유형이 문자열인 DB컬럼에 저장이 가능해진다. const arr = ['안녕하세요', '반갑습니다', '환영합니다']; let result = JSON.stringfy(arr); 2023. 6. 12. [HTML] error: get http://127.0.0.1:5500/favicon.ico 404 (not found) error: get http://127.0.0.1:5500/favicon.ico 404 (not found) 해결방법: html head 안에 아래줄 추가 전체 html 2023. 2. 2. JavaScript: html 가져와서 내용 확인 ex: document.querySelector() js에서 html을 가져와서 내용을 확인하고 싶을 경우 여러가지 방법이 있겠지만 몇가지 방법을 소개하고자 한다. document.getElementById(); document.getElemensByClassName(); document.querySelector(); document.getElementById(); // html에서 id 값을 가져오고 싶을 경우 사용 document.getElemensByClassName(); // html에서 특정한 element 값으로 되어 있는 여러 element를 한번에 가져오고 싶을 경우 사용 document.getElementsByTagName(); // tag name에 대해서 array로 값을 가져옴 document.querySelector(); // el.. 2023. 1. 13. html(thymeleaf) 이미지 2개를 나란히 배치 html에서 이미지 2개를 나란히 배치하는 경우가 있다. div로 묶고 각각의 이미지에 float:left를 적용하면 된다. 상품이미지 2023. 1. 10. thymeleaf html layout:decorate doesn't work I applied a layout at the top of signup_form.html But The layout didn't work. Because thymeleaf-layout-dialect library was missing. There was just spring-boot-starter-thymeleaf library. dependencies { implementation 'org.springframework.boot:spring-boot-starter-thymeleaf' Added the library dependencies { implementation 'org.springframework.boot:spring-boot-starter-thymeleaf' implementation 'nz.n.. 2022. 12. 2. 이전 1 2 다음