MinsoftK

test using jquery

...@@ -3,6 +3,7 @@ ...@@ -3,6 +3,7 @@
3 <head> 3 <head>
4 <title>KHU KHU Chat</title> 4 <title>KHU KHU Chat</title>
5 <meta charset="utf-8"> 5 <meta charset="utf-8">
6 +
6 <link rel="stylesheet" href="style.css"> 7 <link rel="stylesheet" href="style.css">
7 <script> 8 <script>
8 function LinksSetColor(color){ 9 function LinksSetColor(color){
......
1 var Links={ 1 var Links={
2 SetColor:function(color){ 2 SetColor:function(color){
3 - var alist=document.querySelectorAll('a'); 3 + // var alist=document.querySelectorAll('a');
4 - var i =0; 4 + // var i =0;
5 - while(i<alist.length) 5 + // while(i<alist.length)
6 - { 6 + // {
7 - alist[i].style.color=color; 7 + // alist[i].style.color=color;
8 - i+=1; 8 + // i+=1;
9 - } 9 + // }
10 - } 10 + // }
11 - 11 + $('a').css('color',color); //jquery 사용한 것.
12 + }
12 } 13 }
13 var Body = { 14 var Body = {
14 SetColor:function(color){ 15 SetColor:function(color){
15 - document.querySelector('body').style.color= color; 16 + //document.querySelector('body').style.color= color;
17 + $('body').css('color',color);
18 +
16 }, 19 },
17 SetBackGruondColor:function(color){ 20 SetBackGruondColor:function(color){
18 - document.querySelector('body').style.backgroundColor= color; 21 + //document.querySelector('body').style.backgroundColor= color;
22 + $('body').css('backgroundColor',color);
19 } 23 }
20 } 24 }
21 25
...@@ -26,7 +30,7 @@ function nightDayHandler(self){ ...@@ -26,7 +30,7 @@ function nightDayHandler(self){
26 Body.SetColor('white'); 30 Body.SetColor('white');
27 self.value= 'day'; 31 self.value= 'day';
28 32
29 - Links.SetColor('white'); 33 + Links.SetColor('powderblue');
30 34
31 }else{ 35 }else{
32 Body.SetBackGruondColor('white') 36 Body.SetBackGruondColor('white')
......
...@@ -4,6 +4,10 @@ ...@@ -4,6 +4,10 @@
4 <title>KHU KHU Chat</title> 4 <title>KHU KHU Chat</title>
5 <meta charset="utf-8"> 5 <meta charset="utf-8">
6 <link rel="stylesheet" href="style.css"> 6 <link rel="stylesheet" href="style.css">
7 +<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js">
8 +//color.js 앞에 jquery 써줘야함
9 +</script>
10 +
7 <script src="colors.js"></script> 11 <script src="colors.js"></script>
8 </head> 12 </head>
9 <body> 13 <body>
...@@ -11,9 +15,9 @@ ...@@ -11,9 +15,9 @@
11 nightDayHandler(this); 15 nightDayHandler(this);
12 "> 16 ">
13 <!-- button2 making and using function --> 17 <!-- button2 making and using function -->
14 - <input id="night_day" type="button" value="night" onclick=" 18 + <input id="night_day" type="button" value="night" onclick="
15 nightDayHandler(this); 19 nightDayHandler(this);
16 - "> 20 + ">
17 21
18 <div id="grid"> 22 <div id="grid">
19 <ol> 23 <ol>
......