>웹 프론트엔드 >JS 튜토리얼 >AJAX를 사용하여 HTML 조각에서 JavaScript 스크립트 반환하기_javascript 팁

AJAX를 사용하여 HTML 조각에서 JavaScript 스크립트 반환하기_javascript 팁

WBOY
WBOY원래의
2016-05-16 18:37:121238검색

이는 AJAX 개발에서 매우 일반적인 문제입니다. 개발에 JavaScript 프레임워크를 사용해 본 적이 없다면 오래 전에 이 문제를 발견했을 것입니다. 이 기사에서는 두 가지 솔루션을 분석하며 그 중 하나는 jQuery 프레임워크의 구현을 설명합니다.

1. 문제 설명
다음은 문제를 보여주는 간단한 예입니다. 다음 예에서는 responseText 변수가 메시지를 팝업하는 스크립트가 포함된 AJAX에 의해 로드된 HTML 조각 데이터라고 가정합니다. ID가 ajaxData인 DIV에 이를 삽입할 수 있습니다. 메시지 상자가 팝업되지만 그것이 문제가 아닙니다.

코드 복사 코드는 다음과 같습니다.




2. 둘 솔루션 방법
1. JavaScript의 eval 메서드를 사용하여 스크립트를 실행합니다.

이 방법의 구체적인 구현 아이디어는 xmlHttp.responseText에서 모든 스크립트를 추출하는 것입니다. AJAX가 로드한 HTML에 포함된 스크립트 블록 수에 관계없이 eval 메서드를 호출하여 찾은 스크립트를 실행할 수 있습니다. 블록. 캡슐화된 함수는 다음과 같습니다.
코드 복사 코드는 다음과 같습니다.

함수 실행 스크립트 (html )
{
var reg = /]*>([^x00] )$/i
//var htmlBlock = html.split("");
for (var i in htmlBlock)
{
var 블록; [1]은 이전 reg 정의를 캡처하기 위해 대괄호를 사용했기 때문에 실제 스크립트 콘텐츠입니다.
if (blocks = htmlBlock[i].match(reg))
{
//Clear 가능한 주석 태그는 주석 --> 끝 부분에서는 무시해도 eval은 계속해서 정상적으로 작동합니다.
var code = block[1].replace(/