웹프로그래밍/javascript

javascript - String 객체

zelkova 2011. 3. 1. 21:15


변수="문자열"
변수.속성
변수.메소드

String 객체는 글자의 모양을 지정하거나 문자열을 처리하기 위해 사용됩니다. 글자의 크기나 색상 등 글자 모양에 대한 설정을 하거나 문자열에 링크를 걸어 위치나 사이트로 이동시킬 수도 있고, 지정한 인덱스에 있는 문자를 반환하는 등 문자열을 처리하기 위해 사용됩니다.

속성과 메소드

 length()

 문자열 길이 반환

 anchor()

 페이지를 이동시키기 위한 위치 지정

 link()

 다른 위치나 다른 사이트로 이동하기


링크와 책갈피 

  1. <html>
  2. <head>
  3. <title>소스</title>
  4. <script language="JavaScript">
  5. document.write("[here]".anchor("here")+"<p>")
  6. document.write("링크 이".link("http://dreamzelkova.tistory.com"))
  7. document.write("<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>")
  8. document.write("위쪽으로".link("#here"))
  9. </script>
  10. </head>
  11. <body>
  12. </body>
  13. </html>




글자 속성 메소드

 메소드

 설명

 big()  글자 크기를 크게 설정
 small()  글자크기를 작게 설정
 fontsize(숫자)  글자크기를 지정
 fontcolor('색상명')  글자색 지정
 bold()  글자를 진하게 지정
 fixed()  글자를 고정시킴
 italic()  글자를 이탤릭체로 변경
 strike()  취소선을 설정
 sup()  위첨자로 설정
 sub()  아래첨자로 지정
 blink()  글자가 깜박이도록 설정(넷스케이프,네비게이터용)


  1. <html>
  2. <head>
  3. <title>소스</title>

  4. <script language="JavaScript">
  5. document.write("기본글자입니다. <p>")
  6. document.write("[big 속성] ".big()+"<p>")
  7. document.write("[Size:12] ".fontsize('12')+"<p>")
  8. document.write("[Color:Blue] ".fontcolor('blue')+"<p>")
  9. document.write("[fixed] ".fixed()+"<p>")
  10. document.write("[italic체] ".italics()+"<p>")
  11. document.write("[취소선] ".strike()+"<p>")
  12. document.write("[위첨자로] "+"4".sup()+"<p>")
  13. document.write("[아래첨자로] "+"4".sub()+"<p>")
  14. </script>
  15. </head>
  16. <body>
  17. </body>
  18. </html>

위치와 관련된 메소드



메소드

 설명

 indexOf("문자")  문자열 객체 중에서 문자의 위치 값을 왼쪽부터 계산하여 숫자로 표시한다. 시작은 0번부터, 없으면 -1이 된다.
 indexOf("문자",n)  문자를 문자열의 n번째 문자부터 찾는다.
 lastIndexOf("문자")  문자열 객체중에서 문자의 위치를 오른쪽부터 계산하여 숫자로 표시한다. 시작은 0번부터 없으면 -1
 lastIndexOf("문자",n)   문자를 문자열의 n번째 문자부터 찾는다.
 charAt(n)  문자열에서 n번째 위치한 문자를 찾아준다. 숫자는 0번부터 시작한다.

  1. <html>
  2. <head>
  3. <title>소스</title>

  4. <script language="JavaScript">
  5. document.write("가나다라마바사마마".indexOf("마")+"<br>")
  6. document.write("가나다라마바사마마".indexOf("마",5)+"<br>")
  7. document.write("가나다라마바사마마".lastIndexOf("마")+"<br>")
  8. document.write("가나다라마바사마마".lastIndexOf("마",6)+"<br>")
  9. document.write("가나다라마바사마마".charAt("5"))
  10. </script>
  11. </head>
  12. <body>
  13. </body>
  14. </html>




문자 표시 관련 메소드

메소드

설명

 substring(n,m) 문자열의 n번째 문자부터 m번째 문자까지 표시한다. 음수 값은 무시된다.
 slice(n,m) substring과 동일하고, 음수값은 오른쪽부터 순번으로 계산된다.
 substr(n,m) 문자열의 n번째 문자부터 m개의 문자를 표시한다.

  1. <html>
  2. <head>
  3. <title>소스</title>

  4. <script language="JavaScript">
  5. document.write("꿈꾸는 느티나무".substring(0,1)+"<br>")
  6. document.write("꿈꾸는 느티나무".slice(1,3)+"<br>")
  7. document.write("꿈꾸는 느티나무".substr(3,5))
  8. </script>
  9. </head>
  10. <body>
  11. </body>
  12. </html>



문자열 분리와 결합 메소드

 메소드

 설명

 split("구분문자") 구분문자를 이용해서 문자열 객체를 분리시킨다.
 concat("문자열") 문자열을 문자열 객체에 결합시킨다.

  1. <html>
  2. <head>
  3. <title>소스</title>
  4. <script language="JavaScript">
  5. document.write("요 로코롬 나뉘어짐".split("코롬")+"<br>")
  6. document.write("구분문자 객체분리".concat("이렇게 연결"))
  7. </script>
  8. </head>
  9. <body>
  10. </body>
  11. </html>

대소문자의 구분

 메소드

 설명

 toUpperCase() 모두 대문자로 표시한다.
 toLowerCase() 모두 소문자료 표시한다.


  1. <html>
  2. <head>
  3. <title>소스</title>
  4. <script language="JavaScript">
  5. document.write("abCDefg".toUpperCase()+"<br>")
  6. document.write("ABcdEfG".toLowerCase())
  7. </script>
  8. </head>
  9. <body>
  10. </body>
  11. </html>

기타 메소드

 메소드

 설명

 eval() 문자열을 수치로 바꾼다.
 match() 지정한 문자와 동일한 패턴을 찾는다. 없으면 널값을 반환한다.
 search() 문자열에서 지정한 문자 턴을 찾아 그 패턴의 오프셋 값(정수)을 반환한다.
 replace() 지정한 문자를 찾아 지정한 다른 문자열로 바꾼다.

eval( 예제1, 예제2


  1. <html>
  2. <head>
  3. <title>소스</title>

  4. <script language="JavaScript">
  5. document.write("꿈꾸는느티나무".match("느티")+"<br>")
  6. document.write("사랑함돠".search("함")+"<br>")
  7. document.write("호갱님".replace("호갱","고객")+"<br>")
  8. </script>
  9. </head>
  10. <body>
  11. </body>
  12. </html>


반응형

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

javascript - Array객체  (0) 2011.03.02
javascript - Date 객체  (0) 2011.03.02
javascript - location 객체  (0) 2011.03.01
javascript - history 객체  (0) 2011.03.01
javascript - navigator  (0) 2011.03.01