如何直接用HTML代码在javascript中初始化变量

如何使用直接HTML代码在JavaScript中初始化变量

我试图在变量中添加一个

animate

标记，这样每当发生

mouseover

事件时，我就可以将其附加到svg中。我正在使用snap.svg

var g = HTML CODE
var s = Snap("#svg");
s.mouseover(function(){
    s.append(g);
});

---

差不多吧。我知道这个语法是错误的。我不想在html代码中编写此标记，但将其隐藏，然后将其追加

可能是最简单的方法：

var someHTML = '<div>Heeeyy</div>',
    someElem = document.getElementById('someElement'); 

someElem.onmouseover = function(){
    someElem.insertAdjacentHTML('beforeend', someHTML );
    someElem.onmouseover = null; // Remove this if you want it to happen on every mouseover event
}

var someHTML='Heeeyy'，
someElem=document.getElementById（'someElement'）；
someElem.onmouseover=函数（）{
insertAdjacentHTML（'beforeend'，someHTML）；
someElem.onmouseover=null；//如果希望在每次鼠标悬停事件中都发生此情况，请将其删除
}

---

或者，您可以使用

document.createElement（'DIV'）

创建新元素，并将

innerHTML

设置为所需的html。然后在父元素（所需元素）上使用

appendChild

附加创建的元素。

animateTransform在某些浏览器（如IE）上没有很好的支持，因此如果可以使用Snap之类的方法，我倾向于不使用该方法。如果是的话，我会做类似于以下的事情

s = Snap(400, 620);
var c = s.circle(10,10,10);
var myMarkup = '<g><rect x="20" y="20" width="100" height="100"></g>'
c.mouseover( function() {
  s.append( Snap.parse( myMarkup ) )
  s.select('g').animate({ transform: 't50,50' }, 3000)
})

s=Snap（400620）；
var c=s圆（10,10,10）；
var myMarkup=''
c、 鼠标悬停（函数（）{
s、 追加（Snap.parse（myMarkup））
s、 选择（'g'）。设置动画（{transform:'t50,50'}，3000）
})

（悬停在圆圈上方）

---

如果您只是在做标记来添加animateTransform元素，那么您也可以跳过解析/追加内容，因为这不是必需的。

不要对帖子中的每个关键字使用

[tag:xxx]

，实际上，我使用的是SVG，我不能附加DIV，而是尝试将其附加到SVG中，然后不创建DIV，而是创建一个动画元素，然后再附加它。创建后，您可以使用类似于

elem.setAttribute（“repeatCount”，“Undefinite”）

的方法向其添加属性。我已经设置了属性，并将其附加到svg中所需的组中，它工作得很好，但仍然是animateTransform（完全不工作）直到我打开开发人员窗口。在控制台中选择它，单击“编辑为html”，不执行任何操作，然后按enter键，它才开始。animateTransform对所有浏览器都没有那么好的支持。当你在问题上加上这个标签时，我将添加一个快照选项。