목록공부/html&css&javascript (11)
ㅤ스폰지허의ㅤ🐶🐾 블로그
css media 쿼리 문법 구조 @media (조건) { 스타일 } 조건 부분이 만족된다면 스타일이 적용된다. 조건 ex) 800px 이하의 화면에서 바꾸고 싶다. @media (max-width: 800px ) { 스타일 } ex) 800px 이상의 넓은 화면에서 바꾸고 싶다. @media (min-width: 800px ) { 스타일 } @mixin, @include @mixin 함수와 비슷한 동작을 하는 문법, css 스타일시트에서 반복적으로 재사용할 css스타일 그룹 선언을 정의하는 기능을 한다. @include mixin으로 정의해준 스타일 그룹을 호출할 때 사용한다. @mixin, @include는 항상 함께 사용되며 mixin을 사용하면 그룹 단위의 스타일을 변수처럼 적용할 수 있다. 여러..
$.ajax({ type: 'PUT', url: url, data: file, headers: {'x-amz-acl': 'public-read', 'Content-Type': file.type, 'Access-Control-Allow-Origin': '*'}, processData: false, contentType: file.type, async: false, success: function (request) { returnTf = true; }, error: function (xhr) { alert(file.name + '업로드 중에 오류가 발생했습니다. 파일 업로드 실패'); returnTf = false; } }); ncloud object storage로 ajax call을 보내는데 모르는 설정..
옛날 코드들을 보면 var를 많이 썼기 때문에 옛날 글들을 참고하다보면 아무생각없이 var로 코딩을 하곤 했다. 근데 var는 함수 코드 블록만을 지역 스코프로 인정하기도 하고 중복선언이 가능하기 때문에 예상치 못한 결과를 가져올 수 있다. 그래서 블록 레벨 스코프를 지원하는 let, const를 사용하는 것이 좋다. 함수레벨스코프와 블록레벨스코프, var let const의 특징들을 짚어보고 가자.(맨날까먹으니까..) 함수 레벨 스코프 - 함수의 코드 블록만을 지역 스코프로 인정한다. 블록 레벨 스코프 - 함수, if, for, while, try/catch문 등 지역 스코프로 인정한다. var 특징 변수 중복 선언 가능, 예기치 못한 값 반환 함수 레벨 스코프로 인해 함수 외부에서 선언한 변수는 모두..
ECMAScript 6(2015) Default Function Parameter function 함수이름(param1 = defaultValue1,...){} -JavaScript에서 함수의 매개변수는 undefined가 기본이다. 일부 상황에서는 다른 기본 값을 설정하는 것이 유용할 수 있다. 이 때 바로 기본 값 매개변수가 필요할 때이다. -undefined 혹은 누락된 파라미터에 대해서만 동작한다. Rest Parameter ※ …args 는 맨 마지막에만 올 수 있다. function 함수이름 (...args){} -rest파라미터는 배열로 sort, map, forEach 또는 pop 같은 메소드가 적용될 수 있다. function f(a,b){ //arguments → 배열로 변환 var a..
2022년 5월 16일 자바스크립트 끝 강의자료 13일거에 마저 정리하고 블로그 올리기! jquery 시작 제이쿼리(jQuery) 소개 -자바스크립트를 쉽게 활용할 수 있도록 도와주는 오픈소스 기반의 자바스크립트 라이브러리이다. -https://jquery.com/ 사이트 참고할 것 jQuery 메서드 - $() 형식으로 표기한다. $()=jQuery() 똑같은 의미 1. jQuery(selector [, context]) -DOM에서 선택자에 해당하는 엘리먼트들을 검색하여 jQuery 객체로 반환한다. 2. jQuery(element) -DOM 엘리먼트를 jQuery 객체로 반환한다. 3. jQuery(object) -PlainObject를 jQuery 객체로 반환한다. ※ PlainObject : {..
2022년 5월 13일 DOM 이벤트 처리 1.이벤트 등록 -자바스크립트 이벤트 처리는 addEventListener() 함수에서 시작한다. [Element Node].addEventListener(‘이벤트타입’, function(e){ //이벤트 객체 //event handler, 콜백함수 }); 1) 이벤트 타입 -사용자가 웹페이지에서 발생시킨 액션이다. (click, keydown …) 2) 콜백 함수 -이벤트가 발생하면 자동으로 실행되는 함수이다. 파라미터로 이벤트 객체가 전달되며, 이벤트 객체에 이벤트를 발생시킨 HTML 요소(타겟)와, 다양한 이벤트 정보가 들어있다. ※이벤트 타입 이벤트명 타입 대상 발생 시점 DOMContentLoaded load 이벤트 UI이벤트 DOM 도큐먼트, 엘리먼트..