2013-04-12 3 views
-3

HTML 파일이 있는데이 파일의 내용을 외부 HTML 파일의 \ div 전체 내용으로 바꿉니다. divdiv를 외부 html 파일의 div로 바꿉니다.

jquery로 시도하고 있지만 뭔가 잘못되었습니다.

$("#originHtml").replaceWith(external.html #temp); 

을하고 ' " '와 모든 종류의 조합 : 여기 는 내가 지금까지있어 것입니다.

코드는 다음과 같습니다

$("#originDivId").replaceWith(external.html #temp); 
+0

replaceWith는 "external.html #temp"를 문자열로 사용합니다. 그래서 나는 작동하지 않으며 .load는 길입니다. – Alex

답변

7

당신은 다른 파일에서 div의를로드하기 위해 jQuery를 .load() 기능을 사용해야합니다.

$("#originHTML").load('external.html #temp'); 

UPDATE : 당신은 external.html에서 HTML을 얻을 아약스를 사용할 수 있습니다

$.ajax({ 
    url: 'external.html', 
    dataType: 'html', 
    success: function(html) { 
     var targetdiv = $('#temp', $(html)); 
     $('#originHTML').replaceWith(targetdiv); 
    } 
}); 
+0

고마워요.하지만 이미 시도해 봤는데 여기에 콘솔에있는 내용이 있습니다. XMLHttpRequest가 file : /// C : /Users/***/workspace/pub/WebContent/external.html을로드 할 수 없습니다. Origin null은 Access-Control-Allow-Origin에 의해 허용되지 않습니다. – user1908466

+0

OP가 실제로 'originHtml'을 대체하려고한다고 가정하면 'load()'만으로는 그렇게하지 않습니다. 'load()'는 HTML을 가져 와서 originHtml으로 반환하지만 ** originHtml을 대체하지는 않습니다 **. – Nope

+0

@ user1908466 : 아약스 사용은 외부 HTML 파일의 내용을로드하는 방법입니다. 'ajax'를 직접적으로 사용하거나 간략한 방법 중 하나를 통해'get','load' 등을 사용합니다. 액세스 제어 문제는 완전히 다른 문제입니다. – Nope

2

.

$(document).ready(function(){ 
    $.get("external.html", function(data){ 
     $("#originHtml").replaceWith($(data).find("#temp")); 
    }); 
}); 

희망이 당신이 JQuery와 아약스 기능을 사용할 수있는 다른 파일에서 내용을로드

+0

이것은 요소를 대체하는 좋은 방법이지만 코드에서'data'는 jQuery 객체가 아닙니다. – undefined

+0

@undefined true. 편집 됨. 감사. – ysrb

0

을하는 데 도움이됩니다.

$("#originHtml").load('external.html #temp'); 

$(document).ready(function(){ 
    $("#originHtml").load('external.html #temp'); 
}); 
관련 문제