jQuery는 iframe 요소를 가져옵니다-JS 튜토리얼-php.cn

jQuery는 iframe 요소를 가져옵니다

php中世界最好的语言

풀어 주다： 2018-04-26 10:33:28

원래의

5612명이 탐색했습니다.

이번에는 iframe 요소를 가져오는 jQuery를 가져왔습니다. jQuery에서 iframe 요소를 가져오는 데 필요한 주의사항은 무엇인가요?

jquery를 사용하여 iframe에서 요소를 가져오는 여러 가지 방법:

iframe 하위 페이지에서 상위 페이지 요소 가져오기

코드는 다음과 같습니다.

$(&#39;#objId&#39;, parent.
document
);

로그인 후 복사

완료...

iframe 하위 페이지 요소 가져오기 상위 페이지:

$("#objid",document.frames(&#39;iframename&#39;).document)
$(document.getElementById(&#39;iframeId&#39;).contentWindow.document.body).html()

로그인 후 복사

iframe에 body 요소의 콘텐츠를 표시합니다.

$("#testId", document.frames("iframename").document).html();

로그인 후 복사

iframename을 기준으로 ID가 "testId"인 요소를 가져옵니다.

$(window.frames["iframeName"].document).find("#testId").html()

로그인 후 복사

JS 또는 jQuery를 사용하여 IE/FF와 호환되는 페이지의 iframe에 액세스합니다.

참고: 프레임의 페이지는 도메인을 넘을 수 없습니다!

동일한 도메인 아래에 두 개의 페이지가 있다고 가정합니다.

index.html 파일에 iframe:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>页面首页</title>
</head>
<body>
<iframe src="iframe.html" id="koyoz" height="0" width="0"></iframe>
</body>
</html>

로그인 후 복사

iframe.html 콘텐츠:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>iframe.html</title>
</head>
<body>
<p id="test">www.jb51.net</p>
</body>
</html>

로그인 후 복사

1이 포함되어 있습니다. 직접 액세스하려면 index.html에서 JS를 실행하세요.

document.getElementById(&#39;koyoz&#39;).contentWindow.document.getElementById(&#39;test&#39;).style.color=&#39;red&#39;

로그인 후 복사

index.html을 통해 ID 이름이 'koyoz'인 iframe 페이지에 액세스하고, 이 iframe 페이지에서 ID 이름이 'test'인 개체를 가져와 색상을 빨간색으로 설정합니다.

이 코드는 테스트를 거쳤으며 IE/를 지원할 수 있습니다.

2. jQuery를 사용하여 index.html에 액세스합니다.

$("#koyoz").contents().find("#test").css(&#39;color&#39;,&#39;red&#39;);

로그인 후 복사

이 코드의 효과는 jQuery 프레임워크로 인해 코드가 더 짧아졌습니다. :

iFRAME의 상위 창에 있는 요소 값을 얻기 위해 jQuery를 사용하는 것은 DOM 메서드와 jquery 메서드를 결합해야만 달성할 수 있습니다

1. 상위 창의 IFRAME에 있는 모든 라디오 버튼을 선택하세요

$(window.frames["iframe1"].document).find("input:radio").attr("checked","true");

로그인 후 복사

2. IFRAME에서 작동하여 상위 창의 모든 라디오 버튼을 선택하세요.

$(window.parent.document).find("input:radio").attr("checked","true");

로그인 후 복사

상위 창이 IFrame에 Iframe을 가져오려면 다음과 같이 프레임 하위 항목을 추가하세요.

$(window.frames["iframe1"].frames["iframe2"].document).find("input:radio").attr("checked","true");

로그인 후 복사

마스터하셨을 거라 믿습니다. 방법은 이 기사의 사례를 읽은 후 , 더 흥미로운 내용을 보려면 PHP 중국어 웹사이트의 다른 관련 기사에 주목하세요!

jQuery+Ajax를 사용하여 테이블 데이터 제목 정렬을 구현합니다

위 내용은 jQuery는 iframe 요소를 가져옵니다의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!