如何在元素出现时触发javascript函数

嗨

我需要在代码中出现一个具有给定类的元素时执行一次javascript函数（该元素将由另一个脚本生成）

这是我的职责：

play(sound);

该元素将出现在以下内容中：

<div id="canvas">

元素将如下所示：

<span class="sound">sound name</span>

声音名称

其中“声音名称”将确定play（）的参数

如何使用javascript实现这一点

---

谢谢。

您可能可以尝试

您需要一个侦听器来检测DOM更改

---

您可以使用，您可以使用，如下所示

.observe（）

，

MutationObserverInit

的第二个参数很重要：

在选项中，如果

span

仅作为直接子项添加，请使用

childList:true

<代码>子树：如果它可以位于

#canvas

下面的任何级别，则为true

从：

• childList

  ：如果要观察目标节点的子元素（包括文本节点）的添加和删除，则设置为

  true

• 子树

  ：如果要观察到目标和目标后代的突变，则设置为

  真

$（“#go”）。单击（函数（）{
$（“#canvas”）.append（$（'sound name'））；
});
函数play（n）{alert（'playing'+n）；}
var obs=新的突变观察者（功能（突变，观察者）{
$。每个（突变，功能（i，突变）{
var addedNodes=$（突变.addedNodes）；
var selector=“span.sound”
var spanSounds=addedNodes.find（selector）.addBack（selector）；//查找单独添加的或作为树添加的
spanSounds.each（函数（）{//处理任意数量的添加跨距
播放（$（this.text（））；
});
});
});
obs.observe（$（“#canvas”）[0]，{childList:true，subtree:true}）

将span添加到画布
（元素将由另一个脚本生成）
-让另一个脚本运行
播放（声音）
有趣的是，此代码放在文件末尾还是div之后？不确定我是否正确理解您的问题。这是js代码，通常放在HTML结尾的外部文件中，就像这样：好吧，只是大多数时候它的内部代码在代码段上都很好，但是由于某些原因，我无法让它在我的实际代码中工作，并且我在控制台上没有收到任何错误，所以我无法调试它。我怎么知道出了什么问题？将参数传递给
obs.observe（）
？哼哼。。您是否尝试过添加一些
console.log（）
s？如果您愿意，您可以将重要部分粘贴到JSFIDLE中，并将链接粘贴到这里，这样我就可以看一看了。这将更容易看到实际的网站。我应该在你的代码中包含console.log（），这样我就可以看到有什么问题了吗？我不明白。我甚至把代码放在一个外部文件中，然后从那里加载，但没有结果。我也没有得到任何错误，所以我不知道如何解决这个问题。
// Select the node that will be observed for mutations
var targetNode = document.getElementById('some-id');

// Options for the observer (which mutations to observe)
var config = { attributes: true, childList: true };

// Callback function to execute when mutations are observed
var callback = function(mutationsList) {
    for(var mutation of mutationsList) {
        if (mutation.type == 'childList') {
            console.log('A child node has been added or removed.');
        }
        else if (mutation.type == 'attributes') {
            console.log('The ' + mutation.attributeName + ' attribute was modified.');
        }
    }
};

// Create an observer instance linked to the callback function
var observer = new MutationObserver(callback);

// Start observing the target node for configured mutations
observer.observe(targetNode, config);

// Later, you can stop observing
observer.disconnect();