请教一下用js如何实现这个网站(http://ping.chinaz.com/)的效果

laodan 2013-01-04 04:32:56
网站:http://ping.chinaz.com/

动态加载新增的<ul><li>.....</li><ul>,这个网站是通过iframe来实现的,但具体如何实现原理,我没找到。

请教这个如何用js实现?
...全文
563 13 打赏 收藏 转发到动态 举报
AI 作业
写回复
用AI写文章
13 条回复
切换为时间正序
请发表友善的回复…
发表回复
laodan 2013-01-05
  • 打赏
  • 举报
回复
谢谢Free_Wind22 的提示,按你的思路搞定了。
似梦飞花 2013-01-04
  • 打赏
  • 举报
回复
ajax+js动态生成dom?
laodan 2013-01-04
  • 打赏
  • 举报
回复
引用 9 楼 Free_Wind22 的回复:
Response.Flush(); 你加了这个不
加了,还是一样
  • 打赏
  • 举报
回复
ajax+setTimeout/setInterval定时获取服务器端返回的ping值就行了 也可以使用长连接[服务器推]来实现,Streaming AJAX
2013-01-04
  • 打赏
  • 举报
回复
Response.Flush(); 你加了这个不
laodan 2013-01-04
  • 打赏
  • 举报
回复
而且我觉得你这种写法根本是实现不了的,延时只在服务端有,服务端最后会把结果一起发送给浏览器,不会有延时效果。
laodan 2013-01-04
  • 打赏
  • 举报
回复
呵呵,楼上兄弟,我测试了一下,没有看见延时的效果,而是一下子全部显示的
2013-01-04
  • 打赏
  • 举报
回复

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="test.aspx.cs" Inherits="Test_test" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    <% ping(); %>
    </div>
    </form>
</body>
</html>

using System;
using System.Collections.Generic;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

public partial class Test_test : System.Web.UI.Page {
    protected void Page_Load(object sender, EventArgs e) {
        
    }

    protected void ping() {
        for (int i = 0; i < 10; i++) {
            Response.Write(i + "<br/>");
            Response.Flush();
            System.Threading.Thread.Sleep(500);
        }
    }
}

这个是用.net 模拟一个例子
2013-01-04
  • 打赏
  • 举报
回复
你做个长时间运行的程序就知道了。
laodan 2013-01-04
  • 打赏
  • 举报
回复
根据http协议,服务端会把所有的结果一次返回,不会像这个特效一样延时返回,所以我觉得延时的效果是用js来开发的。
laodan 2013-01-04
  • 打赏
  • 举报
回复
引用 2 楼 Free_Wind22 的回复:
<script>parent.document.getElementById('detail').innerHTML+='<ul><li>1</li><li>云南昆明[电信]</li><li><a href="http://ip.chinaz.com/?IP=112.117.216.47">112.117.216.47</a></li><li style="">1毫秒</……
请教这段代码是如何产生和加载的?
2013-01-04
  • 打赏
  • 举报
回复
<script>parent.document.getElementById('detail').innerHTML+='<ul><li>1</li><li>云南昆明[电信]</li><li><a href="http://ip.chinaz.com/?IP=112.117.216.47">112.117.216.47</a></li><li style="">1毫秒</li><li>58</li><li><a href="http://www.yunnanidc.net" target=_blank>云南数据港</a></li></ul>';</script>
2013-01-04
  • 打赏
  • 举报
回复
在iframe里不断输出 <script>parent.document.getElementById('detail').innerHTML+='<ul class="head"><li>序号</li><li>Ping的地点</li><li>响应IP</li><li>响应时间</li><li>TTL</li><li>赞助商 <img alt="赞助点联系QQ:1751691323" title="赞助点联系QQ:1751691323" onclick="super1()" src="/template/default/images/helptip.gif"/></li></ul>';</script>
资源下载链接为: https://pan.quark.cn/s/1bfadf00ae14 松下电工数字压力传感器用户手册详细介绍了DP-100系列数字压力传感器,涵盖其技术参数、操作方法及适用场景等,适用于各类需要精准压力测量的工业环境。 双屏显示:主屏与输出动作同步,可同时显示当前值和基准值,便于实时监控与调整。显示屏为12段字母数字显示,数字清晰易读。 三色指示:屏幕颜色随传感器状态变化(红、绿、橙),便于快速判断工作状态。 紧凑结构:尺寸仅□30mm,适合空间狭窄的安装环境。 多种操作模式:提供RUN模式(日常操作)、菜单设定模式(深入设置如输出模式切换)及PRO模式(高级功能如应差调整、复制设定)。 安全认证:DP-101(A)/102(A)型号通过特定认证,确保产品安全可靠。 复制功能:可通过数据通信将主传感器设定内容复制到其他传感器,减少人工设定错误,节省时间。 高性能传感:具备高精度,分辨率1/2,000,反应时间2.5ms(最长5,000ms可调),温度特性±0.5%F.S.,重复精度±0.1%F.S. 电子元件吸附检测:监测吸盘是否成功吸附电子元件。 总压力监测:测量管道或容器内的压力水平。 空气泄漏检测:通过压力变化检测泄漏情况。 DP-101□:适用于低压环境(-100kPa至100kPa)。 DP-102□:适用于高压环境(0kPa至1MPa)。 订购时需根据实际需求选择合适型号,考虑传感器的适用范围和工作条件。手册提供详细订购流程及注意事项,包括相关认证信息(如韩国S标志)。 复制功能:通过数据通信将主传感器设定复制到其他传感器,支持多种设定模式,避免设定错误,节省时间。 操作模式:RUN模式用于日常监控,菜单设定模式用于深入设置,PRO模式提供高级功能。 使用前需仔细阅读手册,了解各功能使用方法。遵循安全指南,正确安装和使用传感器,避免损坏。对于

87,997

社区成员

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