SeouliteLab

jQuery.param() 메소드: 객체를 쿼리 문자열로 변환하기 본문

프로그래밍

jQuery.param() 메소드: 객체를 쿼리 문자열로 변환하기

Seoulite Lab 2024. 4. 9. 08:38

예제 1: 객체를 쿼리 문자열로 변환하기

<!DOCTYPE html>
<html lang="ko">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>jQuery.param() 예제</title>
  <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
  <script>
    $(document).ready(function(){
      var params = { name: "John", age: 30, city: "New York" };
      var queryString = $.param(params);
      $("p").text(queryString);
    });
  </script>
</head>
<body>

<p></p>

</body>
</html>

설명:

위 예제에서는 jQuery.param() 메소드를 사용하여 객체를 쿼리 문자열로 변환하는 방법을 보여줍니다.

  • $.param() 메소드를 사용하여 params 객체를 쿼리 문자열로 변환합니다.
  • 이렇게 함으로써 params 객체의 속성과 값을 '&'로 연결된 쿼리 문자열로 변환하여 p 요소에 표시됩니다.

예제 2: 중첩된 객체를 쿼리 문자열로 변환하기

<!DOCTYPE html>
<html lang="ko">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>jQuery.param() 중첩 객체 예제</title>
  <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
  <script>
    $(document).ready(function(){
      var params = { person: { name: "Alice", age: 25 }, city: "Los Angeles" };
      var queryString = $.param(params);
      $("p").text(queryString);
    });
  </script>
</head>
<body>

<p></p>

</body>
</html>

설명:

이 예제는 중첩된 객체를 가진 params 객체를 쿼리 문자열로 변환하는 방법을 보여줍니다.

  • $.param() 메소드를 사용하여 params 객체를 쿼리 문자열로 변환합니다.
  • 이렇게 함으로써 중첩된 객체도 쿼리 문자열로 변환되어 p 요소에 표시됩니다.

예제 3: 배열을 포함하는 객체를 쿼리 문자열로 변환하기

<!DOCTYPE html>
<html lang="ko">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>jQuery.param() 배열 객체 예제</title>
  <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
  <script>
    $(document).ready(function(){
      var params = { fruits: ["apple", "banana", "orange"], color: "red" };
      var queryString = $.param(params);
      $("p").text(queryString);
    });
  </script>
</head>
<body>

<p></p>

</body>
</html>

설명:

이 예제는 배열을 포함하는 params 객체를 쿼리 문자열로 변환하는 방법을 보여줍니다.

  • $.param() 메소드를 사용하여 params 객체를 쿼리 문자열로 변환합니다.
  • 이렇게 함으로써 배열의 각 요소도 쿼리 문자열로 변환되어 p 요소에 표시됩니다.

jQuery.param() 메소드를 사용하면 객체를 쿼리 문자열로 변환할 수 있습니다. 이를 통해 서버로 데이터를 전송할 때 URL 쿼리 문자열 형식으로 데이터를 포함하여 전송할 수 있습니다. 이 메소드를 사용하면 편리하게 데이터를 처리할 수 있으며, 위 예제들을 통해 다양한 상황에서의 활용법을 익힐 수 있습니다.