'분류 전체보기'에 해당되는 글 80건

HTMl 특수기호 처리

CSS&HTML5 2012. 1. 10. 17:49


특수문자 의미
 
Space키(한칸 띄기) 한 번 누르기 역할을 한다.
<
< 를 출력한다.
&gt;
> 를 출력한다. (예) &lt;HTML&gt; 이면 화면에 <HTML> 를 출력한다.
&amp;
& 를 출력한다.
&quot;
" 를 출력한다.
&copy;
© 를 출력한다.
\
다음 글자가 일반적인 글자가 아니고 특수문자로 사용된다는 지정이다. 특수문자로 사용할 문자앞에 backslash(\)를 붙여준다. \w는 w가 특수문자로 사용됨을 나타낸다. \w의 의미는 모든 문자를 가리킨다.

또는 반대로 특수문자를 일반적인 문자로 지정하게 한다. \\는 backslash(\)문자를 나타낸다. \\\/는 slash(/) 문자를 나타낸다.

^
input이나 line의 시작문자. /^A/는 "Amatch"와는 맞지만 "an Amatch"와는 맞지 않는다.
$
input이나 line의 끝문자. /A$/는 "abA"와는 맞지만 "aAb"와는 맞지 않는다.
*
앞 문자가 0번 이상 있으면 맞다. 없어도 되고 여러개 있어도 된다. /ab*c/는 "abbbc"와 맞다. "ac"와도 맞다. 하지만, "ax"와는 맞지 않는다.
+
앞 문자가 1번 이상 있으면 맞다. 1개 이상 있어야 하고 여러개 있어도 된다. /ab+c/는 "abbbc"와 맞다. 하지만, "ac"와는 맞지 않는다.
?
앞 문자가 0번이나 1번은 있어야 맞다. /ab?c/는 "abc"와 맞고 "ac"와도 맞다. 하지만, "abbc"와는 맞지 않는다.
.
개행문자(\n)외에 모든 문자이면 맞다. /.c/는 "Xc", "1c"와 맞다. 하지만, "ca", "\\nc"와는 맞지 않는다. (\\n은 \n의 뜻이다. 특수문자로 사용되는 \를 문자로 표현하기 위해서 앞에 \를 붙여준다. )
(x)
문자 'x'를 검색하고 맞으면 'x'를 기억한다. /a(bc)/는 "abcd"에서 검색되고 "bc"를 기억한다. 이 기억된 것은 RegExp 객체의 $1에서 $9까지로 또는 배열 [1]에서 기억된 숫자 [n]개 까지로 호출될 수 있다.
x|y
'x'나 'y'가 있으면 맞다. /abc|xx/는 "abc ZZZ"나 "xx ZZZ"와 맞다.
{n}
앞 문자가 n개 있으면 맞다. n은 양수 정수이다. /X{2}/는 "abcXX"와 맞다. "abcXXX"와도 맞고 처음 2개의 "XX"가 검색된다.
{n,}
앞 문자가 최소한 n개 있으면 맞다. n은 양수 정수이다. /X{2,}/는 "abcXX"와 맞다. "abcXXX"와도 맞고 3개의 "XXX"가 검색된다.
{n,m}
앞 문자가 최소한 n번에서 m번까지 있다면 맞다. /a{1,3}/은 "ab", "aaab"와 맞다.
[xyz]
xyz 중에서 아무런 문자가 있어도 맞다. 이것은 [x-z]과 같은 지정이다.
[^xyz]
xyz 중에서 하나의 문자라도 없으면 맞다. 이것은 [^x-z]과 같은 지정이다.
[\b]
backspace
\b
공백같은 것으로 단어의 경계되는 부분에 있는 문자이다. /\bX/는 "Xxx"와 맞다. /X\b/는 "xxX"와 맞다.
\B
\b와 반대이다. 반어 경계에 있지 않은 문자만 맞다. /X\Bz/는 "XXz Xzz"에서 두번째의 "Xz"가 검색된다.
\cX
control-X 문자와 맞다. /\cM/은 control-M 문자이다.
\d
숫자는 맞다. [0-9]와 같은 지정이다. /\d/는 "hi5"에서 "5"를 검색한다.
\D
숫자가 아닌 것은 맞다. [^0-9]와 같은 지정이다. /\D/는 "hi5"에서 "h"를 검색한다.
\f
form-feed(\f) 문자와 맞다.
\n
linefeed(\n) 문자와 맞다.
\r
carriage return(\c) 문자와 맞다.
\s
space, tab, form feed, line feed를 가지고 있는 white space 문자와 맞다.[ \f\n\r\t\v]와 같은 지정이다. /\s\w*/는 "abc Xz"에서 "Xz"를 검색한다.
\S
white space 문자가 아닌 하나의 문자이다. [^ \f\n\r\t\v]와 같은 지정이다. /\S\w*/는 "abc Xz"에서 "abc"를 검색한다.
\t
tab 문자
\v
vertical tab 문자
\w
underscore(_)문자를 포함하는 알파벳과 숫자 0에서 9까지의 문자. [A-Za-z0-9_]와 같은 지정이다.
\W
\w의 반대이다. [^A-Za-z0-9_]와 같은 지정이다. /\W/는 "50%"에서 "%"를 검색한다.
\n
n은 양수 정수이다. ()로 묵은 것을 지정한다. \1은 RegExp.$1, \2는 RegExp.$2의 값을 사용한다. /ab(c)de\1/은 "abcdec"와 맞다.
\o숫자, \x숫자
escape문자로 ASCII codes 값을 넣을 수 있게한다. 8진, 16진 10진수를 넣을 수 있다.

