jquery 综合使用例子

Posted 2020-08-20 算顺网
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了jquery 综合使用例子相关的知识，希望对你有一定的参考价值。
效果如下：
<!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>
    <title></title>
    <script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function () {
            $("#initData").one("click", function () {
                //加载数据
                initData();
            });
            $("#initCssAndEvent").one("click", function () {
                //设置样式与事件
                bindCssAndEvent();
            });
        });

        //加载数据
        function initData() {
            //车次数据
            var data = [{ "xuhao": "1", "checi": "1171(哈尔滨->太原)", "fazhan": "北京", "daozhan": "太原", 

"fashi": "02:29", "daoshi": "13:46", "lishi": "11:17", "shangwuzuo": "--", "tedengzuo": "--", "yidengzuo": "--", 

"erdengzuo": "--", "yingzuo": "100", "dengji": "普快" },

                    { "xuhao": "2", "checi": "Z55(北京西->兰州)", "fazhan": "北京西", "daozhan": "太原", "fashi": 

"14:30", "daoshi": "19:14", "lishi": "04:44", "shangwuzuo": "--", "tedengzuo": "--", "yidengzuo": "--", 

"erdengzuo": "--", "yingzuo": "14", "dengji": "直特" },

                    { "xuhao": "3", "checi": "D2011(北京西->太原)", "fazhan": "北京西", "daozhan": "太原", 

"fashi": "15:31", "daoshi": "19:22", "lishi": "03:51", "shangwuzuo": "--", "tedengzuo": "--", "yidengzuo": "0", 

"erdengzuo": "0", "yingzuo": "--", "dengji": "动车" },

                    { "xuhao": "4", "checi": "T41(北京西->西安)", "fazhan": "北京西", "daozhan": "太原", "fashi": 

"15:51", "daoshi": "21:31", "lishi": "05:40", "shangwuzuo": "--", "tedengzuo": "--", "yidengzuo": "--", 

"erdengzuo": "--", "yingzuo": "40", "dengji": "特快" },

                    { "xuhao": "5", "checi": "D191(沈阳北->太原)", "fazhan": "北京", "daozhan": "太原", "fashi": 

"17:05", "daoshi": "21:00", "lishi": "03:55", "shangwuzuo": "--", "tedengzuo": "--", "yidengzuo": "42", 

"erdengzuo": "59", "yingzuo": "--", "dengji": "动车" },

                    { "xuhao": "6", "checi": "T27(北京西->拉萨)", "fazhan": "北京西", "daozhan": "太原", "fashi": 

"20:08", "daoshi": "00:53", "lishi": "04:45", "shangwuzuo": "--", "tedengzuo": "--", "yidengzuo": "--", 

"erdengzuo": "--", "yingzuo": "9", "dengji": "动车"}];

            for (var i = 0; i < data.length; i++) {
                var tr = "<tr>";
                tr += "<td>" + data[i].xuhao + "</td>";
                tr += "<td>" + data[i].checi + "</td>使用 NodeJS 和 JSDOM/jQuery 从代码片段构建 PHP 页面
 26个jQuery代码片段使用技巧
 常用的几个JQuery代码片段
 几个有用的JavaScript/jQuery代码片段（转）
 高效Web开发的10个jQuery代码片段
 高效Web开发的10个jQuery代码片段