Question

我想监控网站字词的变化。当屏幕上出现一个给定的单词时，我正在寻找自动播放的声音。

这个词可能嵌入在一个新的div ID中，因此我不会监视特定的DOM对象更改，而是最终会出现在屏幕上的字符串/新词。

简而言之，我正在寻找一个每次在屏幕上显示“客户”一词时播放声音的JS。到目前为止，我已尝试过此代码（从其他人复制粘贴），每次页面重新加载时都会播放声音，但屏幕上出现“客户”字样时则不会播放声音。

这是代码：

var player = document.createElement('audio');
player.src = 'https://dl.dropbox.com/u/7079101/coin.mp3';
player.preload = 'auto';

for (var i = 0; i <= 10; i++) {
  if (i === 10) {
    // Play a sound when i === 10
    player.play();
  } else {
    console.log('Not yet!');
  }
}

当然这只是一段代码，可以检查一些非常不同的东西，但是在摆弄它时，我发现每次修改公式时它都会停止播放重新加载的声音。

Answer 1

让我先说一下需要更多的信息（参见上面的评论），你应该努力先把一些代码存根放在一起，实际上/尝试做你想要实现的目标。 StackOverflow不是某种代码请求论坛，你可以请别人为你写一些东西。

既然你是新来的，我会尝试让你开始提出一些想法：

我仍然不清楚您是否正在尝试浏览“您自己的”页面（即在您自己的服务器上）或其他人的页面（在另一台服务器上）。

扫描您的javascript代码所在的同一页面（在您的服务器上）

如果您正在扫描自己的某个页面，甚至可以在该页面上运行javascript，那么您的解决方案将非常简单（来源：Javascript: how to check if a text exists in a web page）。我个人更喜欢在这个问题中发布的jQuery解决方案：

var player = document.createElement('audio');
player.src = 'https://dl.dropbox.com/u/7079101/coin.mp3';
player.preload = 'auto';

window.setInterval(function(){
  if($("*:contains('Customer')").length > 0){
    console.log('Customer detected, playing sound...');
    player.play();
  }
}, 5000);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Customer!

当然还有一个问题是，你可能只想为“客户”这个词的每次新出现播放一次声音。这将需要更高级的编程（你必须跟踪你已经播放了哪些单词的声音），这有点超出了这个问题的范围。

扫描其他页面（在您的服务器上或外部页面*）

如果您正在加载不同的HTML页面（或其他文本类型的页面，并不重要），您也可以在StackOverflow上找到您的解决方案（来源：How to check if string exists on external page with JavsScript?）。简而言之，您将执行AJAX请求以获取页面，然后检查“客户”一词。 *但是，同源策略会阻止您纯粹通过javascript加载大多数外部页面（阅读更多：Loading cross domain endpoint with jQuery AJAX），因此您需要某种跨源插件（在本主题中阅读更多内容）。

var player = document.createElement('audio');
player.src = 'https://dl.dropbox.com/u/7079101/coin.mp3';
player.preload = 'auto';

var url= 'http://www.businessdictionary.com/definition/customer.html';

window.setInterval(function(){
  $.get(url, function(data) {
    if(data.indexOf('whatever') != -1) {
      console.log('Customer detected, playing sound...');
      player.play();
    }
  }, 'text');
}, 5000);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

祝你的项目好运，欢迎来到StackOverflow。如果需要，或者当您提供更多信息时，我会更新我的答案。

当屏幕上出现一些文字时，在JS中播放声音

1 个答案: