본문 바로가기

개발일지

 (233)
[js] 중첩 for문 - 별찍기 중첩 for문은 말 그대로 for문 안에 또 for문이 있는 것입니다. 실행 i는 1부터 10까지 실행이 되고, j는 i의 숫자 만큼 실행이 됩니다. 그래서 1열에는 1행까지만 2열에는 2열까지 순차적으로 늘어나는데요. 그 숫자 만큼 별(*)이 출력 되는 과정입니다. function tree(){ for(i=1; i=i; j--){ document.write("*"); } document.write(" "); } } j를 10부터 시작하고 j>=i 일 때 실행을 하면 위 그림과 반대로 출력이 됩니다. 증가가 되는 게 아니라 증감이 되어야 하는 게 맞겠죠? 그래서 i줄은 그대로고 j만 (j=10; j>=i; j--)가 됩니다. 그리고 위에 두 개를 합치면 이런 모양이 나온답니다^^
[js] 1부터 100까지의 합을 구하기(반복문-for) 반복문이란? 어떠한 조건을 반복적으로 실행할 때 사용한다. if문에 이어서 가장 많이 사용! for(초기값; 조건값; 증가값){ 실행 } 1부터 100까지 합 var sum = 0; 자바스크립트는 원래 초기화 및 선언을 안 해도 되지만 깨끗한 상태에서 계산하기 위해 해줬다. sum이 결과값이 될 예정이고 for(i=0; i
[js] 학점구하기 (조건문-Switch) & 숫자형과 문자형 2021.09.07 - [FrontEnd/JavaScript] - [js] 코드를 간단하게 쓰는 방법과 조건문(if, else if) [js] 코드를 간단하게 쓰는 방법과 조건문(if, else if) 점수를 입력 받아 학점을 계산하는 문장이 있다. Document 점수를 입력 받아 학점을 계산하는 문장이다. 등급을 뜻하는 grade 변수를 선언한다. prompt로 입력 받은 성 practice365.xyz 전 게시물에 이어서 ··· if와 else if가 많아 졌을 때 복잡하니까 Switch문을 쓰는 경우가 있습니다. 하지만 실제로는 if문이 더 자주 사용된다고 합니다. 그래도 기본으로 알고 있어야 하는 공식이라고 함! 학점은 B입니다. var ss = prompt("성적입력"); 로 사용자의 성적을 ..
[js] 코드를 간단하게 쓰는 방법과 조건문(if, else if) 점수를 입력 받아 학점을 계산하는 문장이 있다. 점수를 입력 받아 학점을 계산하는 문장이다. 등급을 뜻하는 grade 변수를 선언한다. prompt로 입력 받은 성적은 ss로 선언해준다. if 만약 ( ss >= 90 ) 입력 받은 ss(성적) 90보다 크다면? grade는 A가 된다. 메인을 가능한 간단하게 만들기 위해서는 이 방법을 많이 사용한다. 여러 번 부르기도 좋다. function 함수를 만들어서 body - sctipt 안에서 불러주면 끝!! function ff(){ var grade = ""; /* null값 */ var ss = Number(prompt("성적입력")); if(ss >= 90) grade="A"; else if( ss >= 80 ) grade="B..
[js] 팝업창 띄우기(alert, confirm, prompt) 1. alert 얼러트 알리다 : 주의 등의 팝업창을 띄운다. alert는 말 그대로 주의사항을 팝업창을 띄워서 안내하는 역할을 합니다. 그래서 확인 버튼 말고는 기능이 없어요. 바로 나가지 않는 다면 꼼짝 없이 그림(귀여운 강아지 사진)을 봐야 합니다. 추가로 이런 기능도 함께 배웠습니다. 이미지 태그 안에 넣는 옵션으로 마우스를 올렸을 때, 마우스를 뗐을 때 서로 다른 그림을 설정할 수 있어요. 처음 홈페이지에 들어 갔을 때 사진까지 총 3장을 올릴 수 있겠죠? 하지만 주로 마우스를 올렸을 때만 다른 사진을 넣곤 합니다. onmouseover 마우스를 올렸을 때 "this.src 이 주소의 사진을 띄워라 큰 따옴표(") 안에는 무조건 작은따옴표(')가 들어가야 하기 때문에 주소는 './img/국화.j..
div 페이지의 구역 나누기와 sementic 시멘틱 태그 결과는 같지만 두 가지의 버전이 있따. H N S A F div (division 디비전 분할) 화면을 분할할 때, 영역을 박스화 할 때 사용하는 태그이다. 아래에서 더 자세한 설명을 하겠다. H N S A F 시멘틱 태그란? 각 위치에 따른 태그에 의미부여를 한 것이다. 코드를 보고 어떤 부분인지 빠르게 이해할 수 있다는 장점이 있다. 웹 문서의 구조를 만들 때 꼭 시멘틱 태그를 이용할 필요는 없지만 이왕이면 사용하는 게 좋다. 시멘틱 태그가 나오기 전에는 div로 구별을 했었다고 한다. 지금도 그렇게 사용하는 곳들도 많다고 함! header 주로 상단/왼쪽에 위치하는 페이지의 제목 nav 네비게이션 줄임말로 홈페이지의 다른 페이지로 이동하거나 다른 사이트로 이동할 수 있는 메뉴 영역 section 콘..
javaScript 첫시작! 글자와 그림출력하기(기본구조) 아직 한 시간 밖에 안 배워서 부족하지만 기록해 보려고 합니다. 확장자는 똑같이 .html을 쓴다. 안에 html에서 사용하던 줄바꿈 태그 를 출력 안에 넣으면 된다. "쌍따옴표", '따옴표' 둘 다 가능! 안녕하세요! 반갑습니다! 이런 모양이 출력된다. 그런데 실제로는 이런 방법을 잘 쓰지 않는다고 한다. 자주 쓰는 유형을 살펴보자. 지금까지 태그 안에 넣었다면 이번엔 function 함수명(){ 중괄호 안에 선언을 해야한다 } 바디쪽 스크립트에서 함수명();으로 호출을 하면 끝 안녕하세요 여기까지가 기본골격이고 더 나아가자면... welcome 하나씩 나눠서 설명을 하자면... welcome 일단은 버튼부터 만들자. 태그 안에 태그를 쓰고 옵션은 onclick 버튼을 눌렀을 때 welcome 함수가 ..
html 리스트, 프레임, 불러오기 복습 전체화면 / 메뉴에 마우스 올렸을 때 / 클릭 했을 때 여기에 이런 페이지가 있다. 메인에 메뉴와 초록색 배경화면이 있는 조촐한 페이지가.. 메뉴에 마우스를 올려 놓으면 주황색이 되고, 클릭했을 때 각자의 사이트가 새 창에 뜨는 것이 아니라 아래 초록색 화면에 뜬다. 일주일 동안 내가 배웠던 것들이 이 사이트 안에 다 들어있는 것이다. 파일은 3가지를 준비하면 된다. 1. green.html 첫번째 파일 정말 별 거 없다. head - style에 배경색을 깔아주는 것 뿐이다. 2. menu.html 인천일보아카데미 인천시청 서울시청 네이버 다음 위쪽에 들어가는 메뉴를 만드는 html 파일이다. 리스트 태그를 이용해서 일단 메뉴들을 만들어준다. 하이퍼링크도 걸어준다. css에서 원하는대로 꾸며준다. 여기..

티스토리툴바