[자바스크립트] 네이버 핫토픽 키워드(?) 비슷한 기능.

1. HTML

 

<input type="button" onclick="dateChk('1')" value="8시" />
<input type="button" onclick="dateChk('2')" value="11시" />
<input type="button" onclick="dateChk('3')" value="14시" />
<input type="button" onclick="dateChk('4')" value="17시" />
<input type="button" onclick="dateChk('5')" value="20시" />
<input type="button" onclick="dateChk('6')" value="종합" />
<p/>
<div id="result"></div>

 

 

 

2. SCRIPT

 

function dateChk(a){

  var totime = new Date();
  var hour   = totime.getHours();
  var min    = totime.getMinutes();
  var sec    = totime.getSeconds();
 
   var gisa = new Array();
 
   gisa[0] = "안철수 탈당과 총선…야권 '성공한 분열'의 조건은? ||12";
   gisa[1] = "연탄봉사 김무성 대표 '니는 얼굴이… 저의 불찰' ||15";
   gisa[2] = "'짐승 손에 딸잃은 어미입니다' A공사 살인사건 ||9";
   gisa[3] = "문재인, 정동영 찾아가 '복당' 설득했지만··· ||5";
   gisa[4] = "박명수, 동생 가발 홍보 노렸나? 사정 들어보니.. ||1";
   gisa[5] = "'집 무너져도 OK' 지진 나면 변신하는 침대 ||3";
   gisa[6] = "그라비아 모델로 데뷔한 G컵 아나운서...반응은? ||16";
   gisa[7] = "'IMF 때도 안 이랬어요' 삼성도 못 피한 최악 사태 ||18";
   gisa[8] = "토요타차를 뒤흔드는 성추문, 몸으로 취업? ||22";
   gisa[9] = "대출·탈세 노린 '업 계약' 기승, 국토부는 수수방관 ||25";
 
   var s = document.getElementById("result");
   // var timeCut;
   var tmp1 = "";
   var tmp2 = "";
   var tmp3 = "";
   var tmp4 = "";
   var tmp5 = "";
   var tmp6 = "";
 
   var k1 = 0;
   var k2 = 0;
   var k3 = 0;
   var k4 = 0;
   var k5 = 0;
   var k6 = 0;
 
   var a1 = "";
   var a2 = "";
  
   // timeCut = gisa[0].split('||');
   // alert(timeCut[1]);
   // alert(gisa.length);
   //alert(hour);
  
   for(var i=0;i<gisa.length;i++){

     var timeCut = gisa[i].split('||');
   
     var hour1 = timeCut[1] + 2;
   
     if(hour1 <= hour){
       a1 = "<a href='http://www.xportsnews.com/?ac=article_view&entry_id=671622' target='_blank'>"
       a2 = "</a>"
     }
    
     // alert(gisa[i]);
     // alert(Number(timeCut[1]));
    
     if(0 < Number(timeCut[1]) && 8 > Number(timeCut[1])){
       k1++;
       tmp1 += k1 + ". - " + a1 + timeCut[0] + a2 + "</br>";
     }
     if(8 <= Number(timeCut[1]) && 11 > Number(timeCut[1])){
       k2++;
       tmp2 += k2 + ".- " + a1 + timeCut[0] + a2 + "</br>";
     }
     if(11 <= Number(timeCut[1]) && 14 > Number(timeCut[1])){
       k3++;
       tmp3 += k3 + ".- " + a1 + timeCut[0] + a2 + "</br>";
     }
     if(14 <= Number(timeCut[1]) && 17 > Number(timeCut[1])){
       k4++;
       tmp4 += k4 + ".- " + a1 + timeCut[0] + a2 + "</br>";
     }
     if(17 <= Number(timeCut[1]) && 20 > Number(timeCut[1])){
       k5++;
       tmp5 += k5 + ".- " + a1 + timeCut[0] + a2 + "</br>";
     }
     if(1 <= Number(timeCut[1])){
       k6++;
       tmp6 += k6 + ".- " + a1 + timeCut[0] + a2 + "</br>";
     }
   }
 
   var tmpCut = tmp1.split('</br>');
   // alert(tmpCut.length-1);
 

   switch(a){
     case '1': s.innerHTML = tmp1;break;
     case '2': s.innerHTML = tmp2; break;
     case '3': s.innerHTML = tmp3; break;
     case '4': s.innerHTML = tmp4; break;
     case '5': s.innerHTML = tmp5; break;
     case '6': s.innerHTML = tmp6; break;
     default : s.innerHTML = "기사가 없습니다."; break;
   }
}
   

 

 

3. RUN

 

 

 

 

 

 https://jsfiddle.net/72or7yz0/4/