WebProgramming/x1.html at main · acupoframen/WebProgramming · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
<!DOCTYPE html>
<html>
    <head>
        <h1>hwan</h1>
        <meta charset="utf-8">
        <title></title>
    </head>

    <body style="background-color:black;">
        <script>
        document.write("hello world")
        </script>
        <input type="button" value="hi" onclick="alert('hi')">
        <input type="text" onchange="alert('changed')">
        <input type="text" onkeydown="alert('key down!')">

        <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';">


        <input id="night_day" type="button" value="night/day" 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';
        }">

        <input type="button" value="night/day" onclick="
        var target= document.querySelector('body');
        if(this.value==='night'){
            target.style.backgroundColor = 'black';
            target.style.color = 'white';
            this.value='day';
        }
        else{
            target.style.backgroundColor = 'white';
            target.style.color = 'black';
            this.value='night';
        }">

    </body>
</html>