Cannot read property 'contentDocument' of null

Question

I have an SVG map that is niserted into HTML with help of the 'object' tag. Then, I try to use jQuery to access map's elements. (In particular I try to fill a rectangular in red.)

HTML:

<object data="map.svg" type="image/svg+xml" id="map" width="1840" height="940"></object>

jQuery:

jQuery(window).load(function () {
        var svgobject = document.getElementById('map');
        if ('contentDocument' in svgobject) {
            var svgdom = jQuery(svgobject.contentDocument);
            jQuery("#rect4578", svgdom).attr("fill", "red");
        }
    });

In chrome I get an error: Cannot read property 'contentDocument' of null (anonymous function) n.event.duspatch n.event.add.r.handle

What is the problem?

Thank you.

score 2 · Accepted Answer · answered Feb 05 '15 at 07:19

2

Are you getting this error only in chrome? Debug the code and look at this line in your code

var svgobject = document.getElementById('map')

What do you get in return here? Is the svgobject null? Because your id is not "map" its "imap"

answered Feb 05 '15 at 07:19

Pumpkin

126
3

Yes it was 'imap' i was not so attentive. However, now I got the following message: **Uncaught Security error: Failed to read the 'contentDocumant' property from 'HTMLObjectElement': Blocked a frame with origin "null" from accessing a frame with origin 'null'. Protocols, domains, and ports must match**. – plywoods Feb 05 '15 at 07:27
I found some discussion in this regards over here (in comments) - http://benfrain.com/selecting-svg-inside-tags-with-javascript/. However, my html and svg aer stored locally on my PC. And it is not quite clear what I need to do to make it work. – plywoods Feb 05 '15 at 07:35
1

Try to search here on stackoverflow about your new problem or maybe these links will help you [link](http://stackoverflow.com/questions/25098021/securityerror-blocked-a-frame-with-origin-from-accessing-a-cross-origin-frame) [link](http://stackoverflow.com/questions/17950598/using-iframe-with-local-files-in-chrome) – Pumpkin Feb 05 '15 at 07:36
I am not sure about this issue. You should try to search first and if don't find any solution then you create a new question. Good luck! – Pumpkin Feb 05 '15 at 07:43

score 0 · Answer 2 · edited Feb 05 '15 at 09:08

0

The id is imap not map for getElement....

edited Feb 05 '15 at 09:08

Dalija Prasnikar

24,159
30
74
140

answered Feb 05 '15 at 07:27

dec

543
8
18

Cannot read property 'contentDocument' of null

2 Answers2