<초기화면>
<h1><a href="index.html">WEB</a></h1>
<ol>
<li><a href="1.html">HTML</a></li>
<li><a href="2.html">CSS</a></li>
<li><a href="3.html">JavaScript</a></li>
</ol>
<h2>JavaScript</h2>
<p>
JavaScript (/ˈdʒɑːvəˌskrɪpt/[6]), often abbreviated as JS, is a high-level, dynamic, weakly typed, prototype-based, multi-paradigm, and interpreted programming language. Alongside HTML and CSS, JavaScript is one of the three core technologies of World Wide Web content production. It is used to make webpages interactive and provide online programs, including video games. The majority of websites employ it, and all modern web browsers support it without the need for plug-ins by means of a built-in JavaScript engine. Each of the many JavaScript engines represent a different implementation of JavaScript, all based on the ECMAScript specification, with some engines not supporting the spec fully, and with many engines supporting additional features beyond ECMA.
</p>
<night, daymode만들기>
<body >
<h1><a href="index.html">WEB</a></h1>
<input type ="button" value ="night" onclick="
document.querySelector('body').style.backgroundColor = 'black';
document.querySelector('body').style.color = 'white';
">
<input type ="button" value ="day" onclick="
document.querySelector('body').style.backgroundColor = 'white';
document.querySelector('body').style.color = 'black';
">
<ol>
<li><a href="1.html">HTML</a></li>
<li><a href="2.html">CSS</a></li>
<li><a href="3.html">JavaScript</a></li>
</ol>
<h2>JavaScript</h2>
<p>
JavaScript (/ˈdʒɑːvəˌskrɪpt/[6]), often abbreviated as JS, is a high-level, dynamic, weakly typed, prototype-based, multi-paradigm, and interpreted programming language. Alongside HTML and CSS, JavaScript is one of the three core technologies of World Wide Web content production. It is used to make webpages interactive and provide online programs, including video games. The majority of websites employ it, and all modern web browsers support it without the need for plug-ins by means of a built-in JavaScript engine. Each of the many JavaScript engines represent a different implementation of JavaScript, all based on the ECMAScript specification, with some engines not supporting the spec fully, and with many engines supporting additional features beyond ECMA.
</p>
</body>onclick=" document.querySelector('body').style.backgroundColor = 'black';
→ 클릭을 하면 현재 문서에서 body의 배경색을 검정색으로 지정
document.querySelector('body').style.color = 'white';
→ 현재 문서에서 body의 글자색을 흰색으로 지정
<night,day mode/if문을 사용해 하나의 button으로>
<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'
}
">
출처 : 생활코딩
'UI > JavaScript' 카테고리의 다른 글
| 220921_JavaScript_국비_내장함수/ 객체/ Array (2) | 2022.09.21 |
|---|---|
| 220920_JavaScript_국비_식& 연산자/ if~else/switch/for/while/do~while/function (2) | 2022.09.20 |
| 220919_JavaScript_국비_코드위치/ 데이터 타입/ 변수 & 상수/ 식& 연산자 (2) | 2022.09.19 |
| 220805_ JavaScript_생활코딩_refactoring/function (0) | 2022.08.05 |
| 220803_JavaScript_생활코딩_string/number (0) | 2022.08.03 |
