1. 홈
  2. 질의 응답
  3. html 객체 내의 내용을 앵커 태그

html 객체 내의 내용을 앵커 태그

2013-10-21 5 views
0

에서 변경할 수 없습니다. 하나의 브라우저 창에 3 개의 웹 사이트를두고 다른 창을 표시하지 않고도 상호 작용할 수있는 클라이언트 솔루션을 개발하고 있습니다. 원래 iframe이 작동 할 것이라고 생각했지만 사용 된 소프트웨어가 그 기능을 어떻게 든 사용 불가능하게 만들었습니다. 따라서 일부 연구를 수행 한 후에도 객체가 비슷한 기능을 수행 할 수 있음을 발견했습니다.html 객체 내의 내용을 앵커 태그

내가 가지고있는 한 가지 문제점은 하위 창에 다른 개체의 작업에 따라 내용이 변경되도록하고 싶다는 것입니다. 예를 들어, 객체 2에 링크를로드하기 위해 객체 3에 링크가 있다면, 그렇게 할 수 있습니다. 그러나 나는 그들이 서로간에 의사 소통하는 데 많은 행운이 없다. 모든 사람이 달성 할 수있는 방법을 알 수 있습니까?

이 작업을 수행하기 위해 현재 작업하고있는 코드입니다. 

<html> 
<head> 
    <title>AAA</title> 
    <script language="JavaScript"> 
     function doPage(targetObjectPane) { 
      var objTag = document.getElementById(targetObjectPane); 
      if (objTag != null) { 
       objTag.setAttribute('data', 'http://www.toronto.ca/'); 
       alert('Page should have been changed'); 
      } 
     } 
    </script> 
</head> 
<body> 
<div style="width:100%;height:100%;"> 
    <div style="float:left;width:65%;height:100%;"> 
     <object name="frameone" id="frameone" data="http://www.tsn.ca/" standby="loading data" title="loading" width="100%" height="100%" type="text/html"> 
      Alternative Content 
     </object> 
    </div> 
    <div style="float:right;width:35%;height:100%;"> 
     <object name="frametwo" id="frametwo" data="http://www.cbc.ca/" standby="loading data" title="loading" width="100%" height="50%" type="text/html"> 
      Alternative Content 
     </object> 
     <object name="framethree" id="framethree" data="test.html" standby="loading data" title="loading" width="100%" height="50%" type="text/html"> 
      Alternative Content 
     </object> 
    </div> 
</div> 
</body> 
</html>

그리고 객체 frameThree 내

, 간단히 말해서 

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
    <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> 
    <title>Insert title here</title> 
</head> 
<body> 
<a href="#" onclick="doPage(frametwo);">Test</a> 
</body> 
</html>

는, 오브젝트의 컨텐츠를 조작 할 수있는 자바 스크립트 시도가 내가되는 별도의 사이트를 가정으로 정의되지 않은 오류에 달려있다, 그들 중 누구도 서로를 볼 수 있습니다 같은 브라우저 윈도우의 아이로서. doPage의 현재 실행은 함수가 정의되지 않았 음을 보여줍니다. 이 함수 코드가 test.html로 이동되면 참조 된 객체 이름 frameTwo가 발견되지 않습니다.

출처

2013-10-21 canadiancreed

+1

_ "원래 I가 iframe이 작동 것이라고 생각을 그러나 사용 된 소프트웨어는 그 기능을 어떻게 든 무력화합니다. "_"여기에 사용 된 "소프트웨어"는 무엇입니까? 당신이하려고하는 것에 대한 귀하의 초기 설명을 위해서 나는 iframe을 가지고 갔을 것입니다. – nnnnnn

답변

1

브라우저에서 same-origin protections으로 인해 다른 도메인에서 콘텐츠를 조작 할 수 없습니다. 따라서 하나의 도메인에서 다른 사이트의 도메인이 다른 경우 다른 사이트의 콘텐츠 (프레임 또는 iframe)에 도달 할 수 없습니다.

코드를 보면, 당신은 아마이 원하는 생각 :

<a href="#" onclick="doPage(frametwo);">Test</a>

이가 될 :

<a href="#" onclick="doPage('frametwo');">Test</a>

"frametwo" 때문에 요구를 문자열로 doPage('frameTwo')에 전달 될 수 있습니다.

코드를 시도 할 때 <object>은 데이터 속성이 변경되었을 때 표시되는 HTML을 변경하지 않는다는 것을 알게되었습니다. 그게 의도적인지 아닌지 나는 모른다. 새 데이터 참조하여 새로운 <object>를 작성하고 이전을 대체하기 위해 삽입한다면, 그것은 다음과 같이 작동합니까 :

function doPage2(targetObjectPane) { 
    var objTag = document.getElementById(targetObjectPane); 
    if (objTag) { 
     // create new object tag with new data reference 
     var newObj = document.createElement("object"); 
     newObj.width = "100%"; 
     newObj.height = "50%"; 
     newObj.data = "http://www.toronto.ca/"; 
     newObj.type = "text/html"; 
     newObj.id = "frametwo"; 
     newObj.name = "frametwo"; 
     // insert new object tag 
     objTag.parentNode.insertBefore(newObj, objTag);   
     // remove old object tag 
     objTag.parentNode.removeChild(objTag); 
    } 
}

근무 데모 : http://jsfiddle.net/jfriend00/K7r32/이

출처

2013-10-21 19:35:51 jfriend00

+0

"코드를 시험해 보면 이 데이터 속성이 변경되었을 때 표시되는 HTML을 변경하지 않는다는 것을 알았습니다. 의도적으로 설계된 것인지 아닌지는 잘 모르겠습니다."예. 한 객체의 한 링크를 클릭하면 다른 객체의 HTML 내용이 변경됩니다. 그것이 들리는 것에서 그것은 할 수없는 것이됩니다. – canadiancreed

+1

@canadiancreed - 브라우저의 동작을 기반으로 올바른 것으로 보입니다. 이 함수를 사용하여 object 태그를 새 데이터 속성이있는 동일한 태그로 바꿉니다. – jfriend00

관련 문제

 관련 문제