如何仅在页面加载的 10% 时执行 JavaScript

Posted 2023-02-26

【中文标题】如何仅在页面加载的 10% 时执行 JavaScript

【英文标题】：How to execute JavaScript only 10% of times the page is loaded

【发布时间】：2021-10-03 11:50:22

【问题描述】：

我有一个横幅广告网络，它通过一些 javascript 代码运行。 像这样：

<script src="........."</script>

但是我重复的观点太多了。

所以我想只在页面加载的 10% 的时候显示横幅。

有没有简单的解决方案？我没有 JavaScript 知识。

【参考方案1】：

您可以创建一个随机数并检查它是否小于范围的 10%，例如

if (Math.random() <= 0.1) 
  showAds();

测试

let runs = 0;
let ads = 0;

function showAds() 
  ++ads;


for (let i = 0; i < 1e6; ++i) 
  ++runs;
  if (Math.random() <= 0.1) 
    showAds();
  


console.log(`Runs: $runs`);
console.log(`Ads were shown: $ads`);
console.log(`$ads/runs * 100 %`);

【参考方案2】：

您可以创建一个保存到 localstorage 的计数器（在网络浏览器中，因此即使在您重新加载页面后也会保留它）。

它可以从 0 开始，然后每次重新加载时增加 1，直到达到 9 后重置。

您可以将其设置为仅在计数器为 0 时才运行横幅。

    <script type="text/javascript">
    let counter = localStorage.getItem("counter") ?? 0;
    if (counter == 0) 
        // code placed here will run only on the first of every 10 pageloads
    
    if (counter >= 0) 
        newCount = (counter == 9) ? 0 : ++counter;
        localStorage.setItem("counter", newCount);
    
    </script>