学习AJAX时,作了以下这个简单的AJAX例子,没用任何动态语言,完全HTML和JAVASCRIPT,至于服务器源也就小偷了一下www.cc168.com.cn(长城证券)的开放式基金每日净值查询页面。
用XMLHTTP对象获取到WEB页面HTTP内容后，采用Split的方式进行截取，取出自己需要的web部分，然后绑定到页面的div上。CSS样式表也就远程使用了cc168.com.cn的。
^_^，希望长城证券能够宽恕这种偷盗行为。程序员的事，能算“偷”吗？最多算个窃. :- )
原理很简单，但是感觉这种方式比较有用。如果自己网站想提供功能，又不想做数据web服务的话，不妨窃之。
<html>
<head>
<link href="http://www.cc168.com.cn/css/index.css" rel="stylesheet" type="text/css">
<link rel="stylesheet" href="http://www.cc168.com.cn/css/framework.css" type="text/css"/>
<script language="javascript">
window.onload = function()
{
CreateDateSelect();
}
var xmlHttp = false;
var e;
//创建XMLHTTP对象
function getXMLHTTPObj()
{
var C = null;
try
{
C = new ActiveXObject("Msxml2.XMLHTTP");
}
catch(e)
{
try
{
C = new ActiveXObject("Microsoft.XMLHTTP");
}
catch(sc)
{
C = null;
}
}
if( !C && typeof XMLHttpRequest != "undefined" )
{
C = new XMLHttpRequest();
}
return C;
}
//调用远程方法
function callServer(e)
{
try
{
if( xmlHttp && xmlHttp .readyState != 0 )
{
xmlHttp.abort();
}
xmlHttp = getXMLHTTPObj();
if( xmlHttp )
{
document.getElementById("outgroup").style.display = "none";
//获取查询日期
var dateSele = e.options[e.selectedIndex].value;
document.getElementById("date").innerHTML = dateSele + " 开放式基金净值";
//构造查询连接字符串
var url = "http://www.cc168.com.cn/service/FundNetValue.jsp?newEndDate=" + dateSele;
//打开连接
xmlHttp.open("GET", url, true);
//设置回调函数
xmlHttp.onreadystatechange = updatePage;
//发送请求
xmlHttp.send(null);
}
else
{
document.getElementById("flag").innerHTML = "XMLHTTP对象创建失败";
}
}
catch (e)
{
document.getElementById("flag").innerHTML = "查询错误:" + e;
}
}
//回调处理函数
function updatePage()
{
try {
if (xmlHttp.readyState == 1)
{
document.getElementById("flag").innerHTML = "正在加载连接对象......";
}
if (xmlHttp.readyState == 2)
{
document.getElementById("flag").innerHTML = "连接对象加载完毕。";
}
if (xmlHttp.readyState == 3)
{
document.getElementById("flag").innerHTML = "数据获取中......";
}
if (xmlHttp.readyState == 4)
{
var response = xmlHttp.responseText;
var OpenValue = response.split("<td class=\"info-head\" width=\"400\" valign=\"top\">")[1];
var OpenValue = OpenValue.split("</td></tr>")[0];
//alert(OpenValue);
document.getElementById("out").innerHTML = OpenValue;
var OpenValue1 = response.split("<td class=\"info-head\" width=\"400\" valign=\"top\">")[2];
var OpenValue1 = OpenValue1.split("</td></tr>")[0];
document.getElementById("out1").innerHTML = OpenValue1;
var OpenValue2 = response.split("<td class=\"info-head\" width=\"400\" valign=\"top\">")[3];
var OpenValue2 = OpenValue2.split("</td></tr>")[0];
document.getElementById("out2").innerHTML = OpenValue2;
var OpenValue3 = response.split("<td class=\"info-head\" width=\"400\" valign=\"top\">")[4];
var OpenValue3 = OpenValue3.split("</td></tr>")[0];
document.getElementById("out3").innerHTML = OpenValue3;
document.getElementById("flag").innerHTML = "查询结束";
document.getElementById("outgroup").style.display = "";
}
}
catch (e)
{
document.getElementById("flag").innerHTML = "回调处理错误:" + e;
}
}
//创建日期选择下拉框
function CreateDateSelect()
{
var html = [];
for(var iYear=2005; iYear<=2006; iYear ++)
{
for( var iMonth=1; iMonth<=12; iMonth ++ )
{
for( var iDay=1; iDay<=31; iDay ++ )
{
html[html.length] = "<option value=\"" + iYear + "\-" + iMonth + "\-" + iDay + "\">" + iYear + "年" + iMonth + "月" + iDay + "日" + "</option>";
}
}
}
document.getElementById("dateSele").innerHTML = "<select name=\"dateSele\" id=\"dateSele\" onchange=\"callServer(this);\">" + html.join("") + "</select>";
}
</script>
</head>
<body>
<form>
<div>请选择交易日期:</div>
<div>
<div id="dateSele" align=left>
</div>
<div id="flag" align=right></div>
</div>
<div id="date"></div>
<div id="outgroup" style="display:None">
<div id="out"></div>
<div id="out1"></div>
<div id="out2"></div>
<div id="out3"></div>
</div>
</form>
</body>
</html>
代码讲解：
1、代码主要分为JS处理和BODY两大部分（废话 ^_^）
2、BODY部分用了几个层：dataSele : 显示日期选择下拉框；flag : 状态标示；date: 显示选中的日期；outgroup：显示基金的净值结果组；out 到 out3 则是几种类型的开放式基金净值结果
3、JS部分：页面加载处理：页面初始化设置；创建XMLHTTP对象：按不同客户端浏览器创建不同的XMLHTTP连接对象；调用远程方法：构造连接字符串，发送请求；回调处理函数：判断连接对象的返回状态，进行状态显示，完全获取结果后，进行DOM方式的层赋值；创建日期选择下拉框：动态的创建日期选择下拉框，并为其加上选择事件。
分享到：
相关推荐
TinyYolo2实时视频流物体检测ONNX模型 运行 ONNX 模型，并结合 OpenCV 进行图像处理。具体流程包括： 1. 加载并初始化 ONNX 模型。 2. 从摄像头捕获实时视频流。 3. 对每一帧图像进行模型推理，生成物体检测结果。 4. 在界面上绘制检测结果的边界框和标签。
chromedriver-linux64-134.0.6998.23(Beta).zip
Web开发：ABP框架4-DDD四层架构的详解
chromedriver-linux64-135.0.7029.0(Canary).zip
实现人脸识别的考勤门禁系统可以分为以下步骤： 1. 采集人脸图像数据集：首先需要采集员工的人脸图像数据集，包括正面、侧面等多个角度的图像。可以使用MATLAB中的图像采集工具或者第三方库进行采集。 2. 预处理人脸图像数据：对采集到的人脸图像数据进行预处理，包括人脸检测、人脸对齐、人脸裁剪等操作。MATLAB提供了相关的图像处理工具箱，可以用于实现这些处理步骤。 3. 特征提取与特征匹配：使用人脸识别算法提取人脸图像的特征，比如使用人脸识别中常用的特征提取算法如Eigenfaces、Fisherfaces或者基于深度学习的算法。然后将员工的人脸数据与数据库中的人脸数据进行匹配，判断是否为注册员工。 4. 考勤记录与门禁控制：如果人脸匹配成功，系统可以记录员工的考勤时间，并且控制门禁系统进行开启。MATLAB可以与外部设备进行通信，实现门禁控制以及考勤记录功能。
yugy
企业IT治理体系规划.pptx
项目工程资源经过严格测试运行并且功能上ok，可实现复现复刻，拿到资料包后可实现复现出一样的项目，本人系统开发经验充足（全栈全领域），有任何使用问题欢迎随时与我联系，我会抽时间努力为您解惑，提供帮助 【资源内容】：包含源码+工程文件+说明等。答辩评审平均分达到96分，放心下载使用！可实现复现；设计报告也可借鉴此项目；该资源内项目代码都经过测试运行，功能ok 【项目价值】：可用在相关项目设计中，皆可应用在项目、毕业设计、课程设计、期末/期中/大作业、工程实训、大创等学科竞赛比赛、初期项目立项、学习/练手等方面，可借鉴此优质项目实现复刻，设计报告也可借鉴此项目，也可基于此项目来扩展开发出更多功能 【提供帮助】：有任何使用上的问题欢迎随时与我联系，抽时间努力解答解惑，提供帮助 【附带帮助】：若还需要相关开发工具、学习资料等，我会提供帮助，提供资料，鼓励学习进步 下载后请首先打开说明文件（如有）;整理时不同项目所包含资源内容不同;项目工程可实现复现复刻，如果基础还行，也可在此程序基础上进行修改，以实现其它功能。供开源学习/技术交流/学习参考，勿用于商业用途。质量优质，放心下载使用
基于多目标粒子群算法的冷热电联供综合能源系统优化调度与运行策略分析,基于多目标粒子群算法的冷热电联供综合能源系统优化调度与运行策略分析,MATLAB代码：基于多目标粒子群算法冷热电联供综合能源系统运行优化 关键词：综合能源 冷热电三联供 粒子群算法 多目标优化 参考文档：《基于多目标算法的冷热电联供型综合能源系统运行优化》 仿真平台：MATLAB 平台采用粒子群实现求解 优势：代码注释详实，适合参考学习，非目前烂大街的版本，程序非常精品，请仔细辨识 主要内容：代码构建了含冷、热、电负荷的冷热电联供型综合能源系统优化调度模型，考虑了燃气轮机、电制冷机、锅炉以及风光机组等资源，并且考虑与上级电网的购电交易，综合考虑了用户购电购热冷量的成本、CCHP收益以及成本等各种因素，从而实现CCHP系统的经济运行，求解采用的是MOPSO算法（多目标粒子群算法），求解效果极佳，具体可以看图 ,核心关键词： 综合能源系统; 冷热电三联供; 粒子群算法; 多目标优化; MOPSO算法; 优化调度模型; 燃气轮机; 电制冷机; 锅炉; 风光机组; 上级电网购售电交易。,基于多目标粒子群算法的CCHP综合
DSP28379D串口升级方案：单核双核升级与Boot优化，C#上位机开发串口通信方案,DSP28379D串口升级方案：单核双核升级与Boot优化，C#上位机开发实现串口通信,DSP28379D串口升级方案 单核双核升级，boot升级，串口方案。 上位机用c#开发。 ,DSP28379D; 串口升级方案; 单核双核升级; boot升级; 上位机C#开发,DSP28379D串口双核升级方案：Boot串口升级技术使用C#上位机开发
项目工程资源经过严格测试运行并且功能上ok，可实现复现复刻，拿到资料包后可实现复现出一样的项目，本人系统开发经验充足（全栈全领域），有任何使用问题欢迎随时与我联系，我会抽时间努力为您解惑，提供帮助 【资源内容】：包含源码+工程文件+说明等。答辩评审平均分达到96分，放心下载使用！可实现复现；设计报告也可借鉴此项目；该资源内项目代码都经过测试运行，功能ok 【项目价值】：可用在相关项目设计中，皆可应用在项目、毕业设计、课程设计、期末/期中/大作业、工程实训、大创等学科竞赛比赛、初期项目立项、学习/练手等方面，可借鉴此优质项目实现复刻，设计报告也可借鉴此项目，也可基于此项目来扩展开发出更多功能 【提供帮助】：有任何使用上的问题欢迎随时与我联系，抽时间努力解答解惑，提供帮助 【附带帮助】：若还需要相关开发工具、学习资料等，我会提供帮助，提供资料，鼓励学习进步 下载后请首先打开说明文件（如有）;整理时不同项目所包含资源内容不同;项目工程可实现复现复刻，如果基础还行，也可在此程序基础上进行修改，以实现其它功能。供开源学习/技术交流/学习参考，勿用于商业用途。质量优质，放心下载使用
基于PLC的双层自动门控制：光电传感触发，有序开关与延时功能实现，附程序、画面及参考文档。,基于PLC的双层自动门控制系统：精准控制，保障无尘环境；门间联动，智能安防新体验。,基于plc的双层自动门控制系统，全部采用博途仿真完成，提供程序，画面，参考文档，详情见图。 实现功能(详见上方演示视频): ① 某房间要求尽可能地保持无尘，在通道上设置了两道电动门，门1和门2，可通过光电传感器自动完成门的打开和关闭。 门1和门2 不能同时打开。 ② 第 1 道门（根据出入方向不同，可能是门 1 或门 2），是由在通道外的开门者通过按开门按钮打开的，而第 2 道门（根据出入方向不同，可能是门 1 或门 2 ）则是在打开的第 1 道门关闭后自动地打开的（也可以由通道内的人按开门按钮来打开第2 道门）。 这两道门都是在门开后，经过 3s 的延时而自动关闭的。 ③ 在门关闭期间，如果对应的光电传感器的信号被遮断，则门立即自动打开。 如果在门外或者在门内的开门者按对应的开门按钮时，立即打开。 ④ 出于安全方面的考虑，如果在通道内的某个人经过光电传感器时，对应的门已经打开，则通道外的开门者可以不按开门按钮。
项目工程资源经过严格测试运行并且功能上ok，可实现复现复刻，拿到资料包后可实现复现出一样的项目，本人系统开发经验充足（全栈全领域），有任何使用问题欢迎随时与我联系，我会抽时间努力为您解惑，提供帮助 【资源内容】：包含源码+工程文件+说明等。答辩评审平均分达到96分，放心下载使用！可实现复现；设计报告也可借鉴此项目；该资源内项目代码都经过测试运行，功能ok 【项目价值】：可用在相关项目设计中，皆可应用在项目、毕业设计、课程设计、期末/期中/大作业、工程实训、大创等学科竞赛比赛、初期项目立项、学习/练手等方面，可借鉴此优质项目实现复刻，设计报告也可借鉴此项目，也可基于此项目来扩展开发出更多功能 【提供帮助】：有任何使用上的问题欢迎随时与我联系，抽时间努力解答解惑，提供帮助 【附带帮助】：若还需要相关开发工具、学习资料等，我会提供帮助，提供资料，鼓励学习进步 下载后请首先打开说明文件（如有）;整理时不同项目所包含资源内容不同;项目工程可实现复现复刻，如果基础还行，也可在此程序基础上进行修改，以实现其它功能。供开源学习/技术交流/学习参考，勿用于商业用途。质量优质，放心下载使用
DeepSeek+DeepResearch——让科研像聊天一样简单 （1）DeepSeek如何做数据分析？ （2）DeepSeek如何分析文件内容？ （3）DeepSeek如何进行数据挖掘？ （4）DeepSeek如何进行科学研究？ （5）DeepSeek如何写综述？ （6）DeepSeek如何进行数据可视化？ （7）DeepSeek如何写作润色？ （8）DeepSeek如何中英文互译？ （9）DeepSeek如何做降重？ （10）DeepSeek论文参考文献指令 （11）DeepSeek基础知识。
项目工程资源经过严格测试运行并且功能上ok，可实现复现复刻，拿到资料包后可实现复现出一样的项目，本人系统开发经验充足（全栈全领域），有任何使用问题欢迎随时与我联系，我会抽时间努力为您解惑，提供帮助 【资源内容】：包含源码+工程文件+说明等。答辩评审平均分达到96分，放心下载使用！可实现复现；设计报告也可借鉴此项目；该资源内项目代码都经过测试运行，功能ok 【项目价值】：可用在相关项目设计中，皆可应用在项目、毕业设计、课程设计、期末/期中/大作业、工程实训、大创等学科竞赛比赛、初期项目立项、学习/练手等方面，可借鉴此优质项目实现复刻，设计报告也可借鉴此项目，也可基于此项目来扩展开发出更多功能 【提供帮助】：有任何使用上的问题欢迎随时与我联系，抽时间努力解答解惑，提供帮助 【附带帮助】：若还需要相关开发工具、学习资料等，我会提供帮助，提供资料，鼓励学习进步 下载后请首先打开说明文件（如有）;整理时不同项目所包含资源内容不同;项目工程可实现复现复刻，如果基础还行，也可在此程序基础上进行修改，以实现其它功能。供开源学习/技术交流/学习参考，勿用于商业用途。质量优质，放心下载使用
1、文件内容：jdepend-demo-2.9.1-10.el7.rpm以及相关依赖 2、文件形式：tar.gz压缩包 3、安装指令： #Step1、解压 tar -zxvf /mnt/data/output/jdepend-demo-2.9.1-10.el7.tar.gz #Step2、进入解压后的目录，执行安装 sudo rpm -ivh *.rpm 4、更多资源/技术支持：公众号禅静编程坊
项目工程资源经过严格测试运行并且功能上ok，可实现复现复刻，拿到资料包后可实现复现出一样的项目，本人系统开发经验充足（全栈全领域），有任何使用问题欢迎随时与我联系，我会抽时间努力为您解惑，提供帮助 【资源内容】：包含源码+工程文件+说明等。答辩评审平均分达到96分，放心下载使用！可实现复现；设计报告也可借鉴此项目；该资源内项目代码都经过测试运行；功能ok 【项目价值】：可用在相关项目设计中，皆可应用在项目、毕业设计、课程设计、期末/期中/大作业、工程实训、大创等学科竞赛比赛、初期项目立项、学习/练手等方面，可借鉴此优质项目实现复刻，设计报告也可借鉴此项目，也可基于此项目来扩展开发出更多功能 【提供帮助】：有任何使用上的问题欢迎随时与我联系，抽时间努力解答解惑，提供帮助 【附带帮助】：若还需要相关开发工具、学习资料等，我会提供帮助，提供资料，鼓励学习进步 下载后请首先打开说明文件（如有）;整理时不同项目所包含资源内容不同;项目工程可实现复现复刻，如果基础还行，也可在此程序基础上进行修改，以实现其它功能。供开源学习/技术交流/学习参考，勿用于商业用途。质量优质，放心下载使用
内容概要：本文档详细介绍了如何利用 MATLAB 实现鲸鱼优化算法 (WOA) 和长短期记忆网络 (LSTM) 相结合的技术——WOA-LSTM，在数据分类和预测领域的应用。文章首先概述了LSTM在网络训练中超参数依赖的问题以及WOA作为一种新颖的全局优化算法的优势。接着阐述了该项目的研究背景、目的及其重要意义，并深入讨论了项目面临的六大主要挑战，从模型优化到超参数空间管理。文档特别强调WOA-LSTM融合所带来的性能提升、降低计算复杂度的能力及其实现自动化的超参数优化流程。除此之外，文中展示了模型的应用广泛性，覆盖了从金融市场的股票预测到智能制造业的各种实际场景，并提供了具体的模型架构细节和代码实例，以帮助理解模型的工作原理和技术要点。 适合人群：具有一定编程技能的研究人员、工程师和科学家们，尤其是对深度学习技术和机器学习感兴趣的专业人士。 使用场景及目标：该文档的目标是向用户传授使用MATLAB实现WOA-LSTM进行复杂数据分类和预测的方法论，旨在指导读者理解和掌握如何利用WOA进行超参数寻优，从而改善LSTM网络性能。 其他说明：通过阅读这份文档，使用者不仅能够获得有关WOA-LSTM技术的具体实现方式的知识，而且还可以获取关于项目规划和实际部署过程中的宝贵经验。
tomcat安装及配置教程.md
**MATLAB下微电网两阶段鲁棒优化经济调度策略：基于CCG算法与min-max-min结构求解**,MATLAB微电网两阶段鲁棒优化经济调度程序：构建min-max-min结构模型，实现恶劣场景下的低成本调度，灵活调整调度保守性，利用列约束生成算法求解,MATLAB代码：微电网两阶段鲁棒优化经济调度程序 关键词：微网优化调度 两阶段鲁棒 CCG算法 经济调度 参考文档：《微电网两阶段鲁棒优化经济调度方法》 仿真平台：MATLAB YALMIP+CPLEX 优势：代码注释详实，出图效果非常好（具体看图），非目前烂大街版本，请仔细辨识 主要内容：构建了微网两阶段鲁棒调度模型，建立了min-max-min 结构的两阶段鲁棒优化模型，可得到最恶劣场景下运行成本最低的调度方案。 模型中考虑了储能、需求侧负荷及可控分布式电源等的运行约束和协调控制，并引入了不确定性调节参数，可灵活调整调度方案的保守性。 基于列约束生成算法和强对偶理论，可将原问题分解为具有混合整数线性特征的主问题和子问题进行交替求解，从而得到原问题的最优解。 最终通过仿真分析验证了所建模型和求解算法的有效性，具体内容可自行查