xiaojing___
xiaojing___

Javascript学习------示例之【时间轴】

【时间轴】

   用列表来实现，每个li里面呈现当前轴的内容；

   思路：需要有一个变量来保存当前li的序号

         当时间轴变化时，要将当前的li选中并取消对以前li的选中

   

   html文件代码：

<html>
  <head>
    <link rel="stylesheet" type="text/css" href="css/timeline.css">
    <script type="text/javascript" src="js/timeline.js"></script>
  </head>
  <body>
  	<div class="container">
  		<ul id="timeline" class="timeline">
  			<li class="active">
  				<div class="check">
  					<h1>@</h1>
  				</div>
  				<div class="content">
  					<h3>this is a header</h3>
  					<p>this is content</p>
  				</div>
  			</li>
  		........
  		中间是许多个li标签
  		........
  			<li >
  				<div class="check">
  					<h1>@</h1>
  				</div>
  				<div class="content">
  					<h3>this is a header</h3>
  					<p>this is content</p>
  				</div>
  			</li>
  		</ul>

  	</div>
  </body>
</html>  

 

CSS文件：

html,body{
	background: lightblue;
}
.container{
	width: 1000px;
	margin:0 auto;
	background: gray;
}
ul{
	background: lightyellow;
}
/*默认样式*/
.timeline li{
	height: 120px;
	list-style: none;
	position: relative;
}

.timeline li div{
	position: absolute;
}

.timeline .check h1{
	position: absolute;
	display: block;
	left: 10px;
	background: url(../image/click.jpg);
	cursor: pointer;
}


.timeline .check{
	width: 30px;
	height: 100%;
	background: url(../image/line.jpg) repeat-y center;
}

li .content{
	position: absolute;
	width: 500px;
	height: 80px;
	left: 40px;
	text-indent: 15px;
	background: lightgreen;
}

.content p{
	visibility: hidden;
}

/*have style:active;*/
.timeline .active h1{
	border: 3px solid yellow;
}
.timeline .active .content{
	height: 90px;
	border: 3px solid yellow;
}
.timeline .active .content p{
	visibility: visible;
}

CSS文件代码的几点说明：

   .container中的margin:0 auto;作用是使元素居中显示

   position属性：可以设置为absolute，然后用left和top属性来规定元素显示位置。

   display: block;可以将不是块级元素的元素变成块级元素。


JS实现代码：

window.onload=function(){
	var
	    //定义一个变量记录li的序号;初始化为0 
	    curIndex=0,
	    
	    //查找所有可被点击的元素对象
	    timeline = document.getElementById("timeline"),
	    clickArea = timeline.getElementsByTagName("h1"),

	    //查找所有的li对像
	    timePoint = timeline.getElementsByTagName("li");
    
    //为每个被单击的对象绑定单击事件
    for( var i=0 ,len = clickArea.length; i<len;i++){
    	(function(i){
    		clickArea[i].onclick = function(){
    	
    	       //为被点击的时间点li添加active类
               timePoint[i].className = "active";

               //根据记录的li变量，将active类去除
               if(i!==curIndex){
                timePoint[curIndex].className = " ";
                curIndex=i;
               }
               
    	    };
    	//添加onmouseover事件
        timePoint[i].onmousemove=function(){
          timePoint[i].className = "active";
               if(i!==curIndex){
                timePoint[curIndex].className = " ";
                curIndex=i;
               }
        }
    	})(i );
    }
};

注意：(function(i){

         ..............

       })(i);

      这段代码的意思是匿名函数立即执行。

      作用是:自己构造出块级作用域，如果没有这段代码：i的值会一直为len-1

效果图：

wKioL1OqqEjQEfvQAAAjiGSKACk390.png


学习地址：http://edu.51cto.com/lesson/id-21873.html

别人的博客：http://www.cnblogs.com/sanshi/p/3229220.html（非常不错）


