document.createElementNS method not working on IE9

Question

I want to create svg using javascript in IE9, so I used document.craeteElementNS method. It works fine in other browser but not IE9. Can I know Why? Here is a documentation that state the method should work with IE9, http://msdn.microsoft.com/en-us/library/ie/ff975213%28v=vs.85%29.aspx But when I tried it out, it doesn't, may I know why?
Result: It doesn't shows the polygon on the page that it should be, it just convey a blank page

 <html>
    <head>
    <script src="http://code.jquery.com/jquery-1.10.2.js"></script>
    <script>
    $(window).load(function(){
       var myDiv = document.getElementById("myDiv");
       var mySVG = document.createElementNS("http://www.w3.org/2000/svg", "svg");
       mySVG.setAttribute("height","210");
       mySVG.setAttribute("width","500")
       myDiv.appendChild(mySVG);
       var myPolygon = document.createElementNS("http://www.w3.org/2000/svg", "polygon");   
       myPolygon.setAttribute("style","fill:lime;stroke:purple;stroke-width:1");
       myPolygon.setAttribute("points","200,10 250,190 160,210");
       mySVG.appendChild(myPolygon);
        });         
    </script>
    </head>
    <body>
    <div id="myDiv">

    </div>

    </body>
    </html>

What exactly "doesn't work"? Do you get an error? What's the problem? "It doesn't work" is the worst error description, because it doesn't convey any information at all. That your code doesn't work is already implied by you posting here. — Felix Kling, Sep 19 '14 at 17:30
It doesn't shows the polygon, there is nothing on the page. Sorry for lack of info — dramasea, Sep 19 '14 at 17:33
The console show object doesn't support createElementNs, but in microsoft documentation is shows it should work on ie9 or later. Sorry for my bad english — dramasea, Sep 19 '14 at 17:37
So you actually get an error saying something like "undefined is not a function"? — Felix Kling, Sep 19 '14 at 17:39
SCRIPT438: Object doesn't support property or method 'createElementNS' — dramasea, Sep 19 '14 at 17:40
I'm not very familiar with IE. Maybe the page is running in a compatibility mode with an older version. — Felix Kling, Sep 19 '14 at 17:43
Thanks bro!! it did work, but actually i'm creating a wordpress plugin, is there any way to change add meta through DOM? — dramasea, Sep 19 '14 at 17:52

score -3 · Answer 1 · answered Sep 19 '14 at 18:11

$(document).ready(function(){
    var myDiv = document.getElementById("myDiv");
       var mySVG = document.createElementNS("http://www.w3.org/2000/svg", "svg");
       mySVG.setAttribute("height","210");
       mySVG.setAttribute("width","500");
       myDiv.appendChild(mySVG);
    var obj = document.createElementNS("http://www.w3.org/2000/svg", "polygon");
    //obj.setAttributeNS(null, "cx", 100);
    //obj.setAttributeNS(null, "cy", 50);
    //obj.setAttributeNS(null, "r",  40);
    obj.setAttributeNS(null, "stroke", "purple");
    obj.setAttributeNS(null, "stroke-width", 1);
    obj.setAttributeNS(null, "fill", "lime");
    obj.setAttributeNS(null, "points", "200,10 250,190 160,210");
    mySVG.appendChild(obj);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
<div id="myDiv"></div>

Why are you playing the "spot the difference" game instead of providing some helpful explanation? What's up with the code you posted? How does it solve the OP's problem? — Felix Kling, Sep 19 '14 at 22:52

document.createElementNS method not working on IE9

1 Answers1