자바스크립트 이것 저것

HTML, CSS, JAVASCRIPT공부에 좋은 사이트 http://www.gotapi.com

외부의 jsTest.js파일 불러오기

typeof - 변수타입 알아내기

confirm - 확인받기

prompt - 입력받아 처리하기

Array() - 배열선언

여기서는 열두달에 마지막날짜가 몇일인지 알아내는 기능

document.write(inputNum+"월은 "+month[inputNum-1]+"까지 입니다.");
-->
</script>

Date() - 날짜 시간

  document.writeln(today.getYear()+"년");
  document.writeln(today.getMonth()+"월");
  document.writeln(today.getDate()+"일");
  document.writeln(today.getDay()+"요일");
  document.writeln(today.getHours()+"시");
  document.writeln(today.getMinutes()+"분");
  document.writeln(today.getSeconds()+"초");
  document.writeln("타입스템프 : "+today.getTime());
  document.write("</b></pre>");
-->
</script>

moveBy() - 윈도우 이동

resizeTo() - 크기 조정

open() - 팝업창열기

close() - 창 닫기

이 기능은 버튼 누르면 창이 열리고 또 누르면 창이 닫히는 기능

   function autoWindowOC(){
    if( obj == null ) {
     // 사용방법 1
//     obj = window.open("./script10_1.html","goldmeme","width=540 height=534 toolbar=no status=no menubar=no directions=no location=no scrollbars=no resizable=no");

// 사용방법 2
obj = window.open("","goldmeme","width=540 height=534 toolbar=no status=no menubar=no directions=no location=no scrollbars=no resizable=no");

     html = "<html>";
     html += "<head><title>GOLD ME ME JJANG</title></head>";
     html += "<body topmargin='0' leftmargin='0'>";
     html += "<img src='../img/nana.jpg' />";
     html += "</body>";
     html += "</html>";
     obj.document.write(html);

    } else {
     obj.close();
     obj = null;
    }
   }
  -->
</script>
<BODY>
<img src="../img/nana.jpg" width="200" alt="금나나 짱!" />
<br />
<input type="button" value="열려라" onClick="autoWindowOC()" />
<input type="button" value="참깨" onClick="autoWindowOC()" />
</BODY>

history.back() - 뒤로

history.forward() - 다음으로

history.go() - 이동

window.location.replace() - 페이지를 불러옴

window.location.reload() - 새로고침

.link() - 같은페이지에서 빠른이동에 자주쓰인다.

.anchor() - 이동할 위치

<a href="#1"></a> 이와 똑같다.

.length - 문자열 길이

toLowerCase() - 소문자로

toUpperCase() - 대문자로

substring() - 문자열 속에 문자열

slice() - 문자열 속에 문자열 사용법이다름

값을 옴기는 기능

체크박스,라디오 값 다루기

   function choiceBlood(form){
    form.bloodType[2].checked = true;
   }
   function choiceAnimal(form){
    form.animal[1].checked = true;
    form.animal[2].checked = true;
   }
  -->
</script>
<BODY>
<form method="" action="" name="form1">
  <input type="radio" name="bloodType" value="A" checked />A형
  <input type="radio" name="bloodType" value="B" />B형
  <input type="radio" name="bloodType" value="O" />O형
  <input type="radio" name="bloodType" value="AB" />AB형
  <input type="button" name="but1" value="선택" onClick="chkBloodType(this.form)" />
  <hr />
  <input type="checkbox" name="animal" value="tiger" />호랭이
  <input type="checkbox" name="animal" value="dog" />멍멍이
  <input type="checkbox" name="animal" value="cat" />야옹이
  <input type="checkbox" name="animal" value="mikimouse" />미키마우스
  <input type="button" name="but2" value="동물선택" onClick="chkAnimal(this.form)" />
  <hr />
  <input type="button" name="but3" value="피 자동선택" onClick="choiceBlood(this.form)" />
  <input type="button" name="but3" value="동물 자동선택" onClick="choiceAnimal(this.form)" />
</form>
</BODY>

선택하면 자동으로 버튼이 나오거나 색이 바뀌는 기능

   function showButton(channel){
    //alert(document.frm1.channel.options[1].text);
    switch( channel ){
     case "mbc" : document.frm1.but1.value="M본부로 이동하기"; document.frm1.but1.style.visibility = "visible"; break;
     case "kbs" : document.frm1.but1.value="K본부로 이동하기"; document.frm1.but1.style.visibility = "visible"; break;
     case "sbs" : document.frm1.but1.value="S본부로 이동하기"; document.frm1.but1.style.visibility = "visible"; break;
     default : document.frm1.but1.style.visibility = "hidden"; break;
    }
   }

   function chaColor(color){
    document.fgColor=color;
   }

   function showLast(){
    var today = new Date(document.lastModified);
    alert(today.getYear()+"년"+today.getMonth()+1 +"월"+today.getDate()+"일 "
    +today.getHours()+"시"+today.getMinutes()+"분"+today.getSeconds()+"초");
   }
  -->
</script>
</HEAD>
<BODY>
<form name="frm1" method="get" action="#">
  <select name="channel" onChange="showButton(this.value)" >
   <option value="" />방송사를 선택하세요!
   <option value="mbc" />MBC
   <option value="kbs" />KBS
   <option value="sbs" />SBS
  </select>
  <input name="but1" type="button" value="" onClick="goToTheUrl(this.form.channel.value)" style="visibility:hidden" />
  </br />
  <select name="color" onChange="chaColor(this.value)">
   <option value="" />색을 선택하세요!
   <option value="red" />RED
   <option value="blue" />BLUE
   <option value="green" />GREEN
  </select>
  <b>포뇨 포뇨 포뇨 물고기인간.</b>
  <br />
  <input type="button" name="but2" value="lastModified속성" onClick="showLast()" />
</form>
</BODY>

이미지의 값 다루기

선택하면 배경색변경과

setInterval() - 설정한 대로 반복시킴 여기서는 1초

arr1[0] = 10; arr1[1] = 20; arr1[2] = 30;
document.write(arr1.length);

var arr2 = new Array("어제도","오늘도","내일도","xml");

for(var i=0; i<arr2.length;i++)
document.write(arr2[i]+" ");

document.write(arr2.join());
document.write(arr2.join("|"));

   function notice(){
    alert("hi!!");
   }
   function clock(){
    var t = new Date();
    document.getElementById("time").value=t;
   }
  -->
</script>
</HEAD>
<body onLoad="window.setInterval('clock()',1000);">
<table cellspacing="3">
  <tr>
   <td bgcolor="red" onMouseOver="document.bgColor='red';"></td>
   <td bgcolor="tan" onMouseOver="document.bgColor='tan';"></td>
   <td bgcolor="yellow" onMouseOver="document.bgColor='yellow';"></td>
   <td bgcolor="green" onMouseOver="document.bgColor='green';"></td>
   <td bgcolor="blue" onMouseOver="document.bgColor='blue';"></td>
   <td bgcolor="black" onMouseOver="document.bgColor='black';"></td>
  </tr>
</table>
<hr />
<input type="text" id="time" size="35" />
</BODY>

'프로그래밍 > JavaScript' 카테고리의 다른 글

특정 페이지만 인코딩 변경 ( document.charset 지정 ) (0)	2012.01.03
플래시 호출 스크립트 (0)	2012.01.03
웹페이지 글자 사이즈 변경 통소스 (0)	2012.01.03
결제 페이지에 사용할 유용한 스크립트 (소스보기막기,새로고침방지) (0)	2012.01.03

잡다 JOBDA

자바스크립트 이것 저것

'프로그래밍 > JavaScript' 카테고리의 다른 글

티스토리툴바

자바스크립트 이것 저것

'프로그래밍 > JavaScript' 카테고리의 다른 글

'프로그래밍/JavaScript' Related Articles

티스토리툴바