JavaScript - Chrome이나 FF가 아닌 IE에 표시되는 결과

-1

저는 자바 스크립트를 처음 사용합니다.JavaScript - Chrome이나 FF가 아닌 IE에 표시되는 결과

어쨌든 Internet Explorer에서는 작동하지만 Chrome이나 FF에서는 작동하지 않는 다음 코드가 있습니다. Reddit RSS에서 데이터를 가져 와서 출력합니다. 바로 그 것입니다. IE에서만 작동합니다. 아무도 내가 여기서 잘못하고있는 것을 설명 할 수 있습니까?

<html>                 
<head>                 
<script type="text/javascript"   
src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>   
<script type="text/javascript"> 


var result = null; 
$.ajax({ 
    url: "http://www.reddit.com/.rss", 
    type: 'get', 
    dataType: 'html', 
    async: false, 
    success: function(data) { 
    result = data; 

    } 
}); 

document.write(result); 

</script> 
</head> 
</body> 
</html>

출처

2012-03-27 kallell

HTML이 올바르게 구성되지 않았습니다. 닫는 body 태그 안에 닫는 head 태그가 있습니다. –

$.ajax이 비동기이기 때문에 경쟁 조건이 있습니다. 성공 핸들러에 결과를 표시하여 요청이 완료되었음을 보증합니다. false로 비동기 설정 때문에

$.ajax({ 
    url: "http://www.reddit.com/.rss", 
    type: 'get', 
    dataType: 'html', 
    async: false, 
    success: function(data) { 
     document.write(data); 
    } 
});

업데이트

는 위의 문장은 적용되지 않습니다. 그러나 문제의 일부인 document.write()을 사용해야하는 정당한 이유를 찾지 못했습니다. 다른 방법을 사용하여 .html(), .append(), alert() 등과 같이 데이터를 페이지에 삽입하십시오. document.ready 중 하나를 사용해도 좋습니다.

$(document).ready(function() { 
    var result = null; 
    $.ajax({ 
     url: "http://www.reddit.com/.rss", 
     type: 'get', 
     dataType: 'html', 
     async: false, 
     success: function(data) { 
     result = data; 
     } 
    }); 

    alert(result); 
    $("body").append(result); 
});

출처

2012-03-27 17:36:48 jrummell

페이지로드가 의도하지 않은 결과를 낳을 것이므로 document.write를 사용하는 것이 좋습니다. 네가 날 이겼어! :-) – Timmerz

정확히 진실하지는 않습니다. async false는'$ .ajax'에 대한 호출이 끝나기 전에 성공 콜백을 호출해야합니다. 성공 핸들러의'document.write'는 전체 페이지를 확실히 지워 버릴 것입니다. –

async 플래그를 false로 설정했습니다. 여기의 문제는 3 개의 Javascript 엔진이 "성공"콜백을 실행하는 방법에있어서 실제적인 미묘한 차이입니다. (IE에서 실행 중인지 여부를 확인하는 코드가 원인 일 수 있습니다.) 기본적으로 Firefox와 Chrome은 이벤트 루프에서 하나의 이벤트에서 IE 코드가 모두 실행되는 것처럼 보입니다. - "split"이''success'' 콜백 호출인지, 아니면''$ .ajax'' 함수 호출인지 확실하지 않습니다. –

예,이 코드는 올바르지 않습니다. 그것은 경쟁 조건입니다. document.write는 즉시 실행됩니다. 아약스는 시간 내에 결과를 설정했거나 설정하지 않았을 수 있습니다. 당신은 성공 이벤트 페이지에 결과를 추가 할 필요가 ... 같은 :

$.ajax({ 
    url: "http://www.reddit.com/.rss", 
    type: 'get', dataType: 'html', 
    async: false, 
    success: function(data) { 
    $("#some-div").html(data); 

    } });

출처

2012-03-27 17:39:48 Timmerz

비동기를 그대로 두지 않는 것이 좋습니다. RSS 피드를 가져 오는 데 얼마나 오래 걸릴지는 중요하지 않습니다. 일단 그것이 도착하면, div에 그것을 밀어 넣고 그동안 트럭에 계속하십시오. –

예, 방금 코드를 복사했습니다. 그는 인라인이나 무언가를 실행할 수 있도록 경주로 인해 거기에 넣었을 것입니다. 나는 단지 성공 함수에 관심이있다. – Timmerz

아, 알겠습니다.그래, 왜 그런지 모르겠지만 내 의견을 말할 때까지 원래 코드를 보지 않았다. 그래서 나는 아약스 호출을보고 있었고 처음에는 경쟁 조건이 있다고 생각하지 않았다 (심지어 당신이 그것을 말했다고해도!). 빈 페이지를 렌더링하는 것과는 다른 뭔가를해야 할 것입니다. 그러면 문서에서 Ajax 호출이 비동기가 false가 될 준비가되었습니다. –

무엇을이 방식으로 처리에 대한 :

(function(url, callback) { 
    jQuery.ajax({ 
     url: document.location.protocol + '//ajax.googleapis.com/ajax/services/feed/load?v=1.0&num=10&callback=?&q=' + encodeURIComponent(url), 
     dataType: 'json', 
     success: function(data) { 
      callback(data.responseData.feed); 
     } 
    }); 
})('http://www.reddit.com/.rss', function(feed) { 
    var entries = feed.entries, 
     feedList = ''; 
    for (var i = 0; i < entries.length; i++) { 
     feedList += '<li><a href="' + entries[i].link + '">' + entries[i].title + '</a></li>'; 
    } 
    jQuery('.rssfeed > ul').append(feedList); 
});

HTML :

<div class="rssfeed"> 
    <h4>RSS News</h4> 
    <ul></ul> 
</div>

샘플 : http://jsfiddle.net/QusQC/

출처

2012-03-27 18:48:29

jQuery 버전을 업데이트하면 그대로 XML을 처리 할 수 있습니다. –

JavaScript - Chrome이나 FF가 아닌 IE에 표시되는 결과

답변

관련 문제