3 가지 방법으로 getElementById

숨겨진 입력 양식 필드에서 값을 검색해야하는 응용 프로그램이 있습니다. 그러나이 응용 프로그램에는 iFrame에있는 다른 페이지를 호출하는 기본 페이지가 있으며 다른 iFrame에서도 자체 페이지를 호출 할 수 있습니다.3 가지 방법으로 getElementById

default.asp -> screen.asp (iFrame에서) screen.asp -> 내가 기본에서 숨겨진 입력 양식 필드를 참조 할 때

document.getElementById('focusValue').value 
window.frames[0].document.getElementById('focusValue').value 
parent.frames[arrVal].document.getElementById('focusValue').value

(iframe에) screen.asp의 새로운 인스턴스 -> 화면 나는 표준 document.getElementById('focusValue').value;를 사용할 수 있습니다. 다음 1 층 iFrame에있을 때 window.frames[0].document.getElementById('focusValue').value;을 사용해야합니다. 그렇다면 iFrame의 2+ 레벨에있을 때 parent.frames[arrVal].document.getElementById('focusValue').value;을 사용해야합니다.

이제

if(document.getElementById('focusValue') == undefined){ 
     window.frames[0].document.getElementById('focusValue').value = focusValue; 
     console.log('1'); 
}else if((parent.frames.length -1) == arrVal){ 
     console.log('2'); 
     if (arrVal > 0) { 
      parent.frames[arrVal].document.getElementById('focusValue').value = focusValue; 
     } 
}else{ 
    document.getElementById('focusValue').value = focusValue; 
    console.log('3'); 
}

