jquery - how to get text of a div inside a iframe

Question

This jsp is inside the iframe which is generated dynamically ,

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>

<!-- <!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=UTF-8">
<link rel="stylesheet" type="text/css" href="<%=request.getContextPath() %>/css/chat.css">
<title>Heart JSP page</title>
</head>
<body>

    <div id="messageArea" class="divBorder">
    <% String intxnId = request.getParameter("intxnId");  %>
     Chat Interaction id is : ?<%= intxnId%> 

    </div>
    <div id="enterMessage" class="divBorder">
    Your message Area
    </div>
</body>
</html>

My iframe and its id is generated dynamically.Inside the Iframe I inserted the above jsp page .

Now I need to get the text value of the div with id=messageArea in the jsp using jquery.

I used ,

    var  intxnId = `ch54p3443`;

var sss = $("#ch"+intxnId).contents().find("#messageArea").text();
alert("sss : "+sss);

$("#ch"+intxnId) will be my iframe selector.

But no value is assigned to the variable sss.

is this iframe on the same domain? does your javascript console throw a warning? — Alex, Jun 25 '13 at 12:37
http://stackoverflow.com/questions/4326152/how-to-get-text-from-a-div-in-an-iframe-with-jquery — Sergio, Jun 25 '13 at 12:40
and it is not cross-domain either? (I mean the content in the iframe is from the same domain as the main page) — Balint Bako, Jun 25 '13 at 13:28
What do you mean? Cross-domain iframe access is not working that easily, check here http://stackoverflow.com/questions/3083112/jquery-cross-domain-iframe-scripting — Balint Bako, Jun 25 '13 at 14:35

score 1 · Answer 1 · answered Jun 25 '13 at 12:50

1

You need to reference the DOM object of the page inside your iframe first. And your iframe page must be from the same domain of the parent page due to the cross domain restriction.

I've set up a fiddle to show how to access the elements of a iframe page:

http://jsfiddle.net/ts5Z7/

Basically with your code, that means something like:

var  intxnId = `ch54p3443`;
var frameRef = $("#ch"+intxnId)[0];
var frameDocument = frameRef.contentWindow ? frameRef.contentWindow.document :frameRef.contentDocument;

var sss = $(frameDocument).find("#messageArea").text();
alert("sss : "+sss);

answered Jun 25 '13 at 12:50

David Lin

13,168
5
46
46

Thanks for your reply . But Not helped ! – Human Being Jun 25 '13 at 13:24
Is there anything else you need ? why not helping. I would like to help. – David Lin Jun 26 '13 at 01:00

jquery - how to get text of a div inside a iframe

1 Answers1