본문 바로가기

개발자 양성과정 필기노트/JavaScript9

제이쿼리 메서드 JSP || DAY9 || 제이쿼리 메서드 1. 속성 메서드 1) .attr ( "속성명" , "지정할 속성값" ) 지정한 '속성명'에 '속성값'을 지정한다. .attr( "속성명" ) : '속성명'의 속성값을 반환한다. 속성을 여러개 지정하는 경우, 중괄호 { }안에 콤마로 구분하여 지정할 수 있다. $("img").attr( { src:"korea.png", width:200, height:200 } ); 2) .removeAttr ( "제거할 속성명" ) 지정한 속성명과 일치하는 모든 속성을 제거한다. 3) .prop ( "속성명" , true ) .attr( ) .removeAtter( )메서드를 합친것. true / false로 "속성"을 적용/해제할 수 있다. 최신버전 제이쿼리에서 지원함. 4.. 2021. 9. 4.
제이쿼리 선택자 JSP || DAY8 || 제이쿼리 선택자 1. 기본선택자 1) 전체 선택자 $("*") 2) 요소명 선택자 $("요소명") HTML파일 내에, 지정한 요소에 해당하는 모든 요소를 배열에 담아 선택해온다. 따라서, 하나를 지정하고 싶다면 [n] 형식으로 인덱스를 지정해 선택해야한다. 3) 클래스 선택자, id선택자 $(".클래스명") , $("#아이디명") 4) 그룹선택자 (다중선택자) $("요소1, 요소2, 요소3, . . . ") 한번에 여러 개의 요소를 선택할 때 사용되는 선택자이다. 그룹선택자 사용시, 각각의 요소는 태그명이 기준이고, 같은 태그중에서는 id나 class로 구분한다. ex) $("div, span, p.myClass") //p태그 중 myClass 라는 이름의 클래스를 가진 요소를.. 2021. 8. 25.
History객체, 문서객체모델 ( DOM ) JSP || DAY7 || History객체, 문서객체모델 ( DOM ) 0. Window - History객체 - 사용자가 방문한 사이트중 이전에 방문한 사이트와 다음에 방문한 사이트로 다시 돌어갈 수 있도록 하는 속성과 메서드를 제공하는 객체. # 기본 문법 history.메서드( ) ; history.속성( ) ; # history객체의 메서드 / 속성 종류 back( ) : 이전 방문한 페이지로 이동시키는 메서드 forward( ) : 다음 방문한 페이지로 이동시키는 메서드 go(-n) : n단계 이전페이지로 이동시킨다. length속성 : 방문기록에 저장된 목록의 개수를 반환한다. 1. 문서객체모델 ( DOM ) - .html문서의 HTML태그들의 구조를 일컫는다. - 등의 모든 태그들. # 문.. 2021. 8. 10.
브라우저객체모델 BOM JSP || DAY6 || 브라우저객체모델 BOM 1. 브라우저 객체 모델 BOM ? : 웹브라우저에 내장된 객체를 뜻한다. # 계층구조 window - 1) document -1 body -2 div -3 img -4 a -5 form -6 input - 2) screen - 3) location - 4) history - 5) navigator 2. window 객체? - 웹브라우저객체 BOM의 최상위 객체. # window객체의 메서드 종류 1. open( ) - 새 브라우저 창을 띄움 / 팝업창 - 기본문법: window.open( 팝업창경로, 팝업창이름 , 옵션 ) ; * 옵션 종류 width 팝업창 너비 / height 팝업창 높이 / location 팝업창의 url영역 노출여부(숨김 =no,.. 2021. 8. 4.
Math메서드, 배열메서드 JSP || DAY5 || Math메서드, 배열메서드 0. Math._____메서드 Math.max (숫자1,숫자2,숫자3, 숫자4 . . .); : 괄호 안의 숫자 중 가장 큰 값을 반환한다. Math.min (숫자1,숫자2, 숫자3, 숫자4); : 괄호 안의 숫자 중 가장 작은 값을 반환한다. Math.round (num); : 소수점 첫째자리에서 반올림해 정수를 반환함. Math.floor (숫자); : 소숫점 첫쨰자리에서 무조건 내림해서 정수를 반환함. Math.ceil (숫자); : 소수점 첫째자리에서 무조건 올림해서 정수를 반환함. Math.random ( ); : 숫자 0.0과 1.0 사이의 랜덤값을 발생시켜 반환한다. Math.PI ; : 원주율 상수를 반환한다. # 0.0~1.0 해당범위.. 2021. 8. 3.
재귀함수, 내장객체 JSP || DAY4 || 재귀함수, 내장객체 0. 재귀함수 호출 - 최초의 함수를 호출하면 함수 정의문 내에서 실행문으로 함수를 다시 호출하는것. -> 함수를 반복문처럼 여러번 호출하기위해 사용한다. 1. 전역변수, 지역변수 - 전역변수: 함수 밖에있는 변수. - 지역변수: 함수 내에서만 존재할 수 있는 변수, 함수의 { } 밖에서 사용할 수 없다. 2. 객체 객체.메서드( ) ; 객체.속성 ; 또는 객체.속성 = 값 ; # 내장객체 - 문자(String) - 날짜(Date) - 배열(Array) - 수학(Math) # 브라우저 객체 모델(BOM) - window (브라우저) - location (주소창) - document (문서영역) - history - navigation # 문서객체모델(DOM).. 2021. 8. 2.
조건문 JSP || DAY3 || 조건문 0. prompt() : 인풋값을 받을 수 있는 알림창 띄우는 함수. var walkAmount = prompt("How many steps do you walk in a day?", "0" ); // 0은 기본값. # 숫자범위를 지정하기 *** 논리연산자를 이용해서 코드를 작성해야한다. if(mon >= 12 && mon 2021. 7. 29.
반복문, 함수 JSP || DAY2 || 반복문, 함수 0. 반복문 var 변수 = 초기값; var i = 0; while(조건식) { while(i var i = 1; while (i 2021. 7. 28.
증감연산자 JSP || DAY1 || 증감연산자 0. JSP 라이브러리 - 라이브러리? -- 자바스크립트를 이용하여 다양한 기능들을 쉽게 구현할 수 있도록 한 함수들의 집합. -- 대표적 : 제이쿼리, node.js, vue.js, * 불러오기 한 js파일이 먼저 구현되고, body tag에 작성된 html파일의 코드가 그 다음에 구현된다. 1. .js 파일에서 작성한 코드를 html파일로 불러오기 => 2. 증감연산자 # 증감연산자의 위치에 따라 결과값이 달라진다. result = num2++; // ++증가 연산자가 변수명 뒤에 있을때는 변수 result에 num2변수에 저장된 값을 먼저 저장한 후, // result = num2; // num2변수에 저장된 값을 나중에 1증가해 출력한다. //result = .. 2021. 7. 27.

티스토리툴바