javascript - 无法读取 SVG 文件中未定义的属性“nodeName”

Question

该错误通常是由在页面加载结束之前执行的脚本引起的，如下所述：Cannot read property childNodes of null

但我不认为这是我的错误：

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg onload="init(evt)" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1">
    <script xlink:href="jquery-1.10.2.min.js"/>
    <script xlink:href="test.js"/>
    <g id="id">

    </g>
</svg>

和 test.js 文件：

function init () {
    $(document).mousedown(test)
}

function test (evt) {
    $('#id').append('test');
    $('#id').append('<rect x=10 y=10 width=50 height=50/>');
}

奇怪的是，第一个附加有效，而第二个无效。实际上，当<字符串中有一个时会引发错误......那为什么呢？

Answer 1

如果您通过 jQuery$('<tag_name/>')方法实例化元素，它就可以工作。

function test (evt) {
  $('#id').append('test');
  $('#id').append($('<rect/>').attr({'x':10,'y':10,'width':50,'height':50}));
}