JSX 문법 3가지

JSX란? import logo from './logo.svg'; import './App.css'; function App() { return ( ) } export default App; App.js 이 우리의 메인 페이지다. App.js에 div 하나만 남기고 삭제해보자. JS파일인데도 동작하는 이유는 HTML이 아니라 JSX이기 때문이다. JSX란 JavaScript 안에서 HTML을 쉽게 작성할 수 있게 도와주는 부가기능 혹은 언어라고 생각하면 된다. JSX를 사용하면 기존 HTML처럼 간단하게 레이아웃을 만들 수 있다. JSX를 쓰는 이유는.. 기존 문법으로 에서 하나를 만들려면 아래와 같이 써야한다. (길다) React.createElement('div', null, 'Hello World'..

2022.11.11

Class 추가, 제거

JavaScript class 추가/제거하기 JavaScript로 HTML에 CLASS를 추가하거나 제거할 수 있다. ＊ 클래스 추가하기 element.classList.add(); var d = document.getElementById('div1'); d.classList.add('my-class'); ＊ 클래스 제거하기 element.classList.remove(); var d = document.getElementById('div1'); d.classList.remove('my-class'); ＊ IE9 이하를 지원해야 하는 경우 var d = document.getElementById('div1'); d.className += ' on'; // 앞에 공백을 넣어줘야 한다

2021.12.03