"소스"와 "생성 된 소스"의 차이점은 무엇입니까?

Firefox의 "소스"와 "생성 된 소스"의 차이점은 무엇입니까?"소스"와 "생성 된 소스"의 차이점은 무엇입니까?

예를 들어 설명해주십시오.

편집 :7월 3일 발생하기 전에 소스 "검색 엔진"사용 생성 또는

출처

2010-07-02 Jitendra Vyas

그냥 참고 :이 파이어 폭스,이 메뉴 항목이 없습니다. 그러나 생성 된 소스를보고 (ctrl-a) 모든 것을 선택하고 오른쪽 클릭 -> "선택 소스보기" – mykhal

@mykhal - 예 "Web Developer Toolbar"의 스크린 샷 –

소스 -

보기 소스가 실제로 표시되고 있는지의 소스 코드를 표시합니다 생성.

생성 된 소스는 현재 DOM 요소에서 '소스 코드'를 그릴 것이므로 JavaScript에 의해 동적으로 생성 된 요소가 포함됩니다.

예를 들어, 소스는 보여줄 것이다 :

<script> 
    window.onload = function(){ 
    document.getElementById('test').innerHTML = 'Generated Content'; 
    } 
</script> 
<html> 
    <div id='test'>Source</div> 
</html>

및 생성 된 소스를 시간에 소스를 '그리는'것이 당신 사업부의 내용을 변경 한 후 '보기 생성 된 소스'를 클릭하고 당신은 것 참조 :

<script> 
    window.onload = function(){ 
    document.getElementById('test').innerHTML = 'Generated Content'; 
    } 
</script> 
<html> 
    <div id='test'>Generated Content</div> <!-- Note the difference here --> 
</html>

출처

2010-07-02 05:38:19

소스보기는 서버에서 제공 한 소스를 보여줍니다. 페이지가 (서버에 의해 제공)와 함께로드 된 소스를 표시합니다 자바 스크립트의 변경 사항을 포함, 등

출처

2010-07-02 05:38:01 icktoofay

서버 및 클라이언트 측 언어에만 관련됩니다. CSS와 HTML은 "Source"와 "Generated Source"에서 동일합니다. –

아니요, 생성 된 소스의 예는 div의 텍스트를 업데이트하는 웹 서비스에 대한 AJAX 호출입니다. 생성 된 소스는 페이지가 요청되었을 때 초기에로드 된 내용을 소스가 표시 할 화면의 현재 위치를 표시합니다. –

@Durilai - 예를 들어 라이브 예제를 가져 와서 설명해주십시오. 감사합니다 –

정말 간단합니다.

출처 :

<body> 
    <script>document.write("hello, world");</script> 
</body>

생성 된 소스 :

<body> 
    <script>document.write("hello, world");</script> 
    hello, world 
</body>

더 자세하게 : "소스"페이지 요청에 대한 응답으로 브라우저에 도착하는 것이다. "생성 된 소스"는 브라우저에서 모든 자바 스크립트가 실행 된 후 발생하는 것입니다.

출처

2010-07-02 05:52:33 egrunin

그래서 자바 스크립트에만 관련이 있어요. html과 css는 "Source"와 "Generated Source"에서 동일합니다. –

아니요, Javascript로 작성된 CSS 또는 HTML은 생성 된 소스에 있습니다. – Jacob

"생성 된 소스"라는 용어는 잘못된 것입니다. 왜냐하면 당신이보고있는 것이 "소스"가 아니기 때문입니다. '출처'는 브라우저에 전송 된 HTML입니다. "생성 된 소스"는 소스의 구문 분석과 스크립트의 적용으로 인해 해당 객체 모델에 대한 후속 변경으로 인해 생성 된 객체 모델의 현재 상태를 직렬화 한 것입니다. 다른 답변은 자바 스크립트에 대해 논의했지만 파서의 효과는 무시해서는 안됩니다. 이다

<title>My Test Example</title> 
<table> 
    <tr> 
    <td>Hello</td> 
    <div>There</div> 
</table>

생성 된 소스 (명확성을 위해 약간의 공백을 추가 한 후) :

이

<html> 
    <head> 
     <title>My Test Example</title> 
    </head> 
    <body> 
     <div>There</div> 
     <table> 
       <tbody> 
        <tr> 
         <td>Hello</td> 
        </tr> 
       </tbody> 
     </table> 
    </body> 
</html>

는 HTML, 머리, 몸과 TBODY 개폐 태그되었습니다 방법을 참조하십시오

이 소스를 고려 파서가 추가 한 것과 마찬가지로 닫는 tr 태그가 추가되었습니다. 또한 div가 표 앞에 이동되었습니다.

출처

2010-07-02 08:24:22 Alohci

'보기 소스'는 텍스트 편집기에서 파일을 연 것처럼 파일의 실제 코드를 보여줍니다.

'view generated source'는 모든 서버 측 스크립트 (Javascript, PHP 등)가 실행 된 후 브라우저에서 화면을 렌더링하는 방법을 보여줍니다.

당신이 index.html을 빈 div과 image.jpg 다음 '소스보기'자바 스크립트를 사용하여이 div에 'AJAXed'하고 있었다있어 만약 그렇다면 당신에게

<div></div>

을 보여줍니다하지만 '보기 소스를 생성' 당신에게 보여줄 것입니다

<div><img src="image.jpg"/></div>

출처

2010-07-02 09:42:34 pixeltocode

"소스"와 "생성 된 소스"의 차이점은 무엇입니까?

답변

관련 문제