메뉴 건너뛰기

조회 수 428 댓글 1

<!DOCTYPE HTML>
<html>
<head>
<meta charst="UTF-8">
<title>9-8(이벤트 객체의 target)</title>
</head>
<body>
<script>
function init(){
 var text = document.getElementsByTagName("li");
 for(i=0; i<text.length; i++) {
  text[i].addEventListener("click", click, false);  
 }
}
function click(e){
 var n=0;
 switch(e.target.id) {
  case "0" : n = 0; break;
  case "1" : n = 1; break;
  case "2" : n = 2; break;
  case "3" : n = 3; break;
  }
  Stronger(text[n],e);
 }
function Stronger(text, e){
 text.style.font-size=1.3em;

 

</script>
<h3>아이템을 클릭하면 1.3배 크기로</h3>
<hr>
<p>여름 방학 때 하고 싶은 것들
<ul onload="init()">
 <li id='0'>자전거로 대한민국 일주</li>
 <li id='1'>책 100권 읽기</li>
 <li id='2'>철인 3종 경기 준비</li>
 <li id='3'>자바스크립트 정복</li>
</ul>
</body>
</html>

 

이같이 실행해본 결과   text.style.font-size=1.3em; 이 문장이 assign이 안된다고 에러(Uncaught ReferenceError: Invalid left-hand side in assignment:레퍼런스가 잘못됬다고 하는것 같습니다.)가 뜹니다. 어디가 잘못된건지 이해가 잘안됩니다..
그리고 저문장을 고치면 실행이 될까요?? 아니면 다시 공부해야할까요?? 궁금합니다. ㅠ

?
  • ?
    관리자 2018.05.20 23:58

    열심히 공부하시는군요!

    프로그램에서우선 3가지 오류가 보입니다. 다른 오류가 더 있는지 모르겠지만...

    1. text.style.font-size=1.3em;
    CSS3 스타일이 DOM 객체의 프로퍼티로 사용될 때는 하이픈(-)를 없애고 다음과 같이 씁니다(교재 p.359 참고).
    text.style.fontSize=1.3em;

    그리고 1.3em은 문자열로 나타내어 다음이 최종적으로 옳은 표현입니다.
    text.style.fontSize="1.3em";

    2. Stronger(text[n],e);
    text 변수는 init() 함수 내에서 선언되었기 때문에 init() 함수 내에서만 사용됩니다. 그러므로
    click() 함수에서는 사용할 수 없습니다. 다향히 e.target이 바로 현재 사용자가 클릭한 DOM 객체이므로
    이를 다음과 같이 고치면 됩니다.(교재 p.397 참고)
    Stronger(e.target,e);

    3. <ul onload="init()">
    onload 이벤트가 발생하는 곳은 <body> 태그여야 하므로 다음과 같이 수정되어야 합니다.(교재 p.411 참고)
    <body onload="init()">
    ...
    <ul>
    ...

    이들을 고치고 다시 해보세요,


QnA

공부하면서 궁금했던 것을 질문해보세요.

List of Articles
번호 제목 글쓴이 날짜 조회 수
공지 읽어주세요! 연습문제 및 실습문제 정답 공개에 관한 공지입니다. file 관리자 2017.06.21 18173
302 9장 연습문제 4번 1 초보 2020.10.16 1007
301 303p. 12번에 2질문 드립니다 1 2020.10.15 96
300 302p. 7번에 (2)번 문제 2020.10.15 73
299 264p 문의 1 . 2020.10.15 65
298 282p. 예제 6-14 출력 문의 드려요 1 file . 2020.10.15 82
297 z-index 관련 질문 번역봇 2020.10.13 63
296 2장 인라인프레임만들기 예제 2-24 다시질문해요 2 고수가되고싶어요 2020.10.11 89
295 실습 문제 4장 4번 문제에 대해서 질문드립니다. 1 ㅇㅇ 2020.10.11 121
294 2장 인라인프레임만들기 예제 2-24 file 고수가되고싶어요 2020.10.10 75
293 연습문제 5장 10번 문제 질문드립니다. 1 . 2020.10.08 246
292 실습문제 5장 9번 1 file 2020.10.08 211
291 연습문제 3장 p.155 5번 문제 1 열심히해보자 2020.10.07 412
290 연습문제 4장 8번문제 1 file 도라에몽 2020.10.02 252
289 실습문제 4장 8번 1 2020.09.27 448
288 이거 1장 부터 시작해서 답을 어디서 확인해야 되죠? 2020.09.27 222
287 6장 실습문제 2번 3번문제 초보 2020.09.16 146
286 p.583 4번 질문드립니다. 6 열심히 공부하는 독자 2020.09.14 287
285 p.524 쿠키 질문드립니다. 2 열심히 공부하는 독자 2020.09.12 71
284 예제 13-9 질문드립니다. 4 열심히 공부하는 독자 2020.09.12 100
283 page 46 마우스 올릴시 이미지 출력 2 file 공부중 2020.09.10 318
목록
Board Pagination Prev 1 ... 2 3 4 5 6 7 8 9 10 ... 21 Next
/ 21
위로