在chrome中取svg里面的元素的宽度和高度

环境:win7 64位,chrome47.0.2526.106 m,firefox43.0.2,ie11,jquery

html文件：

<div id="divgroup1" title="groupItem">
	<object type="image/svg+xml" class="graphic5" data="Media/docRoot.xml_graphItem2svg0.svg" id="graphicsItem-10"/>
	<div class="InAdiv6" id="timeLineSlideItem-7">
	</div>
</div>

docRoot.xml_graphItem2svg0.svg：

<?xml-stylesheet href="..\CSS\book_textstyle1.css" type="text/css"?>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="1281.5" height="741.951" viewBox="-0.750147 -0.75001 1281.5 741.951" version="1.1"><defs><clipPath transform="matrix(2.83465,0,0,2.83465,-1280,-459.549)" style="clip-rule:evenodd" id="clippath-1"><path d="M 451.556,162.119L 903.111,162.119L 903.111,423.333L 451.556,423.333L 451.556,162.119 z	"/></clipPath></defs><g><g><g clip-path="url(#clippath-1)"><g><path d="M 903.111,423.333L 903.111,162.119L 451.556,162.119L 451.556,423.333L 903.111,423.333 z" transform="matrix(2.83465,0,0,2.83465,-1280,-459.549)" style="stroke:none;fill:RGB(0,0,0);"/></g></g><g><path d="M 451.556,162.119L 903.111,162.119L 903.111,423.333L 451.556,423.333 z" transform="matrix(2.83465,0,0,2.83465,-1280,-459.549)" style="fill:none;stroke-width: 0.529167;stroke:RGB(0,0,0);"/></g></g></g><desc>(-0.750147,-0.75001,451.556,261.215)</desc></svg>

先百度了一下，发现http://bbs.csdn.net/topics/390566300说要用getSVGDocument()

结果调用getSVGDocument()在ff,ie里是好的,chrome返回null

继续搜索，

http://stackoverflow.com/questions/16626938/getsvgdocument-is-returning-null-in-chrome

http://stackoverflow.com/questions/337293/how-to-check-if-an-embedded-svg-document-is-loaded-in-an-html-page这里说要添load监听，至此解决

解决：使用javascript获取该svg宽度:

var childItem = content.children().eq(i);
var left;
var top;
var width;
var height;
if (childItem[0].nodeName === "object") {
    //兼容chrome:必须等svg加载完才能获取width
    childItem[0].addEventListener('load', function () {
        setCloseimgPos(childItem);
    });
}

function setCloseimgPos(childItemRef) {
    left = childItemRef[0].offsetLeft;
    top = childItemRef[0].offsetTop;
    width = childItemRef.width();
    height = childItemRef.height();
}
setCloseimgPos(childItem);

参考：http://bbs.csdn.net/topics/390566300

https://msdn.microsoft.com/library/hh772865%28v=vs.85%29.aspx

http://stackoverflow.com/questions/337293/how-to-check-if-an-embedded-svg-document-is-loaded-in-an-html-page