你可能感兴趣的:(JavaScript,笔记,时间轴)

  • i7 12800hx和i9 11980hk差距 m0_52331396 cpucpu
    酷睿i9-11980HK采用了8核16线程设计，其基准频率为2.6GHz，最大频率为5.0GHz，并拥有24MB的三级缓存，同时集成锐炬IrisXeUHD核显并支持处理器超频，在连接性方面，i9-11980HK支持PCIe4.0、Thunderbolt4、Wi-Fi6/6E技术。其TDP范围在45-65W之间。笔记本cpu选i911980hk还是i712800hx这些点很重要http://www.
  • 深入解析Vue3响应式系统：从Proxy实现到依赖收集的核心原理 荆州克莱 面试题汇总与解析springcloudspringbootspring技术css3
    深入解析Vue3响应式系统：从Proxy实现到依赖收集的核心原理响应式系统的基本原理作为一个热门的JavaScript框架，Vue在3.x版本中引入了基于Proxy的响应式系统。这个系统的核心思想是利用Proxy对象拦截对数据的访问和修改，从而实现数据的自动更新。当我们改变一个被代理的对象时，相关的视图会自动更新，无需手动干预。这一创新的设计让Vue3在性能和开发体验上都有了大幅度的改进。如何实现
  • Mysql学习笔记（一）：Mysql的架构 荆州克莱 面试题汇总与解析springcloudspringbootspring技术css3
    一、mysql的组成部分下面是来自Mysql实战的图片，该图片很好的表示了mysql的组成mysql架构图我们主要是和server层打交道，该层由连接器，分析器，优化器执行器、（查询缓存）组成二、连接器的作用每个客户端的连接都会有一个线程（在mysql5.5之后,mysql支持线程池插件，使得少数线程可以服务大量的服务的连接）。首先，再进行三次握手之后，建立了网络连接，然校验用户名，原始主机信息和
  • 前端开发实战：创建简易HTML计算器 不胖的羊
    本文还有配套的精品资源，点击获取简介：计算器是执行基本数学运算的应用程序，通常在IT和前端开发领域中通过HTML、CSS和JavaScript实现。HTML定义页面结构和布局，JavaScript赋予计算器动态交互功能，例如监听按钮点击事件、执行计算和更新结果显示。该项目涉及HTML的元素结构、JavaScript的事件处理和DOM操作，是学习Web开发基础的理想练习。1.计算器的基本概念和应用1
  • php ip获取邮政编码,地理位置-如何从IP地址确定邮政编码和城市？ 哈士奇爱深海鱼 phpip获取邮政编码
    以下是我发现的使用[http://ipinfodb.com/ip_locator.php]来获取其信息的代码段的修改版本。请记住，您也可以向他们申请API密钥，并直接使用API来获取您认为合适的信息。如您所见[http://ipinfodb.com/ip_location_api.php，]他们提供了从PHP到JavaScript到ASP.Net的所有示例。如前所述，下面不需要密钥，因为它可以拉动
  • 掌握 npm 登录与登出：使用 npm login 和 npm logout 命令 2401_85743969 npm前端node.js
    npm（NodePackageManager）是JavaScript编程语言的包管理器，广泛用于Node.js项目中管理依赖。npm提供了丰富的功能，包括包的安装、版本管理、发布等。使用npmlogin和npmlogout命令可以与npm仓库进行身份验证和登出操作。本文将详细介绍这两个命令的使用方法和相关场景。一、npmlogin命令的使用npmlogin命令用于在终端中向npm仓库进行身份验证，
  • 领域模型、MDD\DDD\TDD概念 lemon_lmlmlmlm java
    此篇是个人笔记整理，知识来源：领域模型-CSDN博客、什么是MDD，DDD，TDD?-CSDN博客一、领域模型定义：领域模型是对领域内的概念类或现实世界中对象的可视化表示。又称概念模型、领域对象模型、分析对象模型。它专注于分析问题领域本身，发掘重要的业务领域概念，并建立业务领域概念之间的关系。领域模型（DomainModel），是完成从需求分析到面向对象设计的一座桥梁，领域模型是指对需求所涉及的领
  • 网页文件下载的各种方式 怪咖学生 前端javascript开发语言
    1.直接通过HTML标签实现文件下载最常见且简便的文件下载方式是使用HTML的标签，配合download属性，允许用户下载文件。适用于静态文件和指定的文件路径。方法：下载文件href:指定文件路径，可以是相对路径或绝对路径。download:指定下载时文件的名称。如果省略，会使用文件的默认名称。优点：简单易用，不需要JavaScript。浏览器原生支持。可用于静态资源的下载。缺点：仅限于文件已经存
  • npm、cnpm、pnpm、yarn的区别 迷途小码农零零发 前端知识库npm前端node.js
    npm,cnpm,pnpm,和yarn都是JavaScript的包管理工具，用于自动化处理包的安装、更新、配置和管理。它们之间的主要区别在于它们各自的实现方式、性能优化、以及一些特有的功能。npmnpm(NodePackageManager)是Node.js的默认包管理器，也是最早被广泛接受和使用的JavaScript包管理工具。它允许用户从npm公共仓库中安装、共享和分发代码包。npm在项目中创
  • Java基础入门3《IDEA使用与数据类型详解》 圆圆Alice Alice的Java学习笔记intellijideajava
    Hi，我又出现了，是Alice，今天我学习的是，刚刚入门，肯定是先搞定各种开发工具，还一些理解性的内容，视频来源于‘蓝桥研究院’.....本节笔记重点提要：本节笔记重点提要：1.IntellijIdea下载与安装2.IntellijIdea使用3.使用IntellijIdea打印一个界面（案列）4.变量5.Java的数据类型、数据范围、符号的意义——————————————————————————
  • Yarn安装和使用 米粒宝的爸爸 前端前端
    安装npminstall-gyarnYarn的官网Home|Yarn-JavaScript软件包管理器|Yarn中文文档-Yarn中文网部分命令yarninit-初始化某个项目yarninstall/link-默认安装依赖yarnaddtaco-安装某个依赖并默认保存到packageyarnremovetaco-移除某个依赖yarnaddtaco-dev-安装某个开发时的依赖yarnupgrade
  • Python 网络爬虫进阶：动态网页爬取与反爬机制应对 Milk夜雨 pythonpython爬虫
    在上一篇文章中，我们学习了如何使用Python构建一个基本的网络爬虫。然而，在实际应用中，许多网站使用动态内容加载或实现反爬机制来阻止未经授权的抓取。因此，本篇文章将深入探讨以下进阶主题：如何处理动态加载的网页内容应对常见的反爬机制爬虫性能优化通过具体实例，我们将探讨更复杂的网络爬虫开发技巧。一、动态网页爬取现代网页通常通过JavaScript加载动态内容。直接使用requests获取的HTML可
  • 数组at()方法：负索引的救赎与JavaScript标准化之路 不做超级小白 前端功能通关秘籍web前端javascript开发语言ecmascript
    数组at()方法：负索引的救赎与JavaScript标准化之路从一次代码评审说起在某次团队代码评审中，小白注意到有同事写下了这样的代码：constlastItem=arr[arr.length-1];这让我回想起自己早期开发时被负索引问题困扰的经历。今天，随着ES2022的发布，我们终于迎来了官方解决方案——Array.prototype.at()。本文将带你深入理解这一新特性背后的设计哲学与技术
  • k8s（kubernetes）常见故障处理总结——详细文档 运维实战课程 docker和k8s学习文档kubernetesdocker容器
    k8s（kubernetes）常见故障处理总结——详细文档本文涵盖了k8s运维过程中大部分常见的故障,提供相应的排查思路，笔记详细，仅供参考本人会经常更新运维相关技术文档，如有兴趣，可以关注我博客，欢迎互动分享k8s其他相关详细资料下载地址：kubeadm初始化高可用k8s1.20.4集群网盘地址:https://url28.ctfile.com/f/37115828-599516373-25f4
  • [论文笔记] llama-factory 微调qwen2.5、llama3踩坑 心心喵 论文笔记深度学习人工智能
    一、bug1、pre-tokenize的时候,会OOM解决：在yaml文件中添加streaming参数#tokenizestreaming:Truemax_steps:10000https://github.com/hiyouga/LLaMA-Factory/blob/3a023bca2a502810a436cfba7708df164754ea62/src/llamafactory/hparams
  • ogre 学习笔记 - Day 1 頖╃縌 ①oO% #ogre学习笔记游戏引擎
    ogre学习笔记-Day1OGRE:Object-OrientedGraphicsRenderingEngine从名称可以得出，OGRE是一个渲染引擎下载地址https://www.ogre3d.org/最新版ogre-13.1.0编译工具cmake-gui,vs2019,vscodeConfigureconfigure时发现ogre会自动从github下载/编译依赖项，github速度有可能很慢
  • 超简洁 100行Javascript代码实现2048游戏，浏览器可玩 入职啦 100行实战项目javascript游戏开发语言
    本文发表于入职啦(公众号:ruzhila)大家可以访问入职啦学习更多的编程实战。完全用Javascript的Canvas实现2048游戏，打开浏览器就可以玩项目地址代码已经开源，2048-js欢迎Star代码运行效果：所有的项目都在github上开源：100-line-code欢迎Star用100行代码的不同语言（Java、Python、Go、Javascript、Rust）实现项目，通过讲解项目
  • Nginx 学习笔记 韩某- nginx学习笔记
    目录一、引言二、Nginx概述三、Nginx的作用（一）正向代理（二）反向代理（三）负载均衡策略（四）动静分离四、Nginx安装五、Nginx的常用命令六、Nginx实战及总结一、引言在项目发展初期，并发量和用户量较少时，简单地将一个jar包部署到服务器tomcat上即可满足需求。然而，随着用户数量的不断增长以及并发量的持续增大，单台服务器容易面临性能瓶颈，出现“红温”现象。此时，为了提升系统的处
  • Selenium学习笔记--Webdriver API 2--常用方法 jiang_guo 自动化测试笔记selenium
    Webdriver重用方法浏览器控制控制浏览器窗口大小控制浏览器后退、前进切换标签页（窗口切换）switch方法获取url使用get方法模拟浏览器刷新关闭浏览器常用方法clearsend_keysclicksubmitsizetextget_attributeis_displayedtitlecurrent_url鼠标操作键盘操作元素等待显示等待隐式等待切换iframe单表单切换嵌套表单切换平行表
  • 基于SpringBoot的模拟证券交易系统 SAFE20242034 #一SpringBootspringboot后端java
    模拟证券交易系统项目概述本项目是一个基于Java的模拟证券交易系统，主要功能包括用户注册、登录、账户管理、股票查询、股票买卖以及交易记录查询等操作。系统采用SpringBoot实现后端，MySQL作为数据存储，前端使用HTML和JavaScript提供简单交互。主要功能模块1.用户注册与登录用户可以注册一个账户，包括用户名、密码、初始余额。用户登录后可访问其账户信息和进行股票交易操作。2.股票查询
  • 我转世到1995年写JavaScript称霸程序员-时空裂缝中的初识 HYP_Coder javascript开发语言ecmascript
    第一章：时空裂缝中的初识——穿越到1995年，开始编写JavaScript目录第一章：时空裂缝中的初识——穿越到1995年，开始编写JavaScript一切从零开始——了解JavaScript的基础走向深处——控制流与循环结构历史的车轮——预见未来深入探索：函数——代码的核心力量对象与数组——掌握数据结构的钥匙浏览器与DOM——向网页世界进发结语——开始征程雨，淅淅沥沥地拍打着窗户，夜色也随之变得
  • 详解 Python 中的json.loads和json.dumps方法：中英双语 阿正的梦工坊 Pythonpythonjsonmicrosoft
    中文版详解Python中的json.loads和json.dumps方法在Python的标准库中，json模块用于处理JSON数据格式。JSON（JavaScriptObjectNotation）是一种轻量级的数据交换格式，广泛用于前后端交互以及数据存储。json.loads和json.dumps是json模块中最常用的两个方法，分别用于解析JSON字符串和将Python对象序列化为JSON字符串
  • Shiro框架源码学习笔记 a88729845 shiro
    文章目录介绍认证术语如何使用Shiro的认证1.手机认证主体和凭据2.提交认证主体和凭据到认证系统3.允许访问，重新认证，或阻止访问"RememberMeSupport"RememberedvsAuthenticated登出授权授权三要素权限权限的粒度角色隐式的角色显式的角色(推荐)用户Shiro如何执行授权编程式授权角色检查权限检查实现`Permission`接口的方式使用`String`表示一
  • JavaScript系列（45）--响应式编程实现详解 ᅟᅠ        ‌‍‎‏ 一进制 JavaScriptjavascript开发语言ecmascript
    JavaScript响应式编程实现详解今天，让我们深入探讨JavaScript的响应式编程实现。响应式编程是一种基于数据流和变化传播的编程范式，它使我们能够以声明式的方式处理异步数据流。响应式编程基础概念小知识：响应式编程的核心是将所有事物都视为数据流，包括变量、用户输入、网络请求等。通过对这些数据流进行组合和转换，我们可以以声明式的方式处理复杂的异步操作。基本实现//1.基础Observable
  • JavaScript|LeetCode|动态规划|62.不同路径 J_learner LeetCodeleetcode算法动态规划
    法1：动态规划方法类同JavaScript|LeetCode|动态规划|64.最小路径和法2想法：使用一个一维数组dp，来保存到达当前行的每个网格的不同路径数到达第一行或第一列的每个网格的不同路径数目均为1到达其他网格的不同路径数目：当前网格上面的一个网格、当前网格左面的一个网格，到达这两者的不同路径数之和/***@param{number}m*@param{number}n*@return{nu
  • 使用Intro.js为Vue.js应用创建交互式引导 糖糖老师436 程序员前端javascriptvue.js开发语言
    Intro.js是一个简单易用的JavaScript库，用于创建交互式的引导教程。在Vue.js应用中，为了引导用户浏览页面并了解功能，集成Intro.js是一种常见的方法。本文将介绍如何在Vue.js应用中使用Intro.js来创建引导教程，并提供代码示例和解释。介绍Intro.jsIntro.js是一个轻量级的JavaScript库，用于创建引导教程和向用户介绍网站或应用程序的功能。它提供了丰
  • Vue项目中使用高德地图 糖糖老师436 前端程序员vue.js前端javascript
    ue项目中使用高德地图在一些简单的大屏类展示应用/网页中，经常会用到地图相关的展示场景，除了一些特殊的三维场景需要用Gis/BIM或者WebGL，一些简单的业务就可以直接使用高德地图或者百度地图来完成。本文主要讲述在Vue项目中高德地图JavaScriptAPI的引用方式以及一些简单的API的使用。演示项目使用vuecli4.0脚手架搭建项目。1.引用在高德地图发布2.0版本之前，通常只能以两种通
  • Maui学习笔记-身份认证和授权案例 Mr.L70517 Maui学习笔记学习笔记iosc#http
    在深入研究身份验证和授权时，可能会遇到很多术语。我们来简单介绍一下。Authentication，简单来讲时认证、验证身份检查用户名和密码，更高级方法设计到指纹、扫描、人脸识别或2FA认证。Authorization，授权，一旦通过身份认证，系统就可以决定当前用户是否有访问某些信息或执行一些操作的授权。OpenAuthorization(OAuth)，开放授权，它允许第三方用户访问你的程序，而无需
  • 链表的基础知识 erchazhan 链表网络数据结构
    在大一学习链表的过程中，感觉有许多没有学过的知识，这篇文章，算是我的第一篇学习笔记，可以在后续学习中回顾，有不对的情况可以提出，谢谢大家的建议。#pragmaonce#include#include//#include"SList.h"typedefintSLDateType;//voidSListPrint(SListNode*phead);定义结构体typedefstructNode{SLDa
  • 【STL笔记】字符串 Flower# 算法学习笔记c++笔记
    字符串下标从0开始，常规用法不再赘述，持续更新中…1.substr(pos，len):返回从位置pos开始，长度为len的子串。(len默认为npos)std::stringstr="Hello,World!";std::stringsub1=str.substr(7,5);//提取从索引7开始，长度为5的子串std::stringsub2=str.substr(7);//提取从索引7开始直到字符
  • 微信开发者验证接口开发 362217990 微信 开发者 token 验证
    微信开发者接口验证。 Token，自己随便定义，与微信填写一致就可以了。 根据微信接入指南描述 http://mp.weixin.qq.com/wiki/17/2d4265491f12608cd170a95559800f2d.html 第一步：填写服务器配置 第二步：验证服务器地址的有效性 第三步：依据接口文档实现业务逻辑 这里主要讲第二步验证服务器有效性。 建一个
  • 一个小编程题-类似约瑟夫环问题 BrokenDreams 编程
            今天群友出了一题：         一个数列,把第一个元素删除,然后把第二个元素放到数列的最后,依次操作下去,直到把数列中所有的数都删除,要求依次打印出这个过程中删除的数。      &
  • linux复习笔记之bash shell (5) 关于减号-的作用 eksliang linux关于减号“-”的含义linux关于减号“-”的用途linux关于“-”的含义linux关于减号的含义
        转载请出自出处： http://eksliang.iteye.com/blog/2105677        管道命令在bash的连续处理程序中是相当重要的，尤其在使用到前一个命令的studout（标准输出）作为这次的stdin（标准输入）时，就显得太重要了，某些命令需要用到文件名，例如上篇文档的的切割命令（split）、还有
  • Unix(3) 18289753290 unix ksh
    1)若该变量需要在其他子进程执行，则可用"$变量名称"或${变量}累加内容 什么是子进程？在我目前这个shell情况下，去打开一个新的shell，新的那个shell就是子进程。一般状态下，父进程的自定义变量是无法在子进程内使用的，但通过export将变量变成环境变量后就能够在子进程里面应用了。 2)条件判断： &&代表and  ||代表or&nbs
  • 关于ListView中性能优化中图片加载问题 酷的飞上天空 ListView
    ListView的性能优化网上很多信息，但是涉及到异步加载图片问题就会出现问题。 具体参看上篇文章http://314858770.iteye.com/admin/blogs/1217594   如果每次都重新inflate一个新的View出来肯定会造成性能损失严重，可能会出现listview滚动是很卡的情况，还会出现内存溢出。 现在想出一个方法就是每次都添加一个标识，然后设置图
  • 德国总理默多克：给国人的一堂“震撼教育”课 永夜-极光 教育
    http://bbs.voc.com.cn/topic-2443617-1-1.html德国总理默多克：给国人的一堂“震撼教育”课　 安吉拉—默克尔，一位经历过社会主义的东德人，她利用自己的博客，发表一番来华前的谈话，该说的话，都在上面说了，全世界想看想传播——去看看默克尔总理的博客吧！ 　　德国总理默克尔以她的低调、朴素、谦和、平易近人等品格给国人留下了深刻印象。她以实际行动为中国人上了一堂
  • 关于Java继承的一个小问题。。。 随便小屋 java
    今天看Java 编程思想的时候遇见一个问题，运行的结果和自己想想的完全不一样。先把代码贴出来！ //CanFight接口 interface Canfight { void fight(); } //ActionCharacter类 class ActionCharacter { public void fight() { System.out.pr
  • 23种基本的设计模式 aijuans 设计模式
    Abstract Factory：提供一个创建一系列相关或相互依赖对象的接口，而无需指定它们具体的类。 　　Adapter：将一个类的接口转换成客户希望的另外一个接口。A d a p t e r模式使得原本由于接口不兼容而不能一起工作的那些类可以一起工作。 　　Bridge：将抽象部分与它的实现部分分离，使它们都可以独立地变化。 　　Builder：将一个复杂对象的构建与它的表示分离，使得同
  • 《周鸿祎自述：我的互联网方法论》读书笔记 aoyouzi 读书笔记
    从用户的角度来看,能解决问题的产品才是好产品,能方便/快速地解决问题的产品,就是一流产品.   商业模式不是赚钱模式 一款产品免费获得海量用户后,它的边际成本趋于0,然后再通过广告或者增值服务的方式赚钱,实际上就是创造了新的价值链.   商业模式的基础是用户,木有用户,任何商业模式都是浮云.商业模式的核心是产品,本质是通过产品为用户创造价值. 商业模式还包括寻找需求
  • JavaScript动态改变样式访问技术 百合不是茶 JavaScriptstyle属性ClassName属性
      一:style属性 格式:  HTML元素.style.样式属性="值";   创建菜单:在html标签中创建 或者 在head标签中用数组创建   <html> <head> <title>style改变样式</title> </head> &l
  • jQuery的deferred对象详解 bijian1013 jquerydeferred对象
            jQuery的开发速度很快，几乎每半年一个大版本，每两个月一个小版本。         每个版本都会引入一些新功能，从jQuery 1.5.0版本开始引入的一个新功能----deferred对象。    &nb
  • 淘宝开放平台TOP Bill_chen C++c物流C#
    淘宝网开放平台首页：http://open.taobao.com/ 淘宝开放平台是淘宝TOP团队的产品，TOP即TaoBao Open Platform， 是淘宝合作伙伴开发、发布、交易其服务的平台。 支撑TOP的三条主线为：    1.开放数据和业务流程     * 以API数据形式开放商品、交易、物流等业务；  &
  • 【大型网站架构一】大型网站架构概述 bit1129 网站架构
    大型互联网特点 面对海量用户、海量数据 大型互联网架构的关键指标 高并发 高性能 高可用 高可扩展性 线性伸缩性 安全性 大型互联网技术要点   前端优化 CDN缓存 反向代理 KV缓存 消息系统 分布式存储 NoSQL数据库 搜索 监控 安全 想到的问题： 1.对于订单系统这种事务型系统，如
  • eclipse插件hibernate tools安装 白糖_ Hibernate
    eclipse helios(3.6)版 1.启动eclipse 2.选择 Help > Install New Software...> 3.添加如下地址： http://download.jboss.org/jbosstools/updates/stable/helios/ 4.选择性安装：hibernate tools在All Jboss tool
  • Jquery easyui Form表单提交注意事项 bozch jquery easyui
    jquery easyui对表单的提交进行了封装，提交的方式采用的是ajax的方式，在开发的时候应该注意的事项如下：         1、在定义form标签的时候，要将method属性设置成post或者get，特别是进行大字段的文本信息提交的时候，要将method设置成post方式提交，否则页面会抛出跨域访问等异常。所以这个要
  • Trie tree(字典树)的Java实现及其应用-统计以某字符串为前缀的单词的数量 bylijinnan java实现
    import java.util.LinkedList; public class CaseInsensitiveTrie { /** 字典树的Java实现。实现了插入、查询以及深度优先遍历。 Trie tree's java implementation.(Insert,Search,DFS) Problem Description Igna
  • html css 鼠标形状样式汇总 chenbowen00 htmlcss
    css鼠标手型cursor中hand与pointer  Example：CSS鼠标手型效果 <a href="#" style="cursor:hand">CSS鼠标手型效果</a><br/>  Example：CSS鼠标手型效果 <a href="#" style=&qu
  • [IT与投资]IT投资的几个原则 comsci it
          无论是想在电商,软件,硬件还是互联网领域投资,都需要大量资金,虽然各个国家政府在媒体上都给予大家承诺,既要让市场的流动性宽松,又要保持经济的高速增长....但是,事实上,整个市场和社会对于真正的资金投入是非常渴望的,也就是说,表面上看起来,市场很活跃,但是投入的资金并不是很充足的......    
  • oracle with语句详解 daizj oraclewithwith as
    oracle with语句详解 转 在oracle中，select 查询语句，可以使用with,就是一个子查询，oracle 会把子查询的结果放到临时表中，可以反复使用 例子:注意，这是sql语句，不是pl/sql语句， 可以直接放到jdbc执行的 ----------------------------------------------------------------
  • hbase的简单操作 deng520159 数据库hbase
    近期公司用hbase来存储日志,然后再来分析 ,把hbase开发经常要用的命令找了出来. 用ssh登陆安装hbase那台linux后 用hbase shell进行hbase命令控制台! 表的管理 1）查看有哪些表 hbase(main)> list 2）创建表   # 语法：create <table>, {NAME => <family&g
  • C语言scanf继续学习、算术运算符学习和逻辑运算符 dcj3sjt126com c
    /* 2013年3月11日20:37:32 地点：北京潘家园 功能：完成用户格式化输入多个值 目的：学习scanf函数的使用 */ # include <stdio.h> int main(void) { int i, j, k; printf("please input three number:\n"); //提示用
  • 2015越来越好 dcj3sjt126com 歌曲
    越来越好 房子大了电话小了 感觉越来越好 假期多了收入高了 工作越来越好 商品精了价格活了 心情越来越好 天更蓝了水更清了 环境越来越好 活得有奔头人会步步高 想做到你要努力去做到 幸福的笑容天天挂眉梢 越来越好 婆媳和了家庭暖了 生活越来越好 孩子高了懂事多了 学习越来越好 朋友多了心相通了 大家越来越好 道路宽了心气顺了 日子越来越好 活的有精神人就不显
  • java.sql.SQLException: Value '0000-00-00' can not be represented as java.sql.Tim feiteyizu mysql
    数据表中有记录的time字段（属性为timestamp）其值为：“0000-00-00 00:00:00” 程序使用select 语句从中取数据时出现以下异常： java.sql.SQLException:Value '0000-00-00' can not be represented as java.sql.Date   java.sql.SQLException: Valu
  • Ehcache（07）——Ehcache对并发的支持 234390216 并发ehcache锁ReadLockWriteLock
    Ehcache对并发的支持          在高并发的情况下，使用Ehcache缓存时，由于并发的读与写，我们读的数据有可能是错误的，我们写的数据也有可能意外的被覆盖。所幸的是Ehcache为我们提供了针对于缓存元素Key的Read（读）、Write（写）锁。当一个线程获取了某一Key的Read锁之后，其它线程获取针对于同
  • mysql中blob,text字段的合成索引 jackyrong mysql
      在mysql中，原来有一个叫合成索引的，可以提高blob,text字段的效率性能， 但只能用在精确查询，核心是增加一个列，然后可以用md5进行散列，用散列值查找 则速度快 比如： create table abc(id varchar(10),context blog,hash_value varchar(40)); insert into abc(1,rep
  • 逻辑运算与移位运算 latty 位运算逻辑运算
    源码：正数的补码与原码相同例+7 源码：00000111 补码 ：00000111 （用8位二进制表示一个数） 负数的补码： 符号位为1，其余位为该数绝对值的原码按位取反；然后整个数加1。   -7 源码： 10000111 ，其绝对值为00000111  取反加一：11111001 为-7补码 已知一个数的补码，求原码的操作分两种情况：
  • 利用XSD 验证XML文件 newerdragon javaxmlxsd
    XSD文件 （XML Schema 语言也称作 XML Schema 定义（XML Schema Definition，XSD）。 具体使用方法和定义请参看： http://www.w3school.com.cn/schema/index.asp java自jdk1.5以上新增了SchemaFactory类 可以实现对XSD验证的支持，使用起来也很方便。 以下代码可用在J
  • 搭建 CentOS 6 服务器(12) - Samba rensanning centos
    （1）安装 # yum -y install samba Installed: samba.i686 0:3.6.9-169.el6_5 # pdbedit -a rensn new password:123456 retype new password:123456 …… （2）Home文件夹 # mkdir /etc
  • Learn Nodejs 01 toknowme nodejs
    （1）下载nodejs https://nodejs.org/download/ 选择相应的版本进行下载     （2）安装nodejs 安装的方式比较多，请baidu下 我这边下载的是“node-v0.12.7-linux-x64.tar.gz”这个版本 （1）上传服务器 （2）解压 tar -zxvf  node-v0.12.
  • jquery控制自动刷新的代码举例 xp9802 jquery
    1、html内容部分  复制代码代码示例: <div id='log_reload'> <select name="id_s" size="1"> <option value='2'>-2s-</option> <option value='3'>-3s-</option
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他