ASP.NET의 클라이언트측 코딩에는 두 가지 측면이 있습니다.
클라이언트 측 스크립트 : 브라우저에서 실행되어 페이지 실행 속도를 높입니다. 예를 들어, 클라이언트 측 데이터 유효성 검사는 유효하지 않은 데이터를 포착하고 서버에서 포스트백을 거치지 않고 이에 따라 사용자에게 경고할 수 있습니다.
클라이언트 소스 코드 : ASP.NET 웹 페이지는 이 클라이언트 소스 코드를 구성합니다. 예를 들어 ASP.NET 웹 페이지의 HTML 소스 코드에는 여러 숨겨진 영역이 포함되어 있으며 Java 설명 언어 코드를 자동으로 삽입하여 보기 상태와 같은 정보를 보존하거나 웹 페이지가 제대로 작동하는지 확인하기 위한 다른 작업을 수행할 수 있습니다.
모든 ASP.NET 서버 컨트롤은 Java 언어 또는 VBS 언어 그리기를 통한 응답 코딩을 허용합니다. 일부 ASP.NET 서버 컨트롤은 클라이언트측 스크립트를 사용하여 서버에 다시 게시하지 않고 사용자 요구에 응답합니다. 예를 들어 데이터 유효성 검사 컨트롤이 있습니다.
이러한 스크립트 외에도 버튼 컨트롤에는 버튼을 클릭할 때 클라이언트 스크립트를 실행하는 적절한 OnClientClick 메서드가 있습니다.
기존 서버 HTML 컨트롤에는 시작 시 스크립트를 실행하는 다음과 같은 이벤트가 있습니다.
| 이벤트 | 재산 |
|---|---|
| 흐리게 하다 | 컨트롤이 포커스를 잃을 때 트리거됩니다. |
| 집중하다 | 컨트롤이 포커스를 얻었을 때 트리거됩니다. |
| 클릭하면 | 컨트롤을 클릭하면 발생합니다. |
| 변경시 | 컨트롤 값이 변경되면 트리거됩니다. |
| 온키다운 | 사용자가 키보드 버튼을 누를 때 발생 |
| 키를 누르는 중 | 사용자가 영숫자 키를 누를 때 |
| 온키업 | 사용자가 키를 놓을 때 발생 |
| 마우스 오버 시 | 사용자가 제어 인터페이스에서 마우스 포인터를 움직일 때 트리거됩니다. |
| 서버클릭 | 제어 인터페이스를 클릭하면 ServerClick 이벤트 제어를 시작합니다. |
위에서 클라이언트 소스 코드에 대해 논의했습니다. ASP.NET 웹 페이지는 일반적으로 두 가지 유형의 파일로 작성됩니다.
콘텐츠 파일 또는 승인 파일(.aspx)
코드 숨김 파일
콘텐츠 파일에는 페이지 구조를 구성하는 HTML 또는 ASP.NET 제어 태그와 텍스트가 포함되어 있습니다. 코드 숨김 파일에는 분류 정의가 포함되어 있습니다. 런타임 시 콘텐츠 파일이 구문 분석되어 페이지 클래스에 전달됩니다.
이 페이지 클래스와 인코딩 파일의 클래스 정의 및 시스템 생성 인코딩이 함께 실행 인코딩(통합)을 구성합니다. 이러한 통합 인코딩은 모든 포스트백 데이터를 처리하고 응답을 생성하며 클라이언트에 작업을 다시 보냅니다.
다음의 간단한 페이지를 고려해보세요:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="clientside._Default" %><!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 runat="server"> <title> Untitled Page </title> </head> <body> <form id="form1" runat="server"> <div> <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox> <asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="Click" /> </div> <hr /> <h3> <asp:Label ID="Msg" runat="server" Text=""> </asp:Label> </h3> </form> </body></html>이 페이지가 브라우저에서 실행되면 소스 보기 옵션은 HTML 페이지를 표시하고 ASP.Net 런타임을 통해 브라우저로 보냅니다.
<!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> Untitled Page </title> </head> <body> <form name="form1" method="post" action="Default.aspx" id="form1"> <div> <input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUKMTU5MTA2ODYwOWRk31NudGDgvhhA7joJum9Qn5RxU2M=" /> </div> <div> <input type="hidden" name="__EVENTVALIDATION" id="__EVENTVALIDATION" value="/wEWAwKpjZj0DALs0bLrBgKM54rGBhHsyM61rraxE+KnBTCS8cd1QDJ/"/> </div> <div> <input name="TextBox1" type="text" id="TextBox1" /> <input type="submit" name="Button1" value="Click" id="Button1" /> </div> <hr /> <h3><span id="Msg"></span></h3> </form> </body></html>코딩을 제대로 살펴보면 처음 두 개의 <div> 태그에 보기 상태와 유효한 데이터를 저장하기 위한 숨겨진 필드가 포함되어 있음을 알 수 있습니다.