2012-05-16 7 views
0

나는 다음과 같은 기능을 사용하고왜 Chrome 및 IE에서 document.getElementById(). setAttribute가 올바르게 작동하지 않습니까?</p> <p><code>function pdfChanger(location){ document.getElementById("pdf").setAttribute("data",location); }</code></p> <p>여기라고 :

<a href="javascript:pdfChanger('documents/SecurityDocs/sample.pdf')">test1</a><br/> 

을이 객체에 표시되는 pdf 파일 변경하도록 설계되었습니다

<object id="pdf" data="documents/sample2.pdf#toolbar=0&navpanes=0&scrollbar=0&page=1&view=FitHtop" 
        type="application/pdf"></object> 

을 파이어 폭스에서는이 기능을 불러 일으키는 링크를 클릭하면 pdf 개체가 올바르게 변경됩니다. 그러나 크롬에서는 변경된 pdf를 올바르게 표시하기 위해 링크를 클릭 한 후 pdf를 클릭해야합니다. IE에서는 pdf가 전혀 변경되지 않습니다. 왜 이런 일이 일어나고이 기능을 모든 브라우저에서 균일하게 작동 시키려면 어떻게해야합니까?

+0

속성을 변경하면 어떤 차이가 있습니까? "데이터 경로"또는 그 라인을 따라 무엇인가 말하십시오. https://developer.mozilla.org/en/DOM/element.setAttribute는 일부 예약어를 언급하며 "가치"만 언급하는 동안이를 배제하는 것이 좋습니다. – sottenad

답변

0

속성 값을 설정해도 html 요소가 다시 렌더링되지 않을 수 있습니다.

img 태그의 너비 또는 높이를 변경하면 항상 이미지가 다시 렌더링됩니다.

img 태그의 id를 변경하면 브라우저에서 이미지를 다시 렌더링해야합니까? 나는 그렇게 생각하지 않지만, 어떤 브라우저는 그렇게 할 수도있다.

object 태그의 'data'속성은 렌더링 시점에서 브라우저와 브라우저에서 다르게 생각할 수 있습니다. '데이터'또는 '소스 URL'로 간주됩니다.

요소의 렌더링을 보장하려면 전체 요소를 다시 작성하는 것이 좋습니다. 요소를 생성/추가하거나 innerHTML을 사용할 수 있습니다. 예 :

document.getElementById('object_div').innerHTML='<object id="pdf" ...></object>'