1 / 2 / 3 / 4


T O P
 

'CSS&HTML5' 카테고리의 다른 글

색상표  (0) 2012.07.31
웹 표준 검증 사이트  (0) 2011.08.03
css 이미지 자르기  (0) 2011.07.29
HTML 5 유용한 링크  (0) 2011.07.29
블로그 이미지

스마트전

,


문자열 처리하기
../

anchor()
문서의 목적지를 가리키는 Anchor택을 지정한다.
var anchorString="이 지점으로.."
document.write(anchorString.anchor("anchorName1"))
위의 구문은 <A NAME="anchorName1">다음 지점으로..</A> 의 HTML을 만든다. 앞의 지정한 문자열을 링크의 내용으로 괄호 안의 문자열은 anchor의 이름이다.
big()
지정한 문자열을 <big></big> 택으로 감싼다.
var makeBig = "big 입니다."
document.write(makeBig.big())
는 <big>big 입니다.</big> 로 된다.
blink()
문자열을 <blink></blink> 택으로 감싼다.
bold()
문자열을 <b></b> 택으로 감싼다.
charAt()
문자열에서 특정 위치의 문자를 반환한다. 괄호 속에 지정해 줄 수 있는 정수는 0에서 문자열 길이-1의 정수를 입력할 수 있다.
alert("abc".charAt(1))
은 'b'를 반환한다.
eval()
괄호 속에 있는 문자열을 JavaScript 구문으로 실행한다.
var he = "Hello"
eval("alert(" + he + ")" )
는 alert("Hello") 와 같다.
fixed()
문자열을 <TT></TT> 택으로 감싼다. 사용법은 big()과 같다.
fontcolor()
문자열을 괄호 속에 넣어준 색상값으로 <FONT COLOR=color> 형식으로 만든다. 색상값은 색상 이름이나 RGB 값을 지정할 수 있다. RGB 값은 여섯개의 16진수 값으로 처음 2개는 red 값, 다음 2개는 green 값, 마지막 2개는 blue값이다.
document.write("빨간색".fontcolor("red"))
document.write("흰색".fontcolor(000000))
는 <FONT COLOR="red">빨간색</FONT>, <FONT COLOR=000000>흰색</FONT> 으로 나온다.
fontsize()
fontcolor()와 비슷하다. <FONTSIZE=size> 의 형식으로 만든다. 괄호 속의 값은 size에 사용할 0에서 7까지의 정수값이다.
document.write("크기 3의 글자".fontsize(3))
[indexOf()]
 
문자열에서 특정 문자가 있는 위치를 반환한다. 괄호 속에 넣어줄 수 있는 인자는 2개가 있고 첫째것은 찾을 문자, 두번째 것은 찾기 시작할 위치이다. 두번째 인자는 지정하지 않을 수 있고 이 경우 문자열의 첫번째 문자부터 찾기 시작한다.
alert("abc cdf".indexOf("c"))
은 2를 반환한다. 만약, 찾을 문자가 없다면 정수 -1을 반환한다.
italics()
문자열을 <i></i> 택으로 감싼다.
lastIndexOf()
indexOf()와 같은 동작을 한다. 유일한 차이점은 이것은 문자열의 오른쪽에서 부터 왼쪽으로 찾는다.
alert("abcd cdf".lastIndexOf("cd"))
는 5를 반환한다. indexOf()나 이것이나 문자열의 위치는 모두 왼쪽에서 오른쪽으로 지정되고 첫번째 문자의 위치는 0으로 지정된다.
link()
다른 문서로 이동하는 <A>택을 지정한다.
var linkString="다음 페이지로.."
document.write(linkString.link("next.htm"))
위의 구문은 <A HREF="next.htm">다음 페이지로..</A> 의 HTML을 만든다. 앞의 지정한 문자열을 링크의 내용으로 괄호 안의 문자열은 HREF에 지정될 문서 주소의 이름이다.
small()
문자열을 <small></small> 택으로 감싼다.
[split()]
 
