Monday, 19 August 2013

jQuery. Get CSS property value from URL (Same Origin)

jQuery. Get CSS property value from URL (Same Origin)

I would like to get the background color of an element that resides at an
external page, in the same domain. I have a working solution, but there
must be a better way and I hope that you might point me in the right
direction.
My Solution
I decided to first load the external page into an iframe:
var $page = $('<iframe/>').attr('src', 'http://mydomain.com/page');
Then append the iFrame to the body:
$('#iframe-placeholder').append($page);
And finally I access the CSS property:
$('iframe').load(function(){
var backgroundColor =
$(this).contents().find('#my-element').css('backgroundColor');
});
Downsides of this Approach
It's slow
It's asynchronous
Question
Is there a way to get the CSS property of that external page via Ajax?
I really need the call to be Synchronous and loading the whole page into
an iFrame is just an overkill.
Any suggestions would be very much appreciated...

No comments:

Post a Comment