JS- 조건문 사용하여 토글 버튼 만들기

Jeongwon·2022년 1월 13일
0

Java Script

목록 보기
9/14

낮모드일 때 버튼을 누르면 밤모드가 되고 다시 버튼을 누르면 낮모드가 되게

<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title>WEB1- JavaScript</title>
  </head>
  <body>
    <h1><a href="index.html">WEB</a></h1>

    <input id = "night_day" type="button" value="night" onclick = "
    if(document.querySelector('#night_day').value=== 'night') {
      document.querySelector('body').style.backgroundColor = 'black';
      document.querySelector('body').style.color = 'white';
      document.querySelector('#night_day').value = 'day'
    } else {
      document.querySelector('body').style.backgroundColor = 'white';
      document.querySelector('body').style.color = 'black';
      document.querySelector('#night_day').value = 'night'
    }">
    <ol>
      <li><a href="html.html">HTML</a></li>
      <li><a href="css.html">CSS</a></li>
      <li><a href="javascript.html">JavaScript</a></li>
    </ol>
    <h2>JavaScript</h2>
    <p>
      JavaScript (/ˈdʒɑːvəˌskrɪpt/),[10] often abbreviated JS, is a
      programming language that is one of the core technologies of the
      World Wide Web, alongside HTML and CSS.[11] Over 97% of websites
      use JavaScript on the client side for web page behavior,[12] often
      incorporating third-party libraries.[13] All major web browsers have
      a dedicated JavaScript engine to execute the code on users' devices.
      JavaScript is a high-level, often just-in-time compiled language that conforms
      to the ECMAScript standard.[14] It has dynamic typing, prototype-based
      object-orientation, and first-class functions. It is multi-paradigm,
      supporting event-driven, functional, and imperative programming styles.
      It has application programming interfaces (APIs) for working with text,
      dates, regular expressions, standard data structures, and the Document
      Object Model (DOM).
    </p>
  </body>
</html>
profile
(❁´◡`❁)

0개의 댓글

관련 채용 정보