Notice
Recent Posts
Recent Comments
Link
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 |
Tags
- vs code 내 node
- ReactDOM.render is no longer supported in React 18. Use createRoot instead
- Do it 자바스크립트 + 제이쿼리 입문
- intllij 내 Bean을 찾지 못해서 발생하는 오류
- props
- 계산맞추기 게임
- 웹 게임을 만들며 배우는 리액트
- spring-boot
- node.js로 로그인하기
- Concurrently
- 거북이 대포 게임
- react
- JS 개념
- 따라하며 배우는 노드 리액트 기본 강의
- Colaboratory 글자 깨짐
- Python
- 노드에 리액트 추가하기
- 모던자바스크립트
- 리액트
- Spring-Framework
- googleColaboratory
- DB Browser
- You are importing createRoot from "react-dom" which is not supported. You should instead import it from "react-dom/client"
- 타자 게임 만들기
- node.js 설치
- intellij
- 모두의 파이썬
- 자바스크립트
- react오류
- 인프런
Archives
- Today
- Total
프로그래밍 삽질 중
[javascript] 여러가지 input 작성, scroll, object 길이 파악하기 본문
1) 여러가지 input 작성 후 값 불러오기
- 정확히 말하면 input 값에다가 버튼 클릭 시 값이 전달되게 하는 것
- 단계를 한 가지 더 둠(정확한 event.target.value 값을 찾기 위함)
const $english = document.querySelector(".matrix-input-eng-middle");
const $korean = document.querySelector(".matrix-input-kor-middle");
const english = $english.value;
const korean = $korean.value;
2) scroll
- 한정된 공간에서 div값이 추가 될 때마다 길이가 늘어남 방지
- 참고 : https://unikys.tistory.com/285
[Javascript] div (overflow:scroll) 스크롤을 가장 아래로 내리기
* HTML5를 하면서 AJAX로 얻어온 데이터를 div 태그에 뿌려주다보면 넘쳐서 스크롤바가 생기는 경우가 많다. 가장 대표적인 예가 채팅 프로그램을 만들 때 가장 아래로 스크롤을 유지해야하는데, div
unikys.tistory.com
.matrix-item-list {
flex: 1;
/* 헤더를 제외한 모든 높이 차지 */
overflow-y: auto;
/* 스크롤 기능 */
height: 500px;
overflow: scroll;
}
3) object의 길이 파악하기
- oject.keys(파악하고자 하는 값).length
- 참고 : https://hianna.tistory.com/452
[Javascript] 객체(Object) 속성(property) 개수 구하기
Javascript에서 배열이 가지고 있는 값의 개수는 배열의 length 속성을 통해 쉽게 구할 수 있습니다. [Javascript] 배열 길이 체크, 설정하기 (length) 그렇다면, 객체(Object)가 가지고 있는 속성의 개수는 어
hianna.tistory.com
const easyCount = Object.keys(wordDataSet.easy).length;
const middleCount = Object.keys(wordDataSet.middle).length;
const advanceCount = Object.keys(wordDataSet.advance).length;
let checkedCount = 0;
for (let i = 0; i < easyCount; i++) {
const easyCheckedCount = wordDataSet.easy[i].status;
console.log(easyCheckedCount);
if (easyCheckedCount === "C") {
checkedCount += 1;
}
}
for (let i = 0; i < middleCount; i++) {
const middleCheckedCount = wordDataSet.middle[i].status;
console.log(middleCheckedCount);
if (middleCheckedCount === "C") {
checkedCount += 1;
}
}
for (let i = 0; i < advanceCount; i++) {
const advanceCheckedCount = wordDataSet.advance[i].status;
console.log(advanceCheckedCount);
if (advanceCheckedCount === "C") {
checkedCount += 1;
}
}
console.log(checkedCount);
'과거 프로그래밍 자료들 > 프로젝트' 카테고리의 다른 글
[javascript] input 체크박스(JS에서 만든 경우) 의 체크 항목 개수 구하기 (0) | 2022.08.10 |
---|---|
[javascript] 객체의 값 반복문 사용, 반복되는 코드 함수로 통일 (0) | 2022.08.10 |
프로젝트 수정 8 - node.js로만 구성된 프로젝트에 리액트 추가(클라이언트 항목 : 인증하기) (0) | 2022.05.16 |
프로젝트 수정 7 - node.js로만 구성된 프로젝트에 리액트 추가(클라이언트 항목 : 로그아웃하기) (0) | 2022.05.16 |
프로젝트 수정 6 - node.js로만 구성된 프로젝트에 리액트 추가(클라이언트 항목 : 회원가입하기) (0) | 2022.05.16 |