你好，
只要代码中出现具有给定类的元素（该元素将由另一个脚本生成），我就需要执行一次 javascript 函数。
这是我的功能：
play(sound);
元素会出现在这个里面：
<div id="canvas">
该元素将如下所示：
<span class="sound">sound name</span>
其中“声音名称”将确定 play() 的参数；
这怎么能用javascript来完成？
谢谢你。
您可以使用您可以使用MutationObserver，如下所示。
到第二个参数.observe()，MutationObserverInit是很重要的：
在选项中，使用childList: trueifspan将仅作为直接子项添加。subTree: true如果它可以在任何级别以下#canvas。
从文档：
childList: 设置为true是否要观察目标节点的子元素（包括文本节点）的添加和删除。subtree:true如果要观察到目标和目标的后代的突变，则设置为。$("#go").click(function () {
$("#canvas").append($('<span class="sound">sound name</span>'));
});
function play(n) { alert('playing '+ n); }
var obs = new MutationObserver(function(mutations, observer) {
$.each(mutations, function (i, mutation) {
var addedNodes = $(mutation.addedNodes);
var selector = "span.sound"
var spanSounds = addedNodes.find(selector).addBack(selector); // finds either added alone or as tree
spanSounds.each(function () { // handles any number of added spans
play($(this).text());
});
});
});
obs.observe($("#canvas")[0], {childList: true, subtree: true});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="canvas"></div>
<button id="go">Add span to canvas</button>代码不太紧凑，但绝对可行：
document.getElementById("go").addEventListener('click', function () {
var s = document.createElement('span');
s.innerText = 'sound name';
s.classList.add('sound')
document.getElementById('canvas').appendChild(s);
});
function play(n) { alert('playing '+ n); }
var obs = new MutationObserver(function(mutations, observer) {
for(var i=0; i<mutations.length; ++i) {
for(var j=0; j<mutations[i].addedNodes.length; ++j) {
var addedNode = mutations[i].addedNodes[j];
//NOTE: if the element was added as child of another element, you would have to traverse
// the addedNode to find it. I recommend the jQuery solution above if that's the case
if(addedNode.tagName == "SPAN" && addedNode.classList.contains("sound")) {
play(addedNode.innerText);
}
}
}
});
obs.observe(document.getElementById('canvas'), {childList: true, subtree: true});<div id="canvas"></div>
<button id="go">Add span to canvas</button>本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句