빨간색코딩

JS를 이용한 HTML includeHTML에서 보통 머릿말, 꼬리말, 메뉴바 등이 흔하게 중복된다.(서버사이드언어나 동적언어를 사용하지 않는다면 메뉴가 바뀔때마다 전부다 수동으로 바꾸어 주어야한다.) 이러한 문제를 해결하는 방법에는 여러가지가 있겠지만 AJAX를 이용해서 해결해보자 1. 사용법에 를 넣어준다.에 를 넣고 를 호출해준다. 여기서는 navbar를 관리하고 있다.2. includeHTML.js 코드function includeHTML() { var z, i, elmnt, file, xhttp; z = document.getElementsByTagName("*"); for (i = 0; i < z.length; i++) { elmnt = z[i]; file = elmnt.getAttribute..

자바스크립트(JavaScript)를 들어가며 1. 자바스크립트란?약칭 js라고 하며 객체 기반의 스크립트 프로그래밍 언어이다. 주로 웹브라우저(스크립트엔진-인터프리터가 내장되어 있다)에서 사용한다. CSS가 디자인을 담당한다면 js는 클라이언트 단에서 웹페이지가 동적으로 랜더링하는 것을 담당해준다. 최근에는 node.js로 서버사이드부분에도 상당히 유명해졌다. 뿐만 아니라 앵귤러, 리액트, 리액트 네이티브는 웹과 앱개발에서 매우 상승세타고있다.. 주변에서 하도 리액트리액트거려서 리액트공부해야하나 싶을정도다ㅋㅋㅋ 결국 할거지만 2. 자바와는 관계가 있나요?자바스크립트는 자바와 이름이 비슷해서 착각을 할 수 있다. 자바와 문법, 구문이 유사한 점도 있지만, 이는 C언어를 조상으로 물려받았기 때문이며, 두 언..

HTML PART1 코드카데미 Learn HTML & CSS: Part I 를 소개한다. HTML, CSS는 웹의 기초이니 분명히 잘알아야 한다. HTML이야 태그 몇개없으니 금방 알게되지만 CSS같은 경우 레퍼런스문서나 잘 정리된 표들고 찾아 쓰는게 일반적이다ㅋㅋ 그래서 쓰면서도 (특히 비슷한 속성값일때) 이게 뭔지 뭔차이가 있는지 모를때가 있다. 코드카데미를 풀어가면서 조금이라도 햇갈릴 여지가 있는 것들을 정리해보았다. 아그리고 이거하면 영어독해 강제로 하게된다 사실 문제푸는것보다 독해하는게 더걸리는기분 2. HTML기본a태그: target="_blank" 를 쓰면 새 탭으로 연다W3C 표준: 들여쓰기는 스페이스 2칸와 태그의 차이점은 눈에 보이는 효과는 같으나 시각장애인에게 음성으로 읽어줄 때 st..

CSS를 배워보자 4. 선택자의 우선순위 CSS는 중복선언을 허용한다. 중복되는 속성이 있을경우 아래와 같은 우선순위로 처리된다.①. 속성값 뒤에 !important 를 붙인 속성 ②. HTML에서 style을 직접 지정한 속성③. #id 로 지정한 속성 ④. .클래스, :추상클래스 로 지정한 속성 ⑤. 요소이름으로 지정한 속성 ⑥. 상속된 속성 같은 우선순위에 있는 경우, 나중에 선언된 것이 우선되어 적용된다. 5. 명시도 계산법 !important > id [ 100 ] > class [ 10 ] > tag [ 1 ] > * [ 0 ] ID 선택자의 갯수를 세어서 개당 100 으로 계산한다. 클래스 선택자의 갯수를 세어서 개당 10 으로 계산한다. 태그 선택자의 갯수를 세어서 개당 1 로 계산한다.공..

CSS를 배워보자 1. CSS란? Cascading Style Sheets 라고하며, HTML과 같은 마크업 언어들이 실제 표시되는 방법을 기술하는 언어이다. W3C의 표준이며 레이아웃과 스타일을 정의할 때 주로 쓴다. 마크업 언어가 몸체를 이룬다면 CSS는 그것을 꾸며주는 역할을 하는 것이다. 2. 선언방식 공백은 W3C 표준에서 들여쓰기는 스페이스 2칸을 권장하고 있다. 각 선택자간에는 한줄의 여백을 권장한다. 선언방식으로는①. in-line: 태그안에서 속성으로 추가. ②. internal: head안에 넣어서 선언 ③. external: head안에 링크넣어서 선언 3. 선택자 보기 쉽게 표로 만들어보았다 선택자 선택자명 설명 * 전체 선택자 모든 요소를 선택한다 #id ID 선택자 id값이 같은..