时间
|
开盘价
|
最高价
|
最低价
|
收盘价
|
成交量
|
javascript
// script.js
const currentPrice = document.getElementById('current-price');
const changePercent = document.getElementById('change-percent');
const chart = document.getElementById('chart');
const tbody = document.querySelector('tbody');// 定义一个函数来格式化数字
const formatNumber = (num) => {return num.toFixed(2);
};// 定义一个函数来请求股票数据
const getStockData = () => {fetch('https://hq.sinajs.cn/list=sh600049').then(res => res.text()).then(data => {// 解析股票数据const [, open, high, low, close, volume] = data.split(',');// 更新界面currentPrice.innerText = formatNumber(close);changePercent.innerText = '(' + formatNumber((close - open) / open 100) + '%)';// 绘制图表const ctx = chart.getContext('2d');const myChart = new Chart(ctx, {type: 'line',data: {labels: ['开盘', '最高', '最低', '收盘'],datasets: [{label: '云铝股份',data: [open, high, low, close],backgroundColor: 'rgba(54, 162, 235, 0.2)',borderColor: 'rgba(54, 162, 235, 1)',borderWidth: 1}]},options: {scales: {y: {beginAtZero: true}}}});// 更新表格数据const row = document.createElement('tr');const time = new Date().toLocaleTimeString();const cells = [time, open, high, low, close, volume];cells.forEach(cell => {const td = document.createElement('td');td.innerText = cell;row.appendChild(td);});tbody.appendChild(row);});
};// 每秒请求一次股票数据
setInterval(getStockData, 1000);