Ajax 성공 콜백 - DOM이 업데이트되지 않습니다.

Question

$.ajax 함수를 실행 중입니다. 원하는 데이터가 json 형식으로 성공적으로 반환되며이를 구문 분석하고 원하는 속성을 가져올 수 있습니다. 그런 다음 DOM을 변경하려고 시도하면 변경되지 않습니다. console.log() 문은 사물이 변하는 것을 보여 주지만, 페이지 원본을 볼 때 원본 요소는 여전히 있습니다.

코드 :

$.ajax({ 
    success: function (jsonImageString) { 
     if (jsonImageString.length > 0) { 
      var embeddedImages = $.parseJSON(jsonImageString);       

      $.each(embeddedImages, function() { 
       var currPin = this.pin; 
       var currUrl = this.url; 
       var currTitle = this.title; 

       //statement displays correct pin 
       console.log(currPin); 

       //statement shows correct original html 
       console.log($("a[href='" + currPin + "']").html()); 

       //nothing changes- viewing source of page shows original elements 
       $("a[href='" + currPin + "']") 
        .addClass("displayLink") 
        .html("<img src='" + currUrl + "' alt='" + currTitle + "' />"); 

        //shows what would be if something had actually changed... 
        console.log($("a[href='" + currPin + "']")[0].outerHTML); 
       }); 

      } 
     } 
    }); 

Answer 1

내가 어떻게 소스를보고있는 페이지

의 소스를 볼?

아마도 브라우저에서 "소스보기"메뉴 옵션을 사용하고 있습니까? 일반적으로 브라우저의 "소스보기"메뉴 옵션은 원래 소스가 서버에서 가져온 것을 보여줍니다. 업데이트 된 변경 사항을 보려면 일반적으로 브라우저의 디버깅 도구의 일부인 DOM 탐색기를 사용하는 것이 좋습니다.

DOM이 업데이트되고 있습니다. 원본 소스가 아닙니다.