문자열을 특정 문자를 기준으로 나누어서 하나의 배열에 차례대로 저장한다. 괄호속에 넣어주는 문자가 기준이 되는 문자이다. 이 문자를 기준으로 양쪽의 문자열을 나눈다. 지정하지 않으면 전체 문자열을 배열에 저장한다.
var strArrey;
strArray = "abc,dfe,123".split(",")
는 [abc,dfe,123]으로 strArray는 배열 객체가 된다. strArray.length는 3이고 strArray[2]는 "123"이다.
strike()
문자열을 <strike></strike> 택으로 감싼다.
sub()
문자열을 <sub></sub> 택으로 감싼다.
[substring()]
 
문자열에서 지정한 위치 사이에 있는 문자열을 반환한다. 괄호 속에는 두개의 위치값을 인자로 지정해 줄 수 있다. 첫번째 인자의 위치에서 부터 두번째 인자 앞까지의 문자열을 반환한다.
alert( "a12345".substring(2,4) )
는 "23"을 보여준다. 두번째 인자를 지정하지 않으면 전체 문자열의 끝까지를 지정하는 것이 된다.
alert( "a12345".substring(2) )
는 "2345"를 보여준다.
sup()
문자열을 <sup></sup> 택으로 감싼다.
toLowerCase()
문자열을 소문자로 바꾼다.
alert( "Hello My Lover".toLowerCase() )
는 "hello my lover"로 된다.
toUpperCase()
문자열을 대문자로 바꾼다.
[toString()]
 
String 뿐만이 아닌 모든 객체의 method이다. Array, Boolean, Function, Number 등의 모든 객체를 문자열로 변환한다.
var ar = new Array("abc", "123")
alert( ar.toString() )
은 "abc,123" 을 보여준다.

괄호안에 2에서 16 까지의 진수를 지정해 줄 수도 있는데 이 경우는 숫자를 지정해준 진수의 숫자 문자열로 변환한다. 색상 변환에 사용할 수 있다.
var xx = 255
alert( xx.toString(16) )
는 255를 16진수 "FF"로 나온다. xx.toString(2)는 "11111111"으로 나온다.
valueOf()
객체의 원래 값을 돌려준다.

JavaScript1.2 String 메소드
charCodeAt()
ie4에서는 문자의 Unicode 값을 nn4에서는 ISO-Latin-1 codeset 값을 돌려준다.
alert( "ABC".charCodeAt(0) )
은 "ABC"에서 첫번째의 문자인 "A"의 값 65를 보여준다. 괄호 안의 숫자가 문자열에서 특정 문자의 위치를 지정한다.
concat()
2개의 문자열을 하나의 문자열로 만든다.
alert( "안녕".concat("하세요") )
는 "안녕하세요"를 보여준다. 함수의 앞에 있는 문자열 다음에 괄호 안에 있는 문자열을 덧붙인다.
fromCharCode()
charCodeAt()와 반대의 동작을 하는 함수로 Unicode 값이나 ISO-Latin-1 codeset 값을 문자로 돌려준다
String.fromCharCode(65,66,67)
은 "ABC"를 보여준다. String.fromCharCode()로 사용한다. 지정하는 인자는 여러개 지정할 수 있다.
[match()]
  Regular Expression의 exec()와 비슷한 동작하지만 RegExp 객체는 만들지 않고 맞는 문자정보를 배열로 반환한다.
var st = "abc def ghi"
var arr = st.match(/\w+\s*/g)
arr은 ["abc", "def", "ghi"]를 가지고 있다.
[replace()]
  regular expression을 특정 문자열로 바꾼다. 사용 구문은 아래이다.
문자열.replace(regular expression, "바꿀문자열")
문자열 중에서 regular expression에 맞는 문자열을 "바꿀 문자열"로 바꾸어서 새로운 문자열을 만든다.
var st = "abc def ghi def"
var arr = st.replace(/def/g, "DEF")
arr은 "abc DEF ghi DEF"의 문자열이 된다.
[search()]
  Regular Expression의 test()와 비슷한 동작을 하는 메소드로 문자열에서 regular expression을 검색한 것의 index를 반환한다. 검색된 것이 없으면 -1을 반환한다.
var st = "abc def ghi"
var arr = st.search(/\w+\s*/g)
if( arr != -1) alert("검색됨")
else alert("없음")
으로 "검색됨"이 나온다. 위의 arr의 값은 0(zero)이다. 즉, exec()로 했을 때의 arr.index와 같은 값을 가진다.
[slice()]
  문자열에서 두 위치 사이의 문자열을 반환한다. substring()과의 차이점은 두번째 위치를 음수 정수로 지정하여 문자열의 끝에서의 위치를 지정할 수 있는 것이다.
alert( "abcde".slice(1, -2) )
는 "bc"를 반환한다.
[split()]
(1.2에서 수정됨)
  나눌 문자로 문자열 뿐만이 아니고 regular expression도 사용할 수 있다.
"123+456+789".split(/\+/)
는 ["123", "456", "789"]로 나온다.
[substr()]
  JavaScript1.1의 subString()과 비슷하게 두개의 위치안의 문자열을 반환한다. subString()과 다른점은 문자열의 끝에서 부터도 찾을 수 있는 것이다.
