Question

我正在尝试在svg图像中插入当前时间戳：

<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 17.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
     width="618px" height="100px" viewBox="0 0 618 100" style="enable-background:new 0 0 618 100;" xml:space="preserve">
<style type="text/css">
    .st0{fill:none;}
    .st1{font-family:'Arial-BoldMT';}
    .st2{font-size:36;}
</style>
<rect x="3" y="30" class="st0" width="611" height="100"/>
<text transform="matrix(1 0 0 1 263.4561 55.7754)" class="st1 st2">
</text>
<script type="text/javascript"><![CDATA[
    var text = document.getElementByTagName('text');
    var time = new Date();
    var textnode = document.createTextNode(time);
    text.appendChild(textnode);
]]></script>
</svg>

https://jsfiddle.net/km87r2ug/

任何想法为什么这都不起作用？

Answer 1

没有document.getElementByTagName方法。请尝试使用document.querySelector。

Answer 2

如果你在浏览器的错误控制台中查看，你会发现getElementByTagName不存在。你想要的函数是getElement s ByTagName，它返回多个元素，所以我拿了第一个......

<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 17.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
     width="618px" height="100px" viewBox="0 0 618 100" style="enable-background:new 0 0 618 100;" xml:space="preserve">
<style type="text/css">
    .st0{fill:none;}
    .st1{font-family:'Arial-BoldMT';}
    .st2{font-size:36;}
</style>
<rect x="3" y="30" class="st0" width="611" height="100"/>
<text transform="matrix(1 0 0 1 263.4561 55.7754)" class="st1 st2">
</text>
<script type="text/javascript"><![CDATA[
    var text = document.getElementsByTagName('text')[0];
    var time = new Date();
    var textnode = document.createTextNode(time);
    text.appendChild(textnode);
]]></script>
</svg>

在svg中插入当前时间戳

2 个答案: