2013-07-03 2 views
3

사용자가 만든 모든 수정 사항이있는 페이지의 html을 가져올 수 있습니까?Javascript 현재 페이지의 html을 얻으십시오

예를 들어 텍스트가 텍스트 영역에 입력되었거나 확인란이 선택된 경우 해당 텍스트는 HTML에도 반영되어야합니다. 이 작업을 원한 이유는 사용자 페이지의 "스크린 샷"을 가져 오는 것입니다.

아래 답변은 jQuery('html')의 변형이며 사용자가 변경 한 내용을 반영하지 않습니다.

+2

[javascript 페이지 소스 코드] (http://stackoverflow.com/q/1367587/218196) 중복. 이것은 [두 번째 질문]입니다 (http://stackoverflow.com/q/17450681/218196). –

+0

@FelixKling 어떻게 이것이 중복됩니까? 다른 질문은 단순히 페이지의 html을 묻습니다. textareas에 입력 된 텍스트, 선택한 체크 박스 등을 html에 반영하고 싶습니다. – LanguagesNamedAfterCofee

+0

아, 나는'input' 변경 부분을 놓쳤습니다. * "사용자가 수정 한 사항"*이라는 문구는 다소 모호합니다. DOM 수정도 수정되었습니다 (사용자 상호 작용에 대한 응답으로 발생할 수 있음). –

답변

2

스크린 샷을 원할 경우 html2canvas과 같은 도구를 고려해야합니다. HTML을 가져 오는 것만으로는 입력 필드를 얻을 수 없습니다.

Another SO thread along these lines.

다른 답변은 특히,하지만 다른 답변에 적응 입력 '값

$('html').html(); 
+0

감사합니다. html2canvas가 꽤 무거울지라도, 도움이 될 수는 없습니다. – LanguagesNamedAfterCofee

3

당신은 jQuery를 사용할 수 있습니다

var html = $('html') 
+0

이보다 더주는 것이 무엇입니까? –

+0

@MohammadAreebSiddiqui :이 한 줄은 실제로 데모입니다 ... 안돼요? –

+4

흠 ... 복잡해 보입니다. 더 간단한 방법이 있습니까? – musefan

0

당신이 "필드"라는 이름의 필드가있는 경우 : 당신이 체크 박스가있는 경우

var field = document.getElementById("field"); 
fieldvalue= field.value; 

을 작업이 사실상 동일합니다. 희망이 도움이되었다.

0

없이, 당신에게 HTML을 얻을 것이다.

$('a').click(function(e){ 
    setValueProperties(); 
    var html = getHtml(); 
    alert(html); 
}); 

function setValueProperties(){ 
    $('input').each(function(){ 
     $(this).attr("value", $(this).val()); 
    }); 
} 

function getHtml(){ 
    return document.documentElement.outerHTML; 
} 

Here is a working example

And here is an example that supports checkboxes

참고 : HTML을 취득하기 전에, 당신은 루프 수동으로 모든 입력 요소가 value 속성을 설정할 수 있지만, 이것은 다음 HTML에 반영 될 것입니다 당신은 귀하의 정확한 요구에 맞게이 기능을 조정해야 할 수도 있지만, 필요에 따라 적절한 결과를 얻을 수 있기를 바랍니다.

관련 문제