alert( "abcd".substr(-1, 2) )
는 "cd"로 나온다.
substring()
(1.2에서 수정됨)
수정된 사항은 nn4에서 시작위치가 끝위치 보다 더 큰 경우이다. 이 경우 JavaScript1.1에서는 끝위치에서 시작위치 - 1 까지의 문자열을 반환하지만 JavaScript1.2에서는 Run Time error 로 문자열을 반환하지 못한다.
<script language="JavaScript1.2">
"acbd".substring(3, 0)
</script>
ie4, ie5에서는 이런 경우 수정되지 않았다.


T O P

 
블로그 이미지

스마트전

,

XML HTML로 로드 하기

jQuery 2012. 1. 10. 17:43

------------------------------

<?xml version="1.0" encoding="utf-8" ?>

<Company CompanyType="Private">

  <CompanyName>닷넷코리아</CompanyName>

  <CompanyNumber>1234</CompanyNumber>

  <CompanyAddress>서울</CompanyAddress>

  <Name>레드마이너스</Name>

</Company>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

    <title>XML 파일 로드하기</title>

    <script src="../Js/jquery-1.3.2-vsdoc2.js" type="text/javascript"></script>

    <script type="text/javascript">

        $(document).ready(function() {

            $("#btn").click(function() {

                $.get('04.Company.xml', function(data) {

                    $('#ctlGrid').empty();

                    $(data).find('Company').each(function() {

                        var $entry = $(this); // 현재 시점의 레코드셋

                        // 특성(Attribute) 읽어오기

                        var html = "<div>" + $entry.attr('CompanyType')

                            + "</div>"; // Private

                        // 하위 엘리먼트 읽어오기

                        html += "<div>" + $entry.find("CompanyName").text()

                            + "</div>"; // 닷넷코리아

                        $('#ctlGrid').html(html);

                    });

                });

            });

        });

    </script>

</head>

<body>

    <input type="button" id="btn" value="회사소개" />

    <div id="ctlGrid"></div>

</body>

</html>

'jQuery' 카테고리의 다른 글

jquery 유효성 검사  (0) 2012.02.09
jQuery 스크롤 올리기  (0) 2012.02.07
jquery 동적 js 실행  (0) 2012.01.10
jQuery json load  (0) 2012.01.10
jquery 정리  (0) 2011.12.26
블로그 이미지

스마트전

,

jquery 동적 js 실행

jQuery 2012. 1. 10. 17:40

-------------------------------

// JSON 데이터

var tableData = [

    { "Num": "1", "Name": "홍길동", "Title": "안녕" },

    { "Num": "2", "Name": "백두산", "Title": "방가" },

    { "Num": "3", "Name": "임꺽정", "Title": "또봐" }

];

 

var htmls = '';

 

htmls += "<table border='1'>"

htmls += "<tr><th>번호</th><th>이름</th><th>제목</th></tr>";

$.each(tableData, function() {

    htmls += "<tr>";

    htmls += "<td>" + this['Num'] + "</td>";

    htmls += "<td>" + this['Name'] + "</td>";

    htmls += "<td>" + this['Title'] + "</td>";

    htmls += "</tr>";

});

 

htmls += "</table>";

 

$('#ctlGrid').html(htmls); // ctlGrid 포함될 HTML 있는 레이어

==================================

03.JQuery.getScript.htm

-----------------------------------

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

    <title>하나의 완성된 자바스크립트 파일을 동적 로드/실행</title>

    <script src="../Js/jquery-1.3.2-vsdoc2.js" type="text/javascript"></script>

    <script type="text/javascript">

        $(document).ready(function() {

            $("#btn").click(function() {

                // 아래 코드가 실행되는 시점에 js 파일의 기능 실행됨

                $.getScript('03.jQuery.getScript.js');

            });

        });

    </script>

</head>

<body>

<input type="button" id="btn" value="표그리기" />

<div id="ctlGrid">

</div>

</body>

</html>

'jQuery' 카테고리의 다른 글

jQuery 스크롤 올리기  (0) 2012.02.07
XML HTML로 로드 하기  (0) 2012.01.10
jQuery json load  (0) 2012.01.10
jquery 정리  (0) 2011.12.26
아주쉬운 jQuery & jQuery Ajax  (0) 2011.10.11
블로그 이미지

스마트전

,

jQuery json load

jQuery 2012. 1. 10. 17:36

02.JQuery.getJSON.js

--------------------------------

[

    {

        "Num": "1",

        "Name": "홍길동"

    },

    {

        "Num": "2",

        "Name": "백두산"

    },

    {

        "Num": "3",

        "Name": "한라산"

    },

    {

        "Num": "4",

        "Name": "북한산"

    },

    {

        "Num": "5",

        "Name": "도봉산"

    },

    {

        "Num": "6",

        "Name": "뒷산"

    }

]

=========================================

02.JQuery.getJSON.htm

