Question

我从https://coinmarketcap.com/widget/?c=bitcoin获得了小部件，我不太确定如何每隔几秒钟或几分钟更新一次，因为除非我刷新页面，否则它不会更新。如果有人能提供帮助那就太棒了。

这是代码：

<script type="text/javascript" src="https://files.coinmarketcap.com/static/widget/currency.js"></script><div class="coinmarketcap-currency-widget" data-currency="bitcoin" data-base="USD" data-secondary="" data-ticker="true" data-rank="true" data-marketcap="true" data-volume="true" data-stats="USD" data-statsticker="false"></div>

<script type="text/javascript" src="https://files.coinmarketcap.com/static/widget/currency.js"></script>
<div id="mainContainer" class="coinmarketcap-currency-widget" data-currency="bitcoin" data-base="ZAR" data-secondary="" data-ticker="true" data-rank="true" data-marketcap="true" data-volume="true" data-stats="ZAR" data-statsticker="true"></div>

提前致谢！

Answer 1

由于您的脚本不会呈现iframe并且仅在加载后呈现它，因此您需要每隔几秒钟重新附加一次脚本：

const redrawElements = {
  div: {
    id: 'mainContainer',
    'class': 'coinmarketcap-currency-widget',
    'data-currency': 'bitcoin',
    'data-base': 'ZAR',
    'data-secondary': '',
    'data-ticker': 'true',
    'data-rank': 'true',
    'data-marketcap': 'true',
    'data-volume': 'true',
    'data-stats': 'ZAR',
    'data-statsticker': 'true',
  },
  script: {
    src: 'https://files.coinmarketcap.com/static/widget/currency.js',
  },
}
const redrawContainer = document.querySelector( '.draw-container' );

function redraw() {
  redrawContainer.innerHTML = '';
  
  // Recreate elements
  Object.keys( redrawElements ).forEach( el => {
    const domEl = document.createElement( el );
    // Iterate over attributes
    Object.keys( redrawElements[ el ] ).forEach( attr => {
      domEl.setAttribute( attr, redrawElements[ el ][ attr ] );
    } );
    redrawContainer.appendChild( domEl );
  } );
}
redraw();
// Redraw every 10 seconds
setInterval( redraw, 10000 );

.draw-container {
  min-height: 180px;
}

<p>This is your content, which should stay the same</p>
<div class="draw-container"></div>
<p>And because <code>.draw-container</code> has a min-height, your content should not jump around.</p>

Answer 2

使用SetInterval函数添加iframe的来源。这样只会刷新div。

setInterval(()=>{$('iframe').prop('src','widget-url')},1000)

如何每隔几秒钟更新一次widget

2 个答案: