프론트엔드

React

[React] props

props React에서 속성은 props 이라고 한다. Component에 props를 장착할려고 한다. props는 Header 함수에 WEB이라는 값에 속성을 넣지않고 Header Component에 속성을 넣고 싶을떄 사용한다. 위와 같이 Component에 속성을 Header 함수에 props.title을 사용할수있다 retrun 값에 들어가는 구문에 { } 중 가로를 사용한다. 중 가로에 있는 값은 일반적인 문자열이 아닌 표현식으로 취급되기 때문에 값이 반영된다. 목록같은것도 하드 코딩하는것 보다 props를 사용하여 topics의 배열에 저장하여 (id는 고유한 값으로 변경해야 한다.) lis의 배열안에 for문을 사용하여 i는 props.topics.length( )topics의 원소의 숫..

JavaScript

[JavaScript] XMLHttpRequest

XMLHttpRequest 객체 const xhr = new XMLHttpRequest(); const method = "GET"; const url = ""; xhr.open(method, url); /* open() 함수를 통해 요청을 초기화한다. onreadystatechange 이벤트를 이용해 요청에 대한 응답 결과를 처리합니다. onreadystatechange 프로퍼티는 XMLHttpRequest 객체의 readyState 프로퍼티 값이 변할 때마다 자동으로 호출되는 함수를 설정합니다. */ xhr.onreadystatechange = function (event) { /* onreadystatechange 프로퍼티(속성)에 콜백함수 설정 응답이 와서 상태값이 변하면 호출된다. */ const..

JavaScript

[JavaScript] document

document .querySelector 클릭 function myFunc(){ var boxList=document.querySelectorAll("#wrap>#box") //#wrap하위의 #box모두 접근 boxList[0].innerText="변경111" boxList[1].innerText="변경222" } function myFunc2(){ var boxList=document.querySelectorAll("#wrap>#box") //#wrap하위의 #box모두 접근 alert(boxList[0].innerText) alert(boxList[1].innerText) } wrap 하위 box로 접근도 가능하고, 배열 안에 넣어서도 사용가능하다. .getElementById 클릭 ID에 의한 ..

JavaScript

[JavaScript] JSON

JSON JSON 예시 var personList = [ {name:"이민호",age:20,height:176.6}, {name:"정채연",age:21,height:162.4}, {name:"송중기",age:22,height:178.7} ] //------------------------------------------------------------- var inputName=prompt("이름 입력") var inputAge=prompt("나이 입력") inputAge=parseInt(inputAge) var inputHeight=prompt("키 입력") inputHeight = parseFloat(inputHeight) personList.push({name:inputName,age:inputAg..

JavaScript

[JavaScript] 객체생성

객체생성 Data 객체 var date = new Date() //Date객체 생성 //new - 메모리 생성 연산자 var year=date.getFullYear()//년 var month=date.getMonth()+1//월 var day = date.getDate()//일 var hour = date.getHours()//시 var min = date.getMinutes()//분 var sec = date.getSeconds()//초 if(month < 10){ month = "0"+month } if(day < 10){ day = "0"+day } var format = year+"-"+month+"-"+day+" " format = format + (hour+":"+min+":"+sec) doc..

HTML&CSS

[HTML / CSS] 기본태그 모음 상세

! 모든 캡쳐본은 직접 작성한것입니다. Ctrl + F 를 사용하면 좀 더 빠르게 해당 태그를 찾으실수 있습니다.

Potato Ongsim
'프론트엔드' 태그의 글 목록