------------------------------------------

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

    <title>비동기적으로 JSON파일 로드</title>

    <script src="../Js/jquery-1.3.2-vsdoc2.js" type="text/javascript"></script>

    <script type="text/javascript">

        $(document).ready(function() {

            $("#btn .btnLoad").click(function() {

                $.getJSON("02.jQuery.getJSON.js", function(data) {

                    $('#pnlDisplay').empty(); // 패널(div) 내용 초기화

                    var table = "<table border='1'><tr><td>인덱스</td><td>번호</td><td>이름</td></tr>";

                    // data 탐색 : each() 메서드를 사용해서 데이터가 있는만큼 반복

                    $.each(data, function(index, entry) {

                        table += '<tr>';

                        table += '<td>' + index + '</td>';

                        table += '<td>' + entry["Num"] + '</td>';

                        if (entry["Name"]) { //특정 필드를 비교할 이러한 표현법 사용

                            table += '<td>' + entry["Name"] + '</td>';

                        }

                        table += '</tr>';

                    });

                    table += "</table>";

                    $('#pnlDisplay').append(table); // 패널에 추가하기

                });

            });

 

        });

    </script>

</head>

<body>

    <div id="btn"><div class="btnLoad">HTML읽어오기</div></div>

    <div id="pnlDisplay">

    </div>

</body>

</html>

 


'jQuery' 카테고리의 다른 글

XML HTML로 로드 하기  (0) 2012.01.10
jquery 동적 js 실행  (0) 2012.01.10
jquery 정리  (0) 2011.12.26
아주쉬운 jQuery & jQuery Ajax  (0) 2011.10.11
jQuery 커버플로우  (0) 2011.07.29
블로그 이미지

스마트전

,

mysql 정리

MySQL 2012. 1. 6. 11:20

UPDATE sample SET state = 'done' WHERE date < DATE_ADD(now(), INTERVAL -6 hour)

DATE_ADD(now(), INTERVAL -6 hour)

 이 문장에서 hour 대신에 year, day, minute, second 로 바꿀 수 있다.

맨위 코드에서 '<' 를 '>' 로 바꾸게되면

6시간전을 기준으로 이전레코드가 아니라, 현재시간으로부터 6시간내의 자료만 가져올 것이다.


ALTER TABLE 테이블 ADD 컬럼 속성 옵션;

ALTER TABLE 테이블 modify 컬럼 속성 옵션;

ALTER TABLE 테이블 change  컬럼 속성 옵션;

블로그 이미지

스마트전

,

mysql date 함수

MySQL 2012. 1. 5. 14:23

- DAYOFWEEK(date) : 해당 날짜의 요일을 숫자로 반환한다. 일요일은 1, 토요일은 7 이다. 
- 예 : select DAYOFWEEK('1998-02-03'); 

- WEEKDAY(date) : 해당 날짜에 대한 요일을 반환한다. 월요일은 0, 일요일은 6 이다. 
- 예 : select WEEKDAY('1997-10-04 22:23:00'); 

- DAYOFYEAR(date) : 해당 날짜의 1월 1일부터의 날수를 반환한다. 결과값은 1에서 366 까지이다. 
- 예 : select DAYOFYEAR('1998-02-03'); 

- YEAR(date) : 해당 날짜의 년을 반환한다. 
- 예 : select YEAR('98-02-03'); 

- MONTH(date) : 해당 날짜의 월을 반환한다. 
- 예 : select MONTH('1998-02-03'); 

- DAYOFMONTH(date) : 해당 날짜의 일을 반환한다. 결과값은 1 에서 31 까지이다. 
- 예 : select DAYOFMONTH('1998-02-03'); 

- HOUR(time) : 해당날짜의 시간을 반환한다. 결과값은 0 에서 23 이다. 
- 예 : select HOUR('10:05:03'); 

- MINUTE(time) : 해당날짜의 분을 반환한다. 결과값은 0 에서 59 이다. 
- 예 : select MINUTE('98-02-03 10:05:03'); 

- SECOND(time) : 해당날짜의 초를 반환한다. 결과값은 0 에서 59 이다. 
- 예 : select SECOND('10:05:03'); 

- DAYNAME(date) : 해당 날짜의 요일 이름을 반환한다. 일요일은 'Sunday' 이다. 
- 예 : select DAYNAME("1998-02-05"); 

- MONTHNAME(date) : 해당 날짜의 월 이름을 반환한다. 2월은 'February' 이다. 
- 예 : select MONTHNAME("1998-02-05"); 

- QUARTER(date) : 해당 날짜의 분기를 반환한다. 결과값은 1 에서 4 이다. 

- WEEK(date,first) : 1월 1일부터 해당날가지의 주 수를 반환한다. 주의 시작을 일요일부터 할경우는 두번째 인자를 0, 월요일부터 시작할 경우는 1 을 넣는다. 결과값은 1 에서 52 이다. 
- 예 : select WEEK('1998-02-20',1); 

- PERIOD_ADD(P,N) : P (형식은 YYMM 또는 YYYYMM 이어야 한다.) 에 N 만큼의 달 수를 더한값을 반환한다. 주의할것은 두번째 인자는 숫자라는 것이다. 
- 예 : select PERIOD_ADD(9801,2); 

