7. JavaScript Ex.06 배경색바꾸기

본 글은 HTML5, CSS 학습한 상태에서 작성한 글입니다.

예제풀이

onmouseover , onmouseout 속성을 이용하여 <td>에 마우스를 over할 경우 배경색을 변경하고,

out할 경우 기존의 색인 white로 돌아오게 한다.

또한 option의 값을 통하여 선택하는 option의 value값의 색으로 배경색을 변경하도록 한다.

option의 value=""값을 생략할경우 text값이 value값으로 자동으로 설정 된다.

※ transparent란? 

1. 투명한   2. 속이 뻔히 들여다보이는, 명백한, 투명한   3. 명료한, 알기 쉬운 의 뜻의 단어

bg_change(bgcolor) : 

td요소에 마우스를 올릴경우 bg_change 함수가 호출되는데, 내부의 배경색 값을 받아와 배경색으로 지정한다

여기서 배경색 값은 this.style.backgroudColor으로 기존에 설정되어있는 배경색을 this를 통하여 받아와 배경색으로 지정한다.

 onmouseout 가 발생되면 bg_change()함수가 호출된다.

여기서 나타나는  transparent는 투명한색을 뜻하여 white를 나타낸다. 

bglist_change(bglist) : 

value값을 생략하여 각 옵션마다 text값이 value로 지정되어 있다.

이 값을 인자로 받아와 배경색으로 지정한다.