JavaScript 22

[JavaScript] Chart.js 라이브러리 연습 코드

안녕하세요. JavaScript 라이브러리 중에서 Chart.js 사용해본 코드 입니다. 1차 팀 프로젝트하다가 한 번 사용해보고 싶어서 사용해본거라 자세한 설명은 없습니다. 공식사이트 Chart.js Simple yet flexible JavaScript charting library for the modern web www.chartjs.org CDN HTML CSS #allChart_Graph { background-color: black !important; } Script 부분 (EJS 파일) 결과 감사합니다.

JavaScript 2023.03.26

[JavaScript] DOMCountentLoaded 사용하기

안녕하세요. 이번에는 JavaScript의 DOMCountentLoaded 기능에 대하여 알아보겠습니다. 1. DOMCountentLoaded 이 코드를 사용하면 JQuery의 document.ready와 크게 다를 바 없는 성능을 구현할 수 있다. 하지만 ie8이하에서는 지원하지 않기 때문에 본인이 대처해야 하는 환경이 어디까지인지 체크를 해 볼 필요가 있지만, 요즘은 ie8이하의 점유율이 대폭 낮아진 상태라 문제없이 사용할 수 있지 않을까라고 생각한다. window.addEventListener('DOMContentLoaded', function() { }); 제이쿼리를 사용하시는 분이라면 굳이 안 써도 되지만, JavaScript로 구현이 필요한 경우에 사용하시면 됩니다. 감사합니다.

JavaScript 2023.03.24

[JavaScript] Enter 값을 replace로 변경하여 저장하기

안녕하세요. 이번에는 Enter 값을 replace() 함수를 이용하여 변경하는 방법에 대해서 알아보겠습니다. 우선, 사용자가 글 입력 후 데이터를 MySQL에 저장할 때는 Enter 값이 이상 없이 들어가는 것처럼 보이지만, JavaScript로 다시 데이터를 불러올 때 값을 제대로 읽지 못하여 Error가 발생하는 현상이 있었습니다. 그래서 Enter 값을 변경해서 저장하는 방식을 구현해 봤습니다. MySQL에 데이터 저장 시 Enter 값을 으로 변경 후 저장하기 // content에서 엔터키 입력 저장 시 에러 발생 확인 // mysql 저장 할 때 엔터 키를 로 변경하여 저장 content: req.body.content.replace(/(?:\r\n|\r|\n)/g, ' ') MySQL에 저장..

JavaScript 2023.03.23

[JavaScript] Enter 이벤트

안녕하세요. 자바스크립트에서 Enter 이벤트 작성하는 방법입니다. login_pw 아이디를 가진 곳에서 Enter를 클릭하면 이벤트가 발생합니다. keyCode를 이제는 안 쓰는 것으로 알고는 있지만, 아직 사용하는 곳도 있기 때문에 2개다 작성하였습니다. document.getElementById('login_pw').addEventListener('keydown', (e) => { if (e.key == "Enter" || e.keyCode == "13") { // 실행할 코드 user_login(); } }); 감사합니다.

JavaScript 2023.03.22

[JavaScript] includes 함수

안녕하세요. 이번에는 includes 함수에 대해서 알아보겠습니다. includes 함수는 단어 또는 문장에서 본인이 찾고자 하는 단어가 포함되어 있는지를 확인할 수 있습니다. 사용 방식은 아래와 같습니다. text.includes('찾는 단어'); 찾는 단어가 있으면 True, 없으면 False를 반환합니다. 아래 코드는 다른 코드에서 사용하던 코드인데 예시용으로 가져왔습니다. if 문 앞이 엄청 길어 보이지만, 전부 확인할 필요는 없습니다. textContent로 가져온 글자에 '상승'이 포함되어 있으면, #ED3023 색으로 변경 '하강'이 포함되어 있으면, #0096FF 색으로 변경 'NEW"이 포함되어 있으면, #00CD3C 색으로 변경 아무것도 없으면 grey 색으로 변경 한다는 내용입니다. ..

JavaScript 2023.03.18
반응형