event(5)
-
props
PROPS img import reactImg from './assets/exam.png'; function App() { return ( {/* public 폴더에 sample.png 붙여넣기 할것*/} ); }; export default App; PROPS index.js 에서 막으면 결과가 출력 한번만 됨 import React from 'react'; import ReactDOM from 'react-dom/client'; import './index.css'; import App from './App.js'; import reportWebVitals from './reportWebVitals'; const root = ReactDOM.createRoot(document.getElementByI..
2024.03.17 -
click, event, preventDefault, eventBus
event01_click2 {{ result }} 값1: 값2: + - * / 이벤트 실습 가격: 갯수: 10 15 20 {{ total }} 도서목록{{ msg }} {{ book.name }}, {{ idx }}번, 가격: {{ book.price }} 삭제 선택삭제 람다 도서목록{{ msg }} {{ book.name }}, {{ idx }}번, 가격: {{ book.price }} 삭제 선택삭제 이벤트 @click="prevent” preventDefault(); target.html로 이동 {{ msg }} 다음 -preventDefault 구글 전송 이벤트 수식어 {{ msg }} x() x() once 2. preventDefault이벤트 수식어 다음1 y 다음2 y2 다음2 prevent ..
2024.03.14 -
v-if /v-for/ v-on event
dummy hello1 dummy dummy hello2 dummy hello3 hello4 {{ amount }} 100보다 큰 값만 입력 가능 정상적으로 입력 directive05_exam5 exam 이름: 이름은 4글자 정상적으로 입력 나이: 10살보다 크거나 120살보다 작은 값만 입력가능 이름길이 :{{ username.length }}, 나이: {{ age }} elseif 점수: 점수는: {{ grade }} A학점 B학점 C학점 F학점 v-for array {{ names }} index 없이 - {{ name }} index 지정 {{ index }}: {{ name }} v-for (img, select,div 그룹핑 img-bind ./components/BookList.vue Boo..
2024.03.13 -
json , ajax
map merge trim parseJSON 중요★★★★ each 100 200 300 400 100 200 300 400 합계 event a b ok ok2 $(function(){ //이벤트 $("#a").one("click", function(){ //이벤트를 한번만 실행 이벤트 실행후 자동으로 off ("click") 됨 console.log("ok"); }) }); $(function(){ //이벤트 $("#a").on("click mouseover", function(){ //이벤트를 한번만 실행 이벤트 실행후 자동으로 off ("click") 됨 console.log(" a 버튼 ok"); }) $("#b").on("click",function(){ console.log("trigger 버튼..
2024.01.15 -
DOM, EVENT
BOM 몸의 바깥 reload target.html location.href='targrt.html' target2.html location.href='target2.html' target3() 전송 폼밖 전송안됨 DOM 사과 바나나 수박 포도 사과 바나나 수박 포도 사과 바나나 수박 포도 가격 수량 10 20 30 40 총 가격 홍갈동 이순신 유관순 확인이순신 좋아하는 과일 선택하기 사과 오렌지 바나나 결과보기 모두선택1 모두선택2 좋아하는 과일 선택하기 사과 오렌지 바나나 결과보기 event 클릭 이벤트 정보 클릭 이벤트 정보 클릭 이벤트 정보 클릭 이벤트 정보 인라인 방식 window.onload = function(){ var imgs = document.getElementsByTagName("i..
2023.12.24