스프링(egov)

제이쿼리, HTML 모음

웹꽃기사 2020. 11. 3. 01:24

location.href = [주소]

적힌 주소를 논리적으로 호출 get방식

a href = "#"

 #은 자기자신

 $("#leftUl > li").removeClass("active");

leftUl 이라는 id 의 자손중에서 list를

 선택

$("#leftUl > li").removeClass("active");

속성조작 메서드중 하나인 리무브클레스를 이용해서 active라고 

적혀있는 클레스를 지운다.

pageName = "${param.pageName}"

EL 태그를 통해서 pageName 이라는 이름을 가진 파라메타값을 가져

오고 그 값을 

지역변수 pageName 에 넣는다.

$('#' + pageName)

.addClass("active");

location.href 를통해서 넘긴 값은 'one' 이였으므로 pageName은 one이다

onclick="leftClickFn()"

인라인 이벤트 모델  on 붙어있는거 다 이벤트다

id 속성 : '하나의 문서'에서 유니크한 식별자 주는거다

'쿼리 스트링'

get방식으로 데이터 보내고 싶으면

?pageName= 로 보낸다

$("button")

제이쿼리 직접선택자 안에 요소명선택자를 이용해서 버튼 요소를

 타겟으로 잡은 거다.

alert($("button").text());

.text() = 객체 조작 메서드 (여러가지 있는데 그중에서 텍스트라는 

메서드 사용한것

$("button:eq(2)").text());

:eq 위치탐색 연산자고 0부터 시작

$("#twoBtn").click(function(){

    

});

이벤트 등록메서드(이벤트리스너 라고도 부르나 표준은아님) : 이벤트 대상 . 이벤트 종류 (이벤트 핸들러)

인라인이벤트 모델 vs

이벤트 등록메서드

인라인이벤트 모델이 빠를까요 이벤트 등록메서드가 빠를까요 두개다 똑같다.

onclick 을 써야할때가 있고 이벤트등록메서드를 써야하는 상황이 있다

둘중 누가 우월한거 없다.

$("#twoBtn").click(function(){

    alert($(this).text());

});

이벤트 등록 메서드 안에서의 this는 내가 클릭한 요소를 가르킨다.

왜 제이쿼를 감쌌는가.

$(this). 객체조작 메서드인 text()너무 쓰고 싶어서 제이쿼리 감싼거다.

$(document).ready(function(){  = $(function(){

이벤트 로딩 메서드(레디)

 

로드는 모든 요소가 다 브라우저에 다 뜬다음에 뜬다.

레디는 이미지 동영상을 제외하고 나머지가 그려지고 나서 뜬다.

 

인기없는 쇼핑몰은 로드 잘나가는 쇼핑몰은 레디

$("#leftUl > li")

아이디 선택자 | 자식선택자| 요소선택자

$("#leftUl > li").removeClass("active");

속성조작 메서드중 하나인 리무브클레스를 이용해서 active라고 적혀있는 클레스를 지운다.

alert($(this).children());

 > 로 자식잡을수없을때 이런식으로 .

alert($(this).children().eq(2).text());

alert($(this).children("td:eq(2)").text());

var $obj = $(this).children();

타입이 dom  - 즉 타입이 object

제이쿼리로 감쌌기 떄문에 변수도 $로 싸야한다 

변수명 하나만 봐도 가독성이 좋아야한다.