- PERIOD_DIFF(P1,P2) : 두개의 인자 사이의 달 수를 반환한다. 두개의 인자 모두 형식은 YYMM 또는 YYYYMM 이어야 한다. 

- DATE_ADD(date,INTERVAL expr type) : 날짜를 더한 날짜를 반환한다. 
- DATE_SUB(date,INTERVAL expr type) : 날짜를 뺀 날짜를 반환한다. 
- ADDDATE(date,INTERVAL expr type) : DATE_ADD(date,INTERVAL expr type) 와 동일하다. 
- SUBDATE(date,INTERVAL expr type) : DATE_SUB(date,INTERVAL expr type) 와 동일하다. 
- EXTRACT(type FROM date) : 날짜에서 해당 부분을 추출한다. 
- 예 : SELECT DATE_ADD("1997-12-31 23:59:59", INTERVAL 1 SECOND); 
SELECT DATE_ADD("1997-12-31 23:59:59", INTERVAL 1 DAY); 
SELECT DATE_ADD("1997-12-31 23:59:59", INTERVAL "1:1" MINUTE_SECOND); 
SELECT DATE_SUB("1998-01-01 00:00:00", INTERVAL "1 1:1:1" DAY_SECOND); 
SELECT DATE_ADD("1998-01-01 00:00:00", INTERVAL "-1 10" DAY_HOUR); 
SELECT DATE_SUB("1998-01-02", INTERVAL 31 DAY); 
SELECT EXTRACT(YEAR FROM "1999-07-02"); 
SELECT EXTRACT(YEAR_MONTH FROM "1999-07-02 01:02:03"); 
SELECT EXTRACT(DAY_MINUTE FROM "1999-07-02 01:02:03"); 
- 참고 : type 에 사용되는 키워드는 SECOND, MINUTE, HOUR, DAY, MONTH, YEAR, MINUTE_SECOND, HOUR_MINUTE, DAY_HOUR, YEAR_MONTH, HOUR_SECOND, DAY_MINUTE, DAY_SECOND 이다. 
- 주의 : 계산한 달의 날수가 작을 경우는 해당달의 마지막 날을 반환한다. 예를 들어 select DATE_ADD('1998-01-30', Interval 1 month); 의 경우 1998-02-28 을 반환한다. 

- TO_DAYS(date) : 0 년 부터의 날짜수를 반환한다. 이 함수는 1582 이전 날에 대해서는 계산하지 않는다. 
- 예 : select TO_DAYS(950501); 

- FROM_DAYS(N) : 해당 숫자만큼의 날짜를 반환한다. 이 함수는 1582 이전 날에 대해서는 계산하지 않는다. 
- 예 : select FROM_DAYS(729669); 

- DATE_FORMAT(date,format) : 날짜를 해당 형식의 문자열로 변환하여 반환한다. 
- 예 : select DATE_FORMAT('1997-10-04 22:23:00', '%W %M %Y'); 
select DATE_FORMAT('1997-10-04 22:23:00', '%H:%i:%s'); 
select DATE_FORMAT('1997-10-04 22:23:00', '%D %y %a %d %m %b %j'); 
select DATE_FORMAT('1997-10-04 22:23:00', '%H %k %I %r %T %S %w'); 
- 참고 : 형식은 다음과 같다. %M (달 이름), %W (요일 이름), %Y (YYYY 형식의 년도), %y (YY 형식의 년도), %a (요일 이름의 약자), %d (DD 형식의 날짜), %e (D 형식의 날짜), %m (MM 형식의 날짜), %c (M 형식의 날짜), %H (HH 형식의 시간, 24시간 형식), %k (H 형식의 시간, 24시간 형식), %h (HH 형식의 시간, 12시간 형식), %i (MM 형식의 분), %p (AM 또는 PM) 

- TIME_FORMAT(time,format) : DATE_FORMAT(date,format) 과 같은 방식으로 사용할수 있으나 날 이상의 것에 대해서는 NULL 이나 0 을 반환한다. 

- CURDATE() : 현재날짜를 반환한다. 숫자와 연산을 할경우 숫자로 변환된다. 형식은 'YYYY-MM-DD' 또는 YYYYMMDD 이다. 
- 예 : select CURDATE(); 
select CURDATE() + 0; 

- CURTIME() : 현재시간을 반환한다. 숫자와 연산을 할경우 숫자로 변환된다. 형식은 'HH:MM:SS' 또는 HHMMSS 이다. 
- 예 : select CURTIME(); 
select CURTIME() + 0; 

- SYSDATE() : 현재날짜시간을 반환한다. 숫자와 연산을 할경우 숫자로 변환된다. 형식은 'YYYY-MM-DD HH:MM:SS' 또는 YYYYMMDDHHMMSS 이다. 
- 예 : select NOW(); 
select NOW() + 0; 

- NOW() : SYSDATE() 와 동일하다. 

- UNIX_TIMESTAMP() : '1970-01-01 00:00:00' 부터의 초를 반환한다. 인자가 주어질 경우는 해당 날짜에 대한 유닉스 시간을 반환한다. 
- 예 : select UNIX_TIMESTAMP(); 
select UNIX_TIMESTAMP('1997-10-04 22:23:00'); 

- FROM_UNIXTIME(unix_timestamp) : 유닉스시간에서 날짜 형식으로 변환한다. 
- 예 : select FROM_UNIXTIME(875996580); 

- FROM_UNIXTIME(unix_timestamp,format) : 유닉스시간을 날짜형식으로 변환하고 DATE_FORMAT(date,format) 에서 설명한 포맷으로 변환하여 반환한다. 
- 예 : select FROM_UNIXTIME(UNIX_TIMESTAMP(), '%Y %D %M %h:%i:%s %x'); 

- TIME_TO_SEC(time) : 해당 시간의 0:0:0 에서부터의 초를 반환한다. 
- 예 : select TIME_TO_SEC('22:23:00'); 

- SEC_TO_TIME(seconds) : 초를 시간으로 바꾼다. 
- 예 : select SEC_TO_TIME(2378);

블로그 이미지

스마트전

,

jquery 정리

jQuery 2011. 12. 26. 09:31

 $.ajax({           // 실행 함수
  type:"POST",      // get.post 가능
  url:"ajax.jsp",       // 호출 url
  dataType: "json",              //date 타입  xml,text 등
  data:"point=1&gift=2",   // url 에 보낼 파라미터 값
  timeout:3000,              //제한시간 설정 가능
  cache:false,                // true, false
  error:function(request, status, error){   // 에러 발생 시   status 400 이 성공 그 외 404, 500 등
   alert("에러!");
  },
  success:function(msg){     // 성공 시 콜백  msg 에 data
   alert("성공");
  },
  beforeSend:function(){     // ajax 통신을 시작하기 전에 콜백
   alert("통신시작");
  },
  complete:function(){        //완료 후 실행할 콜백 함수 정의
   alert("통신완료");
  }
 });

 /**
  *  상황에 따라 적절하게 함수 사용 아래 상황 예제 샘플
  *  html document  완성 시  onload 와 유사함
  */
  jQuery(document).ready(function(){
   $.ajax({
    type:"GET",
    url:"ajax.jsp",
    data:param,
    success:function(msg){
     html_id.innerHTML = msg;    // text 로 태그 통신 시 html 삽입 하기
     $('.html_id').append(msg);    // 위와 같은 jQuery 방식 이거 쓰지마셈
     // '.html_id' <-- 이놈은 <div class='html_id'></div>
     // '#html_id' <-- 이놈은 <div id='html_id'></div>
     // 선언을 어떻게 하냐에 틀리고 적절하게 사용 하면 됨
    }
   });
  });

  /**
   * 엘리먼트 클릭 등 dom 의 변화에 따른 이벤트  id , class 등 지정 가능
   *  Ex id = # , class 는 . 으로 구분 css 문법과 같음~!
   */
 $(function() {
  $('#divId').click(function() {  // function 으로 감싸지 않고 아래의 예제처럼도 사용가능
   $.ajax({
    type:"GET",
    url:"ajax.jsp",
    data:"page="+3,
    success:function(msg){
     html_id.innerHTML = msg;    // text 로 태그 통신 시 html 삽입 하기
     $('.html_id').append(msg);    // 위와 같은 jQuery 방식
    }
   });
  });
 }); 
 
 /**
 * form submit 시 콜백 id, class 등 지정
 */
 $("formName").submit(function(){
  
 });
 
  /**
  * 함수 호출을 통한 ajax
  * <a href='board_list.php?page=1&code=2' >page전환</a> <--이거를
  * <a href='paging(1,2)' >page전환</a> 이런식으로 함수에 보내서 하면 되겠지~?
  */
 function paging(page,code){
  // POST 방식도 아래 param 처럼 만들어서 보내면 됨
  var param = "board_code="+code+"&page="+page;
  $.ajax({
   type:"GET",
   url:"board_list.php",
   dataType: "text",  
   data:param,
   success:function(msg){
    board_list_area.innerHTML = msg;
   }
  });
 }

 $(function() {
  $('[name=samju]').click(function() { 
   alert($(this).val());
  });
 }); 

 $(function() {
  $('[name=samju]').click(function() { 
   $(this).val(function(index,value){
    alert(this.value);
    alert(this.index);
   });
  });
 }); 

  $("button").click(function () {
      var text = $(this).text();
      $("input").val(text);
    });


  $("input").keyup(function () {
      var value = $(this).val();
      $("p").text(value);
    }).keyup();

 $('select.foo option:selected').val();    // 드롭박스에서 선택된 것을 가져옴
 $('select.foo').val();                    // 드롭박스에서 좀더 쉽게 값을 가져옴
 $('input:checkbox:checked').val();        // 체크가 된 체크박스의 값을 가져옴
 $('input:radio[name=bar]:checked').val(); // 라디오버튼 중 선택된 값을 가져옴

/**

<p>
  Once there was a <em title="huge, gigantic">large</em> dinosaur...
</p>

  The title of the emphasis is:<div></div>
  em 태그에서 title 속성을 가져와 title 변수로 넣음
**/

var title = $("em").attr("title");
  $("div").text(title);

  $('#greatphoto').attr({
   alt: 'Beijing Brush Seller',
   title: 'photo by Kelly Clark',
   src : './img/image.jpg'
});
// ID 가 greatphoto 인 이미지 태그에서 attr 속성을 불러오며 바로 값도 넣을 수 있음

$("button:gt(1)").attr("disabled","disabled"); // 버튼등의 비활성도 가능

/**
 <div></div>
  <div></div>
  <div></div>
 **/


    $("div").html("<b>Wow!</b> Such excitement...");
    $("div b").append(document.createTextNode("!!!")) .css("color", "red");

// Wow!!!! Such excitement...   Wow   와  Such excitement 사이에 !!! 빨간색 텍스트를 추가

 

//----------------------------------------------------------
// 배열 관련

var x = [0, 3, 1, 2];
console.log(x.reverse()); // x = [2, 1, 3, 0]
console.log(x.join(" – ")); // x = "2 - 1 - 3 - 0"
console.log(x.pop()); // x = [2, 1, 3]
console.log(x.unshift(-1)); // x = [-1, 2, 1, 3]
console.log(x.shift()); // x = [2, 1, 3]
console.log(x.sort()); // x = [1, 2, 3]
console.log(x.splice(1, 2)); // x = [2, 3]


// <div>Click here</div> 클릭 하면 파란색으로 바꾸기 파란색 -> 검정색 이런식..
$(document.body).click(function () {
      $("div").each(function (i) {
        if (this.style.color != "blue") {
          this.style.color = "blue";
        } else {
          this.style.color = "";
        }
      });
    });


/**
  <div></div>
  <div></div>
  <div id="stop">Stop here</div>
  <div></div>
 
3번 째 div 를 만나면 stop   false 를 리턴하면 멈춤
**/

 $("button").click(function () {
      $("div").each(function (index, domEle) {
        // domEle == this
        $(domEle).css("backgroundColor", "yellow");
        if ($(this).is("#stop")) {
          $("span").text("Stopped at div index #" + index);
          return false;
        }
      });
    });

 

/**

reverse() : 배열 순서를 뒤집기
 join('key') : key 값으로 배열요소를 문자열로 만들어줌
pop() : 배열의 맨 마지막 요소를 삭제하고 삭제된 해당 값을 반환함
unshift(값) : 값을 배열의 0번째 요소에 삽입하고 이전 요소를 하나씩 뒤로 밀어낸 후, 배열의 길이를 반환함(ie는 undefined를 반환함)
shift() : 배열의 맨 처음 요소를 삭제하고 삭제된 해당 값을 반환함
splice(index, 몇개) : index위치 부터 몇개를 삭제한 후 삭제된 요소들을 반환해 줍니다.


**/

// $.inArray(value, array);    값으로 배열 index 찾기
var index = $.inArray(2, [1, 2, 3, 4, 5]);          // 해당 index 변수에는 1이 할당된다.


$.makeArray(object);
//NodeList와 같은 변환될 유사 배열 객체, 이 함수를 사용하면 jQuery를 사용하지 않고 XML 문서를 순회할 때 NodeList 객체를 편리하게 다룰 수 있다


// 마우스 오버 이벤트 샘플
$("li.fade").hover(function(){$(this).fadeOut(100);$(this).fadeIn(500);});

$("li").hover(
  function () {
    $(this).append($("<span> ***</span>"));    //.appendTo("<span> ***</span>"") 마지막 요소에 추가
  },
  function () {
    $(this).find("span:last").remove();
  }
);


// Text 붙이기
// div class="inner">Hello</div>

$('<p>Test</p>').insertAfter('.inner');  //class inner 뒤에 <p> Tag 를 붙임  반대  .insertAfter()  앞에 붙이기  $('.inner').after('<p>Test</p>');

// Tag 를 DIV 로 감싸기

// <div class="inner">Hello</div>
//   <div class="new">
// <div class="inner">Hello</div>
//</div>

$('.inner').wrap('<div class="new" />');  // 위와 같이 태그를 감쌀 수 있음   // .wrapAll( wrappingElement )  로 많이 사용?

 

'jQuery' 카테고리의 다른 글

jquery 동적 js 실행  (0) 2012.01.10
jQuery json load  (0) 2012.01.10
아주쉬운 jQuery & jQuery Ajax  (0) 2011.10.11
jQuery 커버플로우  (0) 2011.07.29
jQuery 유용한 함수(?) eq  (0) 2011.06.23
블로그 이미지

스마트전

,