:j
[JavaScript] html 문서에 JavaScript를 포함할때 어떻게 포함하는게 효율적일까? (head,body,defer, async)
blocked -> fetching.js -> executing.js -> parsing.html head blocked -> fetching.js -> executing.js -> parsing.html 1.parsing html 사용자가 html 파일을 다운로드하였을 때 브라우저가 1줄씩 parsing 하게 된다. 이때 css와 병합해서 dom요소로 변환하게 된다. 2.blocked html을 쭉 parsing 하다가 script 태그가 보이면 main.js를 다운로드해야 되네?라고 이해하고 html parsing을 멈추게 된다. 3.fetching.js script 태그에 해당되는 main.js 파일을 서버에서 다운로드 받게 된다. 4.executing.js 다운로드가 완료되면 main.js파일을 ..
[프로그래머스] Level 1 : 시저 암호(JAVA)
시저 암호 문제 설명 어떤 문장의 각 알파벳을 일정한 거리만큼 밀어서 다른 알파벳으로 바꾸는 암호화 방식을 시저 암호라고 합니다. 예를 들어 "AB"는 1만큼 밀면 "BC"가 되고, 3만큼 밀면 "DE"가 됩니다. "z"는 1만큼 밀면 "a"가 됩니다. 문자열 s와 거리 n을 입력받아 s를 n만큼 민 암호문을 만드는 함수, solution을 완성해 보세요. 제한 조건 공백은 아무리 밀어도 공백입니다. s는 알파벳 소문자, 대문자, 공백으로만 이루어져 있습니다. s의 길이는 8000이하입니다. n은 1 이상, 25이하인 자연수입니다. 입출력 예 s n result "AB" 1 "BC" "z" 1 "a" "a B z" 4 "e F d" 코드 class Solution { public String soluti..
[프로그래머스]Level 1 : 서울에서 김서방 찾기(JAVA)
서울에서 김서방 찾기 문제 설명 String형 배열 seoul의 element중 "Kim"의 위치 x를 찾아, "김서방은 x에 있다"는 String을 반환하는 함수, solution을 완성하세요. seoul에 "Kim"은 오직 한 번만 나타나며 잘못된 값이 입력되는 경우는 없습니다. 제한 사항 seoul은 길이 1 이상, 1000 이하인 배열입니다. seoul의 원소는 길이 1 이상, 20 이하인 문자열입니다. "Kim"은 반드시 seoul 안에 포함되어 있습니다. 입출력 예 seoul return ["Jane", "Kim"] "김서방은 1에 있다" 코드 class Solution { public String solution(String[] seoul) { for(int i = 0 ; i < seoul...
[프로그래머스]Level 1 : 문자열 내 p와 y의 개수(JAVA)
문자열 내 p와 y의 개수 문제 설명 대문자와 소문자가 섞여있는 문자열 s가 주어집니다. s에 'p'의 개수와 'y'의 개수를 비교해 같으면 True, 다르면 False를 return 하는 solution를 완성하세요. 'p', 'y' 모두 하나도 없는 경우는 항상 True를 리턴합니다. 단, 개수를 비교할 때 대문자와 소문자는 구별하지 않습니다. 예를 들어 s가 "pPoooyY"면 true를 return하고 "Pyy"라면 false를 return합니다. 제한사항 문자열 s의 길이 : 50 이하의 자연수 문자열 s는 알파벳으로만 이루어져 있습니다. 입출력 예 s answer "pPoooyY" true "Pyy" false 입출력 예 설명 입출력 예 #1 'p'의 개수 2개, 'y'의 개수 2개로 같으므로..
[프로그래머스]Level 1 : 약수의 개수와 덧셈(JAVA)
약수의 개수와 덧셈 문제 설명 두 정수 left와 right가 매개변수로 주어집니다. left부터 right까지의 모든 수들 중에서, 약수의 개수가 짝수인 수는 더하고, 약수의 개수가 홀수인 수는 뺀 수를 return 하도록 solution 함수를 완성해주세요. 제한사항 1 ≤ left ≤ right ≤ 1,000 입출력 예 left right result 13 17 43 24 27 52 입출력 예 설명 입출력 예 #1 다음 표는 13부터 17까지의 수들의 약수를 모두 나타낸 것입니다. 수 약수 약수의 개수 13 1, 13 2 14 1, 2, 7, 14 4 15 1, 3, 5, 15 4 16 1, 2, 4, 8, 16 5 17 1, 17 2 따라서, 13 + 14 + 15 - 16 + 17 = 43을 r..
[HTML] <form>, 다양한 input type, 식별자(id, class, name), <a> vs <form>
식별자 id 고유한 식별을 목적으로 하는 경우 사용 페이지에서 하나의 요소만 지정 가능 class 재사용을 목적으로 하는 경우 사용 여러 개의 요소에 지정 가능 name form 컨트롤 요소의 값(value)을 서버로 전송하기 위해 필요한 속성 여러 개의 요소에 지정 가능 id : javascript에서 접근 목적. 현 페이지에서 한 개만이 유효 == Javascript class : js에서도 접근이 가능하지만, 일단은 css에서 디자인적인 요소인 경우가 많다. == css 쪽에서 주로 사용, 현 페이지에서 다중으로 설정이 가능하다. name : 값을 전달하기 위한 목적을 가지고 있는 경우가 많다. 다중 설정이 가능하다. 즉, A페이지에서 B페이지로 이동하는 경우 값을 넘겨준다. vs 두 태그의 공통점..
![[HTML] 리스트 만들기 <ul>, <ol>, <li>](https://img1.daumcdn.net/thumb/R750x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2Fb6D2cq%2Fbtq6u25HJ6e%2FcsUk7oUrJ7XTJmOlAda0x1%2Fimg.png)
[HTML] 리스트 만들기 <ul>, <ol>, <li>
: unordered list (순서 없는 목록) 속성 disc : 검정원, default circle : 하얀원 square : 네모 none : 글자만 나타내기 : ordered list (순서 있는 목록) 속성 type : 순서를 어떤 식으로 표시할지 타입을 정할 수 있다. 1 a A i I start : 시작하고 싶은 번호를 정할 수 있다. default로 1부터 시작하지만, 100번 혹은 30번부터 시작하고 싶을 때 사용 list안에 list 또한 사용이 가능하다. 안에 사용 가능, 반대로도 사용이 가능하다. 예제1 : coffee tea milk coffee tea milk 예제2 : attribute coffee tea milk 예제3 : type coffee tea milk 예제3 : ty..
![[HTML] 테이블 만들기 <table>tag, <tr>, <th>, <td>](https://img1.daumcdn.net/thumb/R750x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FbVGAbS%2Fbtq6vhVWKxy%2FpDC7ySlSHZJ7DjJfSBXB8k%2Fimg.png)
[HTML] 테이블 만들기 <table>tag, <tr>, <th>, <td>
테이블 만들기 태그 설명 테이블을 만드는 태그 테이블의 헤더부분을 만드는 태그 defalut값 : , 가운데정렬 테이블의 행을 만드는 태그 테이블의 열을 만드는 태그 속성 border : 테이블의 라인을 나타낸다. border설정을 안 하는 경우 테이블의 형태만 보인다. bgcolor : 테이블의 색상을 설정 행과 열의 색상도 따로 정할 수 있다. width : 테이블의 가로 크기를 설정 칼럼의 폭도 조절할 수 있다. height : 테이블의 세로 크기를 설정 colspan : 가로 합치기(열 합병) rowspan : 세로 합치기(세로 합병) rules : rows, cols, all 등등 다양한 속성 값들이 있다. rows는 테이블의 세로줄을 없애고 가로줄만 나타냄 cols는 테이블의 가로줄을 없애고 ..
![[HTML]<img> 태그, src 속성, alt 속성, title 속성, image파일 종류](https://img1.daumcdn.net/thumb/R750x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FEZXhP%2Fbtq6q0NwhiT%2F3vbJpWtxpgqhTb38hCl7aK%2Fimg.png)
[HTML]<img> 태그, src 속성, alt 속성, title 속성, image파일 종류
image파일 종류 jpg png gif bmp tiff tga 용량(작은순서) 1 3 2 6 4 5 압축율 1 x jpg : 용량이 제일 적은 만큼 퀄리티는 떨어진다. bmp : 압축이 불가. 원래는 안드로이드, 아이폰에서 사용했는데, bmp로 사용할 경우 투명 이미지(sprite) 처리를 따로 해줘야 하는 번거로움이 있어서 png를 사용한다. png : 안드로이드, 아이폰에서 주로 사용 (제일 마지막에 나옴) 투명처리가 들어가 있다. 문서에 이미지를 넣는 태그 src : 필수 특성이며, 이미지의 경로를 지정 img는 하드웨어에서 불러 오는것이 아니다. 즉, 하드웨어 상에 저장되어 있는 절대 경로를 입력해서 이미지를 불러올 경우 이미지를 찾아올 수 없을 것이다. 왜? 서버에서 불러오는 것이기 때문에 (..
[HTML] <a>태그 (anchor tag)
: anchor(link) 다른 웹사이트로 이동하는 링크 구글로 이동 구글로 이동 속성 href : 연결할 주소를 지정 target : 링크를 여는 방법 _self : 링크를 클릭한 해당 창에서 열기 (default) _blank : 링크를 새창으로 열기 _parent : 부모 창에서 열기 _top : 전체 브라우저 창에서 가장 상위의 창에서 열기 title : 해당 링크에 마우스 커서를 올렸을때 나오는 링크의 설명을 설정 실습 jhost 블로그로 이동(새창으로 열기) jhost 블로그로 이동(새창으로 열기)