나는 확실히이 작업을 수행 할 수 있지만 코멘트 새로운 가치를 작성하는 외부 내가 다른 프로그래머와 걱정 (또는 나에게 1 : 내가보고 시작 했어

일반적인 구조는 이것이다 이제부터이 코드를보고 내가하고있는 일에 궁금해한다.

제 질문은 제가 표준 형식으로하고자하는 것을 달성하는 방법이 있습니까? 이를 달성하는 더 좋은 방법이 있기를 정말로 바라고 있습니다.

출처

2011-11-14 webdad3

그 이유는 발명 된 이유입니다. 당신이하고있는 것을 문서화하십시오. – Gerben

각 페이지가 원하는 값을 찾는 방법을 호출하는 것이 좋습니다. 기본적으로 조회 인터페이스를 표시합니다. 그런 다음 상위 페이지에서 대상 페이지의 메소드 만 호출하면됩니다. 올바른 이름 지정을 통해 개발자는 진행 상황을 이해하고 방법을 사용하면 논리를 단순화 할 수 있습니다.

또는 상위 페이지에서 값을 가져와야하는 경우 공통 인터페이스를 사용하여 iframe의 각 페이지에 후크를 등록 할 수 있습니다. 각 페이지는 그 훅을 호출하여 값을 얻을 수 있습니다. 이렇게하면 페이지의 레벨을 결정하는 복잡한 논리를 막을 수 있습니다.

iframe1.GetValueHook = this.GetValue; 
iframe2.GetValueHook = this.GetValue;

같은 뭔가 그런 다음 각 페이지는 당신이 페이지를 중첩 한 경우,이 재귀를 만들 수

var x = this.GetValueHook();

를 호출 할 수 있습니다. 모든 페이지 사이에 통신이 필요한 경우 동일한 접근 방식을 사용하지만 등록 프로세스를 사용하십시오. 각 페이지는 부모와 함께 자신과 자식을 등록합니다. 하지만 이렇게해야한다면 아키텍처를 재평가해야합니다.

예 : register.js

var __FRAMENAME = "Frame1"; 
var __FIELDID = "fieldId"; 
var __frames = []; 

function RegisterFrame(frame) { 
    __frames.push(frame); 

    for (var i = 0; i < frame.children.length; i++) { 
     __frames.push(frame.children[i]); 
    } 

    RegisterWithParent(); 
} 

function RegisterWithParent() { 

    var reg = { 
     name: __FRAMENAME, 
     getvalue: GetFieldValue, 
     children: __frames 
    }; 

    if(parent != undefined && parent != this) { 
     parent.RegisterFrame(reg); 
    } 
} 

function SetupFrame(name, fieldId) { 
    __FRAMENAME = name; 
    __FIELDID = fieldId; 

    RegisterWithParent(); 
} 

function GetFieldValue() { 
    return document.getElementById(__FIELDID).value; 
} 

function GetValueFrom(name) { 
    for (var i = 0; i < __frames.length; i++) { 
     if (__frames[i].name == name) { 
      return __frames[i].getvalue(); 
     } 
    } 

}

index.html을

<html> 
<head> 
<script language="javascript" type="text/javascript" src="register.js"></script> 
</head> 
<body> 

PAGE 

<input type="hidden" id="hid123" value="123" /> 
<iframe id="frame1" src="frame1.html"></iframe> 
<iframe id="frame2" src="frame2.html"></iframe> 
<script type="text/javascript"> 
    SetupFrame("Index", "hid123"); 

    setTimeout(function() { //Only here for demonstration. Make sure the pages are registred 
     alert(GetValueFrom("frame3")); 
    }, 2000); 
</script> 
</body></html>

프레임 1.HTML

<html> 
<head> 
<script language="javascript" type="text/javascript" src="register.js"></script> 
</head> 
<body> 
<input type="hidden" id="hid" value="eterert" /> 
<script type="text/javascript"> 
    SetupFrame("frame1", "hid"); 
</script> 
</body></html>

frame2.html

<html> 
<head> 
<script language="javascript" type="text/javascript" src="register.js"></script> 
</head> 
<body> 
<input type="hidden" id="hid456" value="sdfsdf" /> 
<iframe id="frame2" src="frame3.html"></iframe> 
<script type="text/javascript"> 
    SetupFrame("frame2", "hid456"); 
</script> 
</body></html>

frame3.html

<html> 
<head> 
<script language="javascript" type="text/javascript" src="register.js"></script> 
</head> 
<body> 
<input type="hidden" id="hid999" value="bnmbnmbnm" /> 
<script type="text/javascript"> 
    SetupFrame("frame3", "hid999"); 
</script> 
</body></html>

당신이 사전/해시 tbale를 사용하도록을 변경할 수 있습니다 경우에 더 좋을 것이다 루프 대신에.

출처

2011-11-14 18:54:34 ILovePaperTowels

GetValueHook 속성을 사용한 적이 한번도 없었습니다. 그것을 설명하는 링크가 있습니까? iFrame이 재귀 적 (동일한 페이지이지만 다른 요소 ID가 주어짐) 인 경우에도이 기능이 작동합니까? – webdad3

이것은 속성이 아니며 스크립트에 의해 선언 된 전역 함수 포인터입니다. 데모를 작성하고 게시 할 것입니다. – ILovePaperTowels

@jeff 코드 샘플을 포함하도록 답변을 업데이트했습니다. – ILovePaperTowels

주어진 요소에 대한 프레임을 실제로 검색해야하는 경우 해당 요소를 사 용하여 모든 기능을 사용하여 모든 기능을 사용해야합니다. 함수에 많은 이유를 설명하고 함수를 의미있는 이름으로 지정하면 미래의 프로그래머가 코드를보고있는 곳이나 현재보고있는 곳을보다 분명하게 알 수 있습니다. 하기.

function setValueByIdFrames(name) { 
    if(document.getElementById(name) == undefined){ 
     window.frames[0].document.getElementById(name).value = name; 
     console.log('1'); 
    } else if((parent.frames.length -1) == arrVal){ 
     console.log('2'); 
     if (arrVal > 0) { 
      parent.frames[arrVal].document.getElementById(name).value = name; 
     } 
    } else { 
     document.getElementById(name).value = name; 
     console.log('3'); 
    } 
}

출처

2011-11-14 18:51:19 jfriend00

나는 여전히 복잡하고 부서지기 쉬운 논리가 필요하다는 점을 제외하고는 동의 할 것이다. – ILovePaperTowels

@ILovePaperTowels - 원하는 객체의 위치를 (프레임들 사이에서) 미리 알 수없는 경우 복잡하고 부서지기 쉬운 응용 프로그램의 디자인이며 이것이 최선의 방법입니다. 분명히, 주어진 객체를 찾기 위해 여러 프레임을 검색 할 필요가 없도록 응용 프로그램의 설계를 수정하는 것이 훨씬 더 낫습니다. – jfriend00

@ jfriend00 - 이것이 아마도 합법적으로 문제를 해결할 수있는 올바른 해결책이라는 데 동의하지만,이 코드는 몇 년 전 거대한 .js 파일 안에 묻혀 있습니다. 당신이 제안한 것을하는 것은 필자의 의견으로는 다른 문제로 이어질 가능성이있는 코드의 중복이 필요할 것입니다 (즉, 뭔가를 바꾸는 것이 한 곳이고 다른 곳에서는하지 않는 것입니다). 나는 확실히 아키텍처에 대한 귀하의 요점을 볼 수 있습니다. – webdad3

가장 좋은 방법은 올바르게 문서화되도록 varables를 올바르게 설정하는 것입니다. 이게 뭔가 ...

var screenFrame = window.frames[0]; 
var screenFrame2 = parent.frames[arrVal]; 

var value = screenFrame2.document.getElementById('focusValue').value

이렇게하면 쉽게 읽을 수 있습니다.

출처

2011-11-14 18:56:00 JTWebMan

나는 그걸로 어디로 가는지 알지만, 불행하게도 최대 7 개의 층이있을 수 있습니다! 나도 알아, 못 생겼어.하지만 그게 내가 다루고있는거야. – webdad3

@JeffV 한 페이지에 모든 것을 남겨 두는 것이 더 좋으며 필요한 프레임을 다시 제공하는 함수를 만들 수 있습니다. 7 개의 중첩 된 iframe은 많은 부분을 차지하고 재 설계해야합니다. – JTWebMan

3 가지 방법으로 getElementById

답변

관련 문제