HTML 페이지 점프 전달 매개변수

HTML 페이지 점프 전달 매개변수는 웹 개발에서 흔히 사용되는 기술로, 매개변수를 전달함으로써 페이지 간 데이터 상호작용 및 정보 전달이 가능해 사용자에게 보다 개인화된 서비스를 제공할 수 있습니다. 이 기사에서는 HTML 페이지 점프를 구현하고 매개변수를 전달하는 방법에 대한 몇 가지 방법을 소개합니다.

1. URL 매개변수 전달

URL 매개변수 전달은 HTML 페이지로 이동할 때 매개변수를 전송하는 데 가장 일반적으로 사용되는 방법 중 하나입니다. 매개변수 정보가 포함된 URL 주소를 자주 볼 수 있습니다. 예:

http://www.example.com/index.php?id=10&name=test

그 중 ? 뒤에 id=10&name=test가 전달됩니다. , id 및 name은 매개변수 이름이고, 10 및 test는 매개변수 값입니다. 구체적인 구현 방법은 다음과 같습니다.

1. 소스 페이지에 링크 주소를 정의합니다.

클릭하여 점프

그 중 target.html이 대상 페이지 주소이고, 그 뒤에 id=10&name=test가 있습니다. ?는 전달할 매개변수 정보입니다.

2. 대상 페이지에서 매개변수 값 가져오기:

//id 매개변수 값 가져오기
var id = GetQueryString("id");
//name 매개변수 값 가져오기
var name = GetQueryString ("name") ;

//URL 매개변수 가져오기
function GetQueryString(name){

var reg = new RegExp("(^|&)"+name+"=([^&]*)(&|$)");
var r = window.location.search.substr(1).match(reg);
if(r!=null)return  unescape(r[2]); return null;

}

위 방법을 통해 대상 페이지에서 전달된 매개변수 정보를 가져오고 필요에 따라 해당 작업을 수행할 수 있습니다.

2. 양식 제출 및 매개변수 전달

양식 제출은 HTML 페이지로 이동할 때 매개변수를 전달하는 데 일반적으로 사용되는 또 다른 방법입니다. 양식 제출을 통해 데이터를 지정된 페이지로 전송하여 페이지 간 데이터 상호 작용을 실현할 수 있습니다. 구체적인 구현 방법은 다음과 같습니다.

1. 소스 페이지에서 양식을 정의합니다.

<input type="hidden" name="id" value="10">
<input type="hidden" name="name" value="test">
<input type="submit" value="提交">

여기서 action은 대상 페이지 주소이고, method는 제출 방법입니다. 여기서는 get 방법을 사용하여 제출합니다. id와 name은 전달할 파라미터 이름이고, 10과 test는 전달할 파라미터 값입니다.

2. 대상 페이지에서 매개변수 값 가져오기:

//id 매개변수 값 가져오기
var id = GetQueryString("id");
//name 매개변수 값 가져오기
var name = GetQueryString ("name") ;

//URL 매개변수 가져오기
function GetQueryString(name){

var reg = new RegExp("(^|&)"+name+"=([^&]*)(&|$)");
var r = window.location.search.substr(1).match(reg);
if(r!=null)return  unescape(r[2]); return null;

}

여러 매개변수 전달, 파일 전달 등 양식 제출을 통해 더욱 복잡한 데이터 전송이 가능합니다.

3. 쿠키 전송 매개변수

쿠키는 클라이언트 측에 데이터를 저장하고 HTML 페이지 간에 매개변수 정보를 전송할 수 있는 기술입니다. 구체적인 구현 방법은 다음과 같습니다.

1. 소스 페이지에서 쿠키를 설정합니다.

document.cookie="id=10";
document.cookie="name=test"; 문서를 통해 쿠키 정보를 설정합니다. cookie, id, name은 전달할 매개변수 이름이고, 10과 test는 전달할 매개변수 값입니다.

2. 대상 페이지에서 쿠키 값을 가져옵니다.

//id 매개변수 값 가져오기

var id = getCookie("id");

//name 매개변수 값 가져오기
var name = getCookie ("name") ;

//지정된 이름의 쿠키 값 가져오기

function getCookie(name){

var arr,reg=new RegExp("(^| )"+name+"=([^;]*)(;|$)");
if(arr=document.cookie.match(reg))
    return decodeURIComponent(arr[2]);
else
    return null;

}

쿠키를 통해 매개변수를 전달하면 서로 다른 페이지 간에 데이터 공유 및 정보 전송이 가능하지만 쿠키에 의해 저장되는 데이터의 양은 제한되어 있으므로 너무 큰 매개변수 정보를 전달하는 것은 바람직하지 않습니다.

위에서는 HTML 페이지로 이동할 때 매개변수를 전송하는 여러 가지 방법을 소개합니다. 다양한 방법은 다양한 시나리오에 적합합니다. 프런트 엔드 개발자는 특정 요구 사항에 따라 페이지 간 데이터 상호 작용 및 정보 전송을 구현하는 적절한 방법을 선택하여 사용자에게 보다 개인화된 서비스를 제공할 수 있습니다.

위 내용은 HTML 페이지 점프 전달 매개변수의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!