programing

jQuery.jax()에서 반환된 데이터를 필터링하려면 어떻게 해야 합니까?

sourcejob 2023. 10. 26. 20:59
반응형

jQuery.jax()에서 반환된 데이터를 필터링하려면 어떻게 해야 합니까?

사용시jQuery.ajax()방법, 정확하게 필요한 것을 얻기 위해 반환되는 데이터를 필터링하는 데 어려움을 겪고 있습니다.이것이 사용하기 쉽다는 것을 압니다..load()그리고 아마 다른 jQuery AJAX 메소드들을 사용할 것입니다..ajax()구체적으로

예를 들어, 나는 이것이 효과가 있다는 것을 알고 있습니다.

var title = $(data).filter('title'); // Returns the page title

하지만 id="foo"를 가진 div의 내용을 원하는 경우에는 어떻게 합니까?

var foo = $(data).filter('#foo'); // None of these work
var foo = $(data).find('#foo');   //
var foo = $('#foo', data);        //

이상적으로, 저는 타이틀, 디브 또는 jQuery가 선택할 수 있는 다른 요소를 선택하는 데 사용할 수 있는 일반 jQuery 선택기를 통과할 수 있는 한 가지 방법을 원합니다.이것은 내 자신의 아약스 함수에 어떤 문자열도 전달할 수 있도록 하기 위한 것입니다.

myApp.ajax({
    url: 'myPage.html',
    filterTitle: 'title',
    filterContent: '#main-content'
});

어떤 도움이라도 주시면 대단히 감사하겠습니다.

의 사용.filter()대.find()검색한 HTML 페이지의 구조에 따라 달라집니다.예를 들어, 이 페이지가 검색된 페이지일 경우:

<!DOCTYPE html>

<html>

<head>
    <title>Foo</title>
</head>

<body>
    <div id="wrap">
        <div id="header">
            <h1>Foo</h1>
        </div>
        <div id="body"> content </div>
    </div>
    <div id="tooltip"> tooltip </div>
</body>

</html>  

최상위 요소 = 의 직접 자식인 요소를 선택하려는 경우<body>- 이 예에서는 다음과 같습니다.#wrap아니면#tooltip- 그러면 당신은 사용해야 합니다.filter().

다른 요소를 선택하려는 경우 - 이 예제에서는 다음과 같습니다.#header,<h1>,#body, ... - 그럼 당신은find().

당신은 당신의 요소가 아이인지 아닌지 모릅니다.<body>아니어도 다음과 같은 "hack"를 사용할 수 있습니다.

$("<div>").html(data).find( selector );

이 해결책을 사용하면 항상 다음을 통해 요소를 얻을 수 있습니다.find().

jQuery.load메소드는 다음 코드를 사용합니다.

// If successful, inject the HTML into all the matched elements
if ( status === "success" || status === "notmodified" ) {
  // See if a selector was specified
  self.html( selector ?
    // Create a dummy div to hold the results
    jQuery("<div />")
      // inject the contents of the document in, removing the scripts
      // to avoid any 'Permission Denied' errors in IE
      .append(res.responseText.replace(rscript, ""))

      // Locate the specified elements
      .find(selector) :

    // If not, just inject the full result
    res.responseText );
}

즉, 자신이 생성한 DIV에 전체 응답을 추가한 다음 사용합니다.find(selector)그 위에

그래서 당신은 다음과 같은 것을 보고 있어야 합니다.

var foo = $('<div />').html(data).find('#foo'); // This looks like it'll work!

jQuery의 관점에서 보면 약간의 해킹!

@Matt 덕분에 이렇게 작동할 수 있었습니다.

$.ajax({
    type: "GET",
    url: url,
    dataType: 'html',
    success: function(data) {
        $('#foo').html(
            $('<div />').html(data).find('#foo').html()
        );
    }
});

전체가 제공하는 특별한 기능이 필요 없는 경우$.ajax방법, 당신은 줘야합니다.$.load()시도:

.load() 메서드는 $.get()과는 달리 원격 문서의 삽입할 부분을 지정할 수 있습니다.이는 url 매개 변수에 대한 특별한 구문을 사용하여 이루어집니다.문자열에 하나 이상의 공백 문자가 포함된 경우 첫 번째 공백 뒤에 오는 문자열 부분은 로드할 내용을 결정하는 jQuery Selector로 간주됩니다.

$('#result').load('ajax/test.html #container');

http://api.jquery.com/load/ #로딩페이지-

사용하다

$(data).filter("#foo").text();

HTML 내용을 반환하는 ajax 호출의 결과를 필터링하는 데 사용합니다.

언급URL : https://stackoverflow.com/questions/4245231/how-do-i-filter-the-returned-data-from-jquery-ajax

반응형