屏幕上出现一些文本时，用JS播放声音 [英] Play a sound in JS when some text appear on the screen

问题描述

我想监视网站的字词更改.当某个给定的单词出现在屏幕上时，我正在寻找一种声音来自动播放.

I want to monitor a website word changes. I am looking for a sound to autoplay when a given word appears on the screen.

该单词可能嵌入在新的div ID中，因此我没有监视特定的DOM对象更改，而是最终出现在屏幕上的字符串/新单词.

This word might come embedded within a new div ID, so I am not monitoring a particular DOM object change, but a string/new-word that appears on the screen eventually.

简而言之，我正在寻找一种JS，它在屏幕上每次出现"Customer"字样时都会发出声音.到目前为止，我已经尝试过此代码(从其他人复制粘贴)，并且每次页面重新加载时它都会播放声音，但是屏幕上出现"Customer"一词时却不会.

In short, I am looking for a JS that plays a sound everytime the word "Customer" appears on the screen. I have tried this code (copy paste from someone else) so far and it plays a sound everytime the page reloads, but not when the word "Customer" appears on the screen.

这是代码:

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!');
  }
}

当然，这只是一段代码，用于检查非常不同的内容，但是在摆弄它时，我发现每次修改公式时，它都会在重新加载制表符时停止播放声音.

Of course this is just a piece of code that checks for something very different, but when fiddling around with it, I find that everytime I modify the formula it stops playing the sound on tab reload.

推荐答案

首先让我说需要提供更多信息(请参见上面的评论)，然后您应该尝试着首先将一些代码存到一起实际上确实/试图做您想要达到的目标. StackOverflow并不是某种形式的代码请求论坛，您可以在其中请求他人为您编写一些东西.

Let me start off by saying more info is required (see my comments above), and you should try and make an effort to first get some stub of code together that actually does/attempts to do what you're trying to achieve. StackOverflow is not some kind of code-requesting forum where you can ask others to write something for you.

由于您是新来的，我将尝试为您提供一些想法:

Since you're new here, I'll try to get you started with some ideas:

我仍然不清楚您是要扫描自己的"页面(即在您自己的服务器上)还是浏览其他人的页面(在另一台服务器上).

It's still unclear to me whether you're trying to scan through a page 'of your own' (i.e. on your own server), or someone else's page (on another server).

扫描与您的JavaScript代码相同的页面(在您的服务器上)

如果您要扫描自己的页面之一，甚至可以在该页面上运行javascript，则解决方案将非常简单(来源:

If you're scanning one of your own pages, and you can even run the javascript on that very page, your solution will be very simple (source: Javascript: how to check if a text exists in a web page ). I personally prefer the jQuery solution posted in this question:

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! 

当然，他仍然有一个问题，就是您可能只想对"customer"一词的每个新出现都播放一次声音.这将需要更高级的编程(您必须跟踪已经为声音播放过的单词)，这超出了此问题的范围.

There is of course still he problem that you'll probably only want to play the sound once for every new occurance of the word 'customer'. This will require more advanced programming (you'll have to keep track of which words you've already played the sound for), which is kind of out of scope for this question.

扫描其他页面(在您的服务器上，还是在外部页面*)

如果要加载其他HTML页面(或其他文本类型的页面，没关系)，您还可以在StackOverflow上找到解决方案(来源:

If you're loading a different HTML page (or other text-type page, doesn't really matter) you can also find your solution on StackOverflow (source: How to check if string exists on external page with JavsScript? ). In short, you'll perform an AJAX request to get the page, and then check for the word 'Customer'. *The same-origin policy will however prevent you from loading most external pages purely through javascript (read more: Loading cross domain endpoint with jQuery AJAX ), so you will need some kind of cross-origin plugin (read more in this topic).

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.如果需要，或者在您提供更多信息时，我将更新我的答案.

Best of luck with your project, and welcome to StackOverflow. I will update my answer if needed, or when you provide more information.

这篇关于屏幕上出现一些文本时，用JS播放声音的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！