Step02_example1,2 (변수 연산, if, CamelCase)

javascript, framework/javascript

bono.html 2022. 7. 7. 15:39

다음은 배운 것들을 활용한 예제이다

여기서 count 값을 미리 let으로 정의해두고 addEventListener을 작성한 것을 알 수 있다. 이후 count+"px" 연결연산을 활용하여 클릭시 변경하여 작동하게 만들었다.

전 예제와 같은 방식으로 이번엔 img에 margin을 사용하여 클릭시 이동하는 것처럼 보이게 만들었다.

if 문을 활용하여 0이 아닐때만 동작하게 했다. 그림의 margin값이 음수가 나와서 안보이는 곳으로 이동하는 것을 막은 것이다.

*여러 속성을 문자로 만드는 형식

kebab-case

move-right-bottom

snake_case

move_right_bottom

CamelCase

MoveRightBottom