如何用JS和HTML 做一个桌面炒股小插件【原创】
生活随笔
收集整理的這篇文章主要介紹了
如何用JS和HTML 做一个桌面炒股小插件【原创】
小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
首先，使用node-webkit 做環(huán)境，廢話不多說(shuō)，直接貼HTML
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<script src="scripts/jQuery_1.8.2.min.js"></script>
<script src="data.js"></script>
<link href="css/clear.css" rel="stylesheet" />
<link href="css/main.css" rel="stylesheet" />
<script type="text/javascript">
var gui = require("nw.gui");
var win = gui.Window.get();
win.setShowInTaskbar(false)
win.y = 0;
win.x = win.window.screen.availWidth - 300;
var tray = new gui.Tray({
title: "桌面股票",
icon: "icon.png"
});
tray.tooltip = "點(diǎn)擊打開(kāi)";
var menu = new gui.Menu();
menu.append(new gui.MenuItem({
label: '退出',
click: function () {
win.close();
}
}));
tray.menu = menu;
tray.click = function () {
win.show();
}
function Refresh() {
var zj = 0;
for (var item in stockData) {
(function (name, value) {
$.get("http://hq.sinajs.cn/list=sh" + name, function (data) {
eval(data);
var stockvalue = window["hq_str_sh" + name].split(',');
var ce = stockvalue[3] - stockvalue[2];
var yk = stockvalue[3] - value.value;
var tr = $("[data-id='" + name + "']");
tr.find("td:eq(0)").html(stockvalue[0]);
tr.find("td:eq(1)").html(stockvalue[3]);
tr.find("td:eq(2)").html(stockvalue[2]);
tr.find("td:eq(3)").html(ce.toFixed(2));
tr.find("td:eq(4)").html((yk * value.times).toFixed(2));
zj += +((yk * value.times).toFixed(2));
if (ce < 0) {
tr.find("td:eq(3)").css("color", "#0CC500");
}
else if (ce > 0) {
tr.find("td:eq(3)").css("color", "#C5001E");
}
else {
tr.find("td:eq(3)").css("color", "#000");
}
if (yk < 0) {
tr.find("td:eq(4)").css("color", "#0CC500");
}
else if (yk > 0) {
tr.find("td:eq(4)").css("color", "#C5001E");
}
else {
tr.find("td:eq(4)").css("color", "#000");
}
$("table tbody tr:last td:last").html(zj);
if (zj < 0) {
$("table tbody tr:last td:last").css("color", "#0CC500");
}
else if (zj > 0) {
$("table tbody tr:last td:last").css("color", "#C5001E");
}
else {
$("table tbody tr:last td:last").css("color", "#000");
}
});
})(item, stockData[item]);
}
}
function init() {
var html = [];
for (var item in stockData) {
html.push("<tr data-id='" + item + "' data-value='" + stockData[item] + "'><td></td><td></td><td></td><td></td><td></td></tr>")
}
html.push("<tr data-id='zj'><td></td><td></td><td></td><td></td><td></td></tr>")
$("tbody").append(html.join(''));
}
$(function () {
setInterval (function () {
Refresh();
}, 2000);
init();
Refresh();
});
</script>
</head>
<body>
<div id="container">
<table>
<thead>
<tr>
<td>名稱</td>
<td>當(dāng)前</td>
<td>昨收</td>
<td>幅度</td>
<td>盈虧</td>
</tr>
</thead>
<tbody></tbody>
</table>
</div>
</body>
</html>
效果圖如下：
源碼在這里哦：
http://pan.baidu.com/s/1c0lRcxq
總結(jié)
以上是生活随笔為你收集整理的如何用JS和HTML 做一个桌面炒股小插件【原创】的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇： iOS下载大文件原理解析一
- 下一篇： 【其他】按键精灵9之网页账户登入刷投票