首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >仅在index.html页面上运行函数(Javascript)

仅在index.html页面上运行函数(Javascript)
EN

Stack Overflow用户
提问于 2018-07-07 08:41:28
回答 1查看 685关注 0票数 0

我有一个在我的index.html页面上运行随机单词生成器的函数,它工作得很好,但是当你在任何其他页面上时它也会继续运行(因为windows.onload)。

我不知道如何编写javascript来说明“只在index.html上运行这个函数,没有其他页面”或者“只在这个类上运行”。

代码语言:javascript
复制
window.onload = function refreshWord()
  setInterval(function randomWord() {
    const words = ['Engineer', 'Developer', 'Illustrator', 'Cyclist', 'Artist'];
    const randomGenerator = Math.floor(Math.random() * words.length);
    document.getElementById('textswap').innerHTML = words[randomGenerator];
  }, 2000);
代码语言:javascript
复制
        <div class="col">
          <h4>These are the words, a <span class="front-page-text-swap" id="textswap"> person </span>.</h4>
        </div>

我的最终目标是让函数refreshWord()只在index.html页面上执行,而不是在其他页面上执行,但是我不知道如何做到这一点(我想使用普通的js,而不是jQuery)。

EN

回答 1

Stack Overflow用户

发布于 2018-07-07 10:36:21

您可以将仅在index.html中需要的代码从所有页面共享的共享Javascript页面中提取出来,并将其放入<script>标记中,该标记仅位于index.html页面的HTML中,而不在任何其他页面中:

代码语言:javascript
复制
<script>
// insert this script only in the index.html page and 
// directly inserted, not via a separate script file
window.onload = function refreshWord()
  setInterval(function randomWord() {
    const words = ['Engineer', 'Developer', 'Illustrator', 'Cyclist', 'Artist'];
    const randomGenerator = Math.floor(Math.random() * words.length);
    document.getElementById('textswap').innerHTML = words[randomGenerator];
  }, 2000);
</script>

您还可以测试只存在于index.html上的页面元素。因此,如果index.html上只存在textswap元素,那么您可以这样做:

代码语言:javascript
复制
window.onload = function refreshWord()
  var textswap = document.getElementById('textswap');
  // see if the textswap element exists in this page
  if (textswap) {
      setInterval(function randomWord() {
        const words = ['Engineer', 'Developer', 'Illustrator', 'Cyclist', 'Artist'];
        const randomGenerator = Math.floor(Math.random() * words.length);
        textswap.innerHTML = words[randomGenerator];
      }, 2000);
  }

因此,只有当目标页面唯一的某个元素确实存在时,才会调用setInterval()

这种“内容检测”有时比URL测试更安全,因为它跟踪您想要的实际页面,而不是URL (可能会在某个时候更改)。

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/51219064

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档