윤인성 모던 웹을 위한 JavaScript + jQuery 입문 3판 63강 - jQuery 객체 > javascript

javascript

자바스크립트 강의 리스트

윤인성 | 모던 웹을 위한 JavaScript + jQuery 입문 3판 63강 - jQuery 객체

본문

※ 영상을 선명하게 보기 안내
  1. 유튜브 영상에서 오른쪽하단에 톱니바퀴를 클릭합니다.
  2. 팝업목록에서 "품질" 선택하세요.
  3. 원하는 해상도를 선택해주세요.
※ 모바일에서 Wifi가 아니라면 데이타가 소진될 수 있으니 주의바랍니다.
윤인성님의 javascript강의 청각장애인을 위한 자막
1544412064139.jpg

 안녕하세요 모던 웹을 위한 자바스크립트 제이쿼리 먼 3탄 63 강

되겠구요
이번 강의에서는 책이랑 순서를 약간 틀어서 제이쿼리 객체에 대해서
살펴보도록 하겠습니다
일단 자동완성 기능을 사용하기 위해서 제이쿼리 파일을 그대로 읽어 들이고
사용하도록 하겠습니다
어쨌거나 우리가 이전에 문서 객체를 배울 때 스크립트 태그 에서 문서
기치를 조작하기 위해서는 두 가지 방법이 잇다고 되었습니다
하나는 윈도우 점 온 로드 라는 것을 사용하는 것이 되겠구요
두번째는 스크립트 태그를 아예 바디 태그 의 가장 아래쪽에 입력을 해서
마지막에 실행되게 하는 것이었습니다
제이쿼리 에서는 이를 활용하기 위해서
도키 많다 짬
레디 라는 형태의 녀석을 사용하게 되는데요
유우 녀석이 무엇인지는 나중에 배우 겠지만 일단 윈도우 점 온 로드 와
같은 기능을 한다.고 기억을 해 주시면 좋겠습니다
일단 요 내부의 다 코드를 작성을 하셔도 되고요
우리는 조금 더 쉽게 볼 수 있게 요 아래 쪽에 다가 코드를 작성해
보도록 하겠습니다
특허나 이번 강의에서 알아볼 내용은 제이쿼리 객체입니다 j 컬을 개체는
요 달라 라는 함수로
만들게 되는 리턴값을 의미를 하게 되는데요
참고적으로 이딸라 를 보면 굉장히 이상하게 생각하실 수 있는데
제이쿼리 코드를 보시게 되면 내부적으로
요런 코드가 있어요 그래서 제이쿼리 라는 이름의 함수를
쉽게 요 단락이 5로 쓸 수 있게 만든 것입니다
어쨌거나 요녀석을 입력을 할때 매개변수의 굉장히 다양한 것을 넣을 수
있는데요 일단 문서 객체를 조작할 때 활용하는 3가지에 대해서 알아보도록
하겠습니다
일단 가장 처음 입력할 수 있는 것은 아
css 선택자 되겠습니다
유 안에다가 h1 이라고 입력을 하게 되면 화면 위에 있는 h1 태그를
선택을 하게 됩니다
두번째는
태그 형태의 문자 일이라고 할 수 있겠는데요
예를 들어서 h1 태그를 지금 화면에 보이시는 것처럼 아이의 직접적으로
입력을 하게 되면 이 제이쿼리 객체는
문서 객체를 생성하는 코드 가 됩니다
요 위쪽은 문서 객체를 선택하는 6 되겠구요
마지막으로
문서 객체를 직접적으로 넣을 수 있는데요 예를 들어서
to 킴 한테 짬
쿼리 셀렉터를 활용을 해서 h1 태그를 넣게 되면 우리가 기존에
자바스크립트에서 사용하던 문서 기체가 선택에 되겠죠
요녀석을 그대로 제이쿼리 함수의 매개 변수에 넣을 수 있습니다 그래서
요렇게 3가지 방법을 사용해서 제이쿼리 객체를 만들 수 있다라고 기억을
해 주시면 되겠습니다
일단 이렇게 만들어진 제이쿼리 객체는 정말 다양한 일을 할 수 있게
되는데요 이번 강의에서는 일단 쇄 까지만 살펴보도록 하겠습니다
가장 첫번째는 css 라는 함수 인데요
첫 번째 매개 변수 에다가 5칼라 라던지 등의 css 속성을 문자열로
입력을 해 주시고
두 번째 매개 변수 에다가 같을 입력을 해 주시게 되면 스타일의 지정하게
됩니다
뭐 이렇게 레드로 주실 수 있구요 뭐 예를 들어 섬
백그라운드로 칼라 같은 경우도 요렇게 해주셔도 됐고
아니면 기존의 자바 스크립트에서 입력 하던 것처럼 요렇게 주셔도 되는데
요 방법으로 동
속성을 입력할 수 있게 됩니다 물론 자세한 내용은 다음 강의에서 알아 볼
것이기 때문에 일단 요정도만 설명을 하겠구요
두번째로는 내부에 있는 글자를 조작할 수 있는 html 이라는 녀석입니다
내부 에다가 안녕하세요 라고 글자를 입력을 하게 되면 내부의 글자가
들어가게 됩니다
그럼 한번 요녀석을 실행해 보도록 할게요 코드를 저장을 하고 실행을 해
주시게 되면 아무것도 입력하지 않았던 여성 대부 에 안녕하세요 라는
글자가 들어가고 그 자는 붉은색 배경은 오렌즈 책으로 변경된 것을 볼 수
있습니다
어쨌거나 요러한 형태로 제이쿼리 대체 를 사용한다. 라고 생각해주시면
좋겠습니다
어쨌거나 문서 객체를 선택해서 사용할 때도 마찬가지라고 할 수 있겠는데요
이렇게 만든 녀석도 몸
css 로
칼날을 한번 블루 로 변경을 해 볼게요 블루 로 변경하게 되면 책상이
변경되는 모습을 확인할 수 있습니다
코드를 저장하고 다시 실행하게 되면 이제 파란색으로 변경 는 것을 볼 수
1점 그래서 요러한 형태도 문서 객체를 선택해서 활용할 수 있다라고
기억을 해 주시면 좋겠습니다
어쨌거나 요 아래에 있는 형태는 문서 객체를 생성해서 사용하는 녀석이라고
할 수 있겠는데요 이전에 크리에이트 엘레멘트 등을 활용을 해서 문서
객체를 만들어 쓸 때처럼 화면 어딘가에 붙여 해지 이 녀석을 출력할 수
있습니다
요걸 붙일 때는 4가지 이름 그리고 두 가지 종류의 기능을 활용할 하게
되는데요
그것과 관련된 내용은 이후에 살펴보고 일단 어펜드 투 만 알아보도록
하겠습니다
어펜드 툴을 사용하게 되면 u 뒤에 지정한 제이쿼리 객체 또는 제이쿼리
객체 일 매주 벤처에 넣을 수 있는 문자 열애
요 h1 태그를 붙이게 됩니다 예를 들어서 선택자 로 바디 태그 를
지정하게 되면 바디 태그 뒤에 h1 태그가 붙게 됩니다
뭐 이유로는 뭐 다양한 방법으로 쓸수 있습니다
예를 들어서 마찬가지로 css 선택자 를 활용해서 칼날을 레드로 병정
하실수도 있구요
html 속성 을 활용한 해서 메소드를 활용을 해서 내부의 뭐 안녕하세요
라는 글자를 추가적으로
입력을 하거나 헬로 월드 라는 글자도 추가적으로 입력을 할 수 있습니다
요 코드를 한번 좌장 하고 실행해 보도록 하겠습니다
실행하게 되면 헬로 월드 라는 글자가 붉은색으로 아래 쪽에 붙는 모습을
확인할 수 있습니다
어쨌건 오늘 강의는 여기까지 되겠는데요 간단하게 요 뒤에 있는 내용은 뭐
다음에 알아 볼 거니까 신경 쓰지 않으셔도 되고
제이쿼리 함수 욧 알람도 를 사용하게되면 매개 변수의 선택자 또는 문서
기체를 넣어서
문서 객체를 선택 을 할 수 있다 뭐 참고적으로 몸
요런 방법도 사용은 가능 이용
도큐먼트 점 크리 hl2 멘트를 한 다음에 h1 태그를 만들고
요 헤더 피를 넣어서 어펜드 툴을 하고 뭐 사용하는 방법도 사용가능
하지만 그런 일은 거의 안하기 때문에 생략하도록 하겠다 고 요
어쨌거나 요 두 방법으로 문서 객체를 선택 을 해서 제이쿼리 객체로 만들
수 있다라고 기억을 해 주시면 되겠고 아래쪽에 있는 방법으로 태그 형태의
문자를 넣어서 문서 객체를 생성할 수 있다라고 기억을 해 주시면
되겠습니다
따라서 오늘 강의에서 기억을 해 주실 내용은 문서 기치를 송 택할 때는
css 선택자 형태의 문자를 쓴 다음 두 번째 문서 객체를 곧바로
매개변수로 넣어서 문서 객체를 선택할 수 있다
세번째 태그 형태의 문자를 넣어서 문서 객체를 생성할 수 있다
요렇게 세가지 기억해 주시면 되겠습니다 어쨌거나 오늘 강의는 여기까지
되겠구요
그럼 다음 강의에서 뵙도록 하겠습니다 감사합니당.

댓글 0개

등록된 댓글이 없습니다.

본 사이트의 컨텐츠는 명시적으로 공유기능을 제공하고 있는 공개된 자료를 수집하여 게시하고 있습니다.

저작권, 강의등록, 광고, 제휴등은 "관리자에게 문의"로 메세지 주시면 확인후 답변드립니다.

Menu