javascript - jquery jsonp 원리: js 태그가 동적으로 생성된 위치 문제

Question

jquery jsonp의 원칙은 script标签中src属性来解决前后端数据请求遇到的跨域问题.有一点不明白的是jquery把动态生成的script标签追加到了head标签中，也就是文档的头部；一般我们的回调函数在body를 사용하는 것입니다. 함수를 먼저 선언한 다음 사용합니다. 선언 없이 직접 호출하여 백그라운드에서 전달된 데이터를 얻을 수 있는 이유는 무엇입니까?

내가 한 테스트는 다음과 같습니다.

으아악

이 코드 문자열이 선언된 test函数下面就会打印出数字10，如果放在test 함수 위에 배치되면 오류가 보고됩니다

으아악

jquery 구현과 비교하면 동적으로 생성된 js가 선언된 함수 이전에 호출되어도 왜 실행되는지 잘 모르겠습니다.

Answer 1

으아악

직접 연결된 src인 경우 브라우저는 이를 위에서 아래로 구문 분석한 후 먼저 b.js의 값을 검색합니다. 현재로서는 a.js의 기능이 아직 페이지에 로드되지 않았습니다. , test() 함수가 없으므로 오류가 발생합니다

하지만 Ajax 요청을 보낼 때는 페이지가 완료될 때까지 기다렸다가 요청합니다. 즉, 먼저 콜백 함수를 선언한 다음 요청할 스크립트를 생성하므로 이때 스크립트의 위치는 그렇습니다. 최종 결과에 영향을 미치지 않습니다.

Answer 2

비동기적인 문제를 무시했기 때문에 실행 순서 측면에서 서버에서 다시 전송된 스크립트 태그가 로드될 때 로컬 콜백 함수가 정의되어 있어야 해당 메서드를 호출할 수 있습니다.
간단히 말하면:
jsonp=로컬 콜백 함수 정의=>스크립트 태그 로드=>로드된 스크립트 태그의 콘텐츠를 실행합니다.

Answer 3

jsonp 직설적으로 말하면 합의이다:
'우리는 너무 멀리 떨어져 있고 서로 닿을 수 없는데 어떻게 네 물건을 나에게 줄 수 있니?'
'내가 던지면 잡을 수 있니?' ?'
'알겠습니다. 1시 위치(callbackName)에 바구니(콜백)가 있습니다. 바구니가 있는지 없는지, 올바른 위치에 있는지 확인하세요. 이는 귀하의 계약에 영향을 미치지 않습니다.

Answer 4

jsonp에서 소개하는 js 로딩 위치는 js를 얻기 위한 jsonp 문이 실행되는 위치입니다. 배치에 관해서는 단지 형식적인 것뿐입니다.