Thetimezipsby
Thetimezipsby

原生JS实现无缝轮播效果（自动/手动/焦点）

原生JS实现无缝轮播效果

以下是效果图：
原生JS实现无缝轮播效果（自动/手动/焦点）_第1张图片
以下是代码部分

html结构：

<body>
	
	<div class="carousel">
		
		<div class="cal_list">
			
			<ul class="move_ul">
				<li>1li>
				<li>2li>
				<li>3li>
				<li>1li>
			ul>

			
			<span class="left_btn"><span>
			<span class="right_btn">>span>
			
			<div class="circle_list">
				<span class="circle active">span>
				<span class="circle">span>
				<span class="circle">span>
			div>
		div>
	div>
body>

css样式:

js代码（重点）

<script type="text/javascript">
		/*
			让一个元素移动的功能
				ele 移动的元素
				target 要移动到的目标值
		*/
		function move(ele,target){
     
			//防止连续点击按钮开启多个定时器，先进行清除定时器
			clearInterval(ele.timer)

			//把定时器存储到了元素属性中
			ele.timer = setInterval(function(){
     
				// 当等于目标距离清除定时器
				if(ele.offsetLeft == target){
     
					clearInterval(ele.timer);
				}else{
     

					/*
						这里使用缓动动画
						让速度等于目标值和当前位置之差/10，
						二者之差会越来越小，即速度sped也会越来越小

					*/
					// 目标值-当前值/10
					var step = (target - ele.offsetLeft)/10;

					/*
						二者之差除以十并不总是整数，
						可能会导致物体位置和目标值不能完全相等，
						所以需要对speed进行取整，大于0向上取整，小于0向下取整；
					*/
					step = step > 0?Math.ceil(step):Math.floor(step);
					// 然后把计算好的值赋给元素的left值使其移动
					ele.style.left = ele.offsetLeft +step+'px';
				}
			},10);
		}

		/*
			这里使用了一种思想————排他思想：
				就是先清空所有的，然后单独设置当前的
		*/
		/*
			排他功能
				eles 要操作的元素集合
				num 操作的第几个
		*/ 
		function exclusive(eles,num){
     
			// 小圆点排他
			for(var i = 0; i < eles.length; i++){
     
				eles[i].className = 'circle';
			}
			// 添加样式
			eles[num].className = 'circle active';
		}

		/*
			获取相关的DOM元素
		*/
		var oRight = document.querySelector('.right_btn');// 右边按钮
		var oLeft = document.querySelector('.left_btn');// 左边按钮
		var oMoveUl = document.querySelector('.move_ul');// 获取移动的ul
		var oCircles = document.querySelectorAll('.circle');// 获取小圆点

		var flag = 0;//记录小圆点的位置（看成下标）
		var count = 0;//记录图片移动到第几张（看成下标）

		// 右边按钮绑定单击事件（需要ul往左移动）
		oRight.addEventListener('click',function(){
     
			// 当点击一次进行自加
			flag++;
			count++;

			// 小圆点判断（如果这次的点击是最后一个小圆点，就让这个标记重置）
			if(flag == oCircles.length){
     
				flag = 0;
			}

			// 图片判断（如果这次的点击是最后一张图片（代表第一张））
			if(count == oMoveUl.children.length){
     
				// 让ul迅速拉回
				oMoveUl.style.left = '0px';
				count = 1;//让图片的下标指向第二张
			}

			// 小圆点排他（调用排他功能 传入所有小圆点及当前点击的是第几个）
			exclusive(oCircles,flag);

			// 计算移动到的目标值
			var target = count * -oMoveUl.children[0].offsetWidth;
			// 调用移动方法 传入移动元素ul(oMoveUl) 和目标值
			move(oMoveUl,target);
		});

		// -----------------------------
		// 左边按钮绑定单击事件（需要ul往右移动）
		oLeft.addEventListener('click',function(){
     
			// 如果当前是第一张就拉回到倒数第二张
			if(count == 0){
     
				count = oMoveUl.children.length - 1;
				oMoveUl.style.left = (count * -600) +'px';
			}

			// 当点击一次进行自减
			count--;
			flag--;
			//判断小圆点此时的状态
			if(flag < 0){
     
				flag = oCircles.length -1;
			}
			// 小圆点排他
			exclusive(oCircles,flag);

			//设置移动的距离
			var target = count * -oMoveUl.children[0].offsetWidth;
			move(oMoveUl,target);
		});

		// 鼠标移入清除自动轮播
		document.querySelector('.cal_list').addEventListener('mouseover',function(){
     
			clearInterval(oMoveUl.clear);
		});

		// 鼠标移出则继续轮播
		document.querySelector('.cal_list').addEventListener('mouseout',function(){
     
			auto();
		})

	// 自动轮播功能
	function auto(){
     
		oMoveUl.clear = setInterval(function(){
     
			oRight.click(); //相当于手动点击了右边按钮
		},2000);
	}
	// 界面载入先进行自动轮播
	auto();


	// 焦点轮播
	for(var i = 0; i < oCircles.length; i++){
     
		(function(index){
     
			oCircles[index].addEventListener('click',function(){
     
				// 使焦点轮播的和自动轮播同步（标记改变为点击的那个下标）
				flag = index;
				count = index;

				exclusive(oCircles,index);
				var target = index * -oMoveUl.children[0].offsetWidth;
				move(oMoveUl,target);
			});
		})(i);
	}
</script>

如有错误还请指出，希望这篇文章能给予你们帮助！

你可能感兴趣的:(笔记,javascript,css3,html5)

  • JavaScript 高频面试题 好运连连女士 JavaScriptjavascript
    文章目录JavaScript手写防抖和节流CommonJS和ES6模块的区别this指向问题，如何修改this指向引申1:模拟bind引申2：为什么多次绑定，只指向第一次绑定的obj对象?有没有解决办法？引申3:一般函数和箭头函数的区别数据类型有哪些引申1:如何判断数据类型new操作的原理引申1:什么是闭包？引申2:内存泄露和内存溢出引申3:作用域和作用域链？JS实现数组扁平化深拷贝与浅拷贝的区别
  • JavaScript相关面试题 努力的搬砖人. javascript
    以下是150道JavaScript相关面试题及详细答案：JavaScript基础1.JavaScript是什么？JavaScript是一种直译式脚本语言，主要用于网页开发，也可用于服务器端开发（如Node.js）。它是一种动态类型、弱类型、基于原型的语言，支持函数式编程和面向对象编程。2.JavaScript的基本数据类型有哪些？包括Undefined、Null、Boolean、Number、St
  • 原生JavaScript控制页面跳转的几种方式 thinkQuadratic javascript前端开发语言
    在开发一些简单的页面，不需要复杂的单页面应用（SPA）功能的时候。可以使用原生JavaScript的跳转即可满足需求。另外在处理一些需要直接与服务器进行交互的表单提交后跳转，或者在某些浏览器兼容性要求较高的场景下，原生JavaScript的跳转方式更加稳定可靠。正文开始这里本地创建两个html文件进行演示，index.html和home.htmlwindow.location.hrefindex页
  • python后端常见架构_常见的后端框架 weixin_39622178 python后端常见架构
    后端vs前端如果您是Web开发世界的新手，后端和前端开发之间的区别可能不那么明显，但是，了解两者之间的区别很重要。以下是前端开发人员与后端开发人员的一些区别。前端开发：前端开发人员在很大程度上负责用户所看到的内容(即网站页面)，前端开发人员主要使用HTML，CSS和JavaScript。他们的主要关注点是创建出色的用户体验，并确保网站设计和布局或Web应用程序始终具有凝聚力。后端开发：另一方面，后
  • 使用 CryptoJS 实现 AES 解密：动态数据解密示例 木觞清 javascript
    在现代加密应用中，AES（高级加密标准）是一种广泛使用的对称加密算法。它的安全性高、效率好，适合用于各种加密任务。今天，我们将通过一个实际的示例，展示如何使用CryptoJS实现AES解密，解密动态数据。CryptoJS是一个基于JavaScript的加密库，它支持AES、DES等多种常见的加密算法。本文将详细介绍如何使用CryptoJS解密AES加密的数据。1.引入CryptoJS库首先，确保你
  • 详细讲一下webpack中五个优化能力十分强大的插件（1-5） asecretman! webpack前端node.js
    1.TerserPlugin功能：用于压缩和优化JavaScript代码，支持ES6+语法。安装:npminstallterser-webpack-plugin--save-dev配置constTerserPlugin=require('terser-webpack-plugin');module.exports={mode:'production',//设置为生产模式，启用优化optimizat
  • JavaScript 异步编程：从回调到 Async/Await 进化 PM简读馆 技术杂谈javascript开发语言ecmascript
    作者简介：程序员转项目管理领域优质创作者个人邮箱：[[email protected]]PMP资料导航：PM菜鸟（查阅PMP大纲考点）座右铭：上善若水，水善利万物而不争。绿泡泡：PM简读馆（包含更多PM常用免费资料）目录1.回调函数（Callback）2.Promise3.Generator4.Async/Await在JavaScript中，异步编程是一个非常重要的概念，因为JavaScript是
  • c语言笔记 结构体内嵌套结构体的表示方式 我是大咖 笔记
    目录结构体内嵌套结构体问：我们都该如何去访问该结构体里面的结构体的成员呢?怎么去给里面的成员赋值呢?说明：运行上述代码后，输出结果如下：结构体内嵌套结构体背景：如果我们在结构体中放结构体，我们可以不写结构体里面结构体的结构体标签，但是我们可以定义结构体里面结构体的变量，定义里面结构体定义变量与不定义变量的表示方式。问：我们都该如何去访问该结构体里面的结构体的成员呢?怎么去给里面的成员赋值呢?如果是
  • html怎么获取父页面的元素的值,使用JavaScript与jQuery怎么在子窗口中获取父窗口的元素值... weixin_39907658
    使用JavaScript与jQuery怎么在子窗口中获取父窗口的元素值发布时间：2021-02-1815:42:20来源：亿速云阅读：115作者：Leah使用JavaScript与jQuery怎么在子窗口中获取父窗口的元素值？针对这个问题，这篇文章详细介绍了相对应的分析和解答，希望可以帮助更多想解决这个问题的小伙伴找到更简单易行的方法。js:父窗口：子窗口：curproject=window.op
  • jquery查找父窗体id_jquery 获取父窗口的元素、父窗口、子窗口 weixin_39781550 jquery查找父窗体id
    一、获取父窗口元素：$("#父窗口元素ID",window.parent.document)；对应javascript版本为window.parent.document.getElementById("父窗口元素ID")；取父窗口的元素方法：$(selector,window.parent.document);那么你取父窗口的父窗口的元素就可以用：$(selector,window.parent.
  • jquery查找父窗体id_JS与jQuery实现子窗口获取父窗口元素值的方法 北木南烟 jquery查找父窗体id
    这篇文章主要介绍了JS与jQuery实现子窗口获取父窗口元素值的方法,涉及javascript与jQuery操作窗口元素的相关技巧,需要的朋友可以参考下本文实例讲述了JS与jQuery实现子窗口获取父窗口元素值的方法。分享给大家供大家参考，具体如下：功能描述：父窗口有一个input，和一个button，点击button打开子窗口，在子窗口中获取父窗口中input的值，并显示。js:父窗口：子窗口：
  • 【ES6新特性】声明变量关键字：var、let、const详解 小钟H呀 ES6新特性学习手册es6javascript开发语言
    前言在ES6（ECMAScript2015）之前，JavaScript中只有var关键字用于变量声明。ES6新增了let和const，它们解决了var的一些设计缺陷，使得变量声明更安全、更符合编程直觉。核心特性对比1.作用域（Scope）var：函数作用域（在函数内部声明的变量，只能在函数内部访问）let/const：块级作用域（在{}代码块中声明的变量，只能在块内访问）//var示例functi
  • 谷粒商城学习笔记，第七天：性能压测+缓存+分布式锁 「已注销」 数据库分布式redisjava多线程
    谷粒商城学习笔记，第七天：性能压测+缓存+分布式锁一、性能压测我们希望通过压测发现其他测试更难发现的错误：内存泄漏、并发与同步。1、性能指标吞吐量、响应时间QPSTPS、错误率RT:ResponseTime响应时间HPS:hitspersecond每秒点击次数TPS：Transactionpersecond系统每秒处理交易数QPS：querypersecond每秒处理查询次数2、JMeter下载地
  • Day03_谷粒商城（谷粒商城高级篇二）摘要 BlackTurn 项目总结
    文章目录笔记P102—P124是讲解ES的知识，和谷粒商城项目完全无关P125—P127是讲解SpringBoot整合ESP128—P129商品上架功能0P130商品上架功能1P131商品上架功能2P132商品上架功能3P133商品上架功能4P134—P135商品上架功能—测试P136—P138首页展示一级、二级、三级目录P139nginx搭建域名访问环境1P140nginx搭建域名访问环境1P1
  • Armv8-A virtualization Arm精选 ARM文档导读虚拟化virtualizationtrustzone安全周贺贺armv8armv9
    快速链接:.个人博客笔记导读目录(全部)付费专栏-付费课程【购买须知】:【精选】ARMv8/ARMv9架构入门到精通-[目录]—适合小白入门【目录】ARMv8/ARMv9架构高级进阶-[目录]—高级进阶、小白勿买【加群】ARM/TEE/ATF/SOC/芯片/安全-学习交流群—加群哦目录前言1.概述2.虚拟化介绍2.1虚拟化为什么重要2.2hypervisors的两种类型2.3全虚拟化和半虚拟化2.
  • 神器 Turbo Console Log：让 `console.log` 操作一键搞定！ Judy1623 VSCode插件vscode插件
    在前端开发的日常里，尤其是使用VSCode调试JavaScript代码时，console.log堪称我们的“调试好帮手”。但每次都手动输入console.log语句，着实麻烦又浪费时间。今天就给大家安利一款超实用的VSCode插件——TurboConsoleLog，用了它，你会感叹为什么没有早点发现！安装和卸载步骤就不多说了，相信大家都轻车熟路。咱们直接进入重点——这款插件的快捷键使用方法。使用注
  • STM32学习笔记 李兆源—电子工程师 stm32学习笔记
    STM32系列(HAL库)——内部FLASH读写实验_简约版在此篇文章前，写过另外一篇关于STM32内部FLash读写的文章——点击跳转。之前那篇文章的代码是移植于正点原子的，比较复杂，因为它考虑了写入字节大于1K或2K时需要换页写入的问题。但是在实际使用过程中，我们需要写入的数据常常远小于1K，因此本篇文章的代码适用于写入小量数据使用(即小于1K或2K——取决于单片机最小写入页)。本次代码是借鉴
  • 分布式电商项目 谷粒商城 学习笔记＜4＞ 怎么又有bug单 SpringBoot分布式java开发语言阿里压力测试
    文章目录十五、压力测试1.一些基本概念2.JVM内存机制3.压测记录4.Nginx动静分离5.优化三级分类查询十六、redisson分布式锁与缓存1.概念2.redis3.缓存失效缓存穿透缓存雪崩缓存击穿互斥锁：4.缓存击穿如何复制微服务：5.分布式缓存概念原则基本流程6.Redisson环境搭建可重入锁锁的续期读写锁信号量（Semaphore）闭锁7.缓存和数据库一致性十五、压力测试这里是使用j
  • 基于.NET MVC实现H5页面调用手机摄像头扫描二维码完整方案 Bart_Lu .netmvc
    一、前言在移动端Web开发中，二维码扫描功能已成为常见需求。本文将介绍如何在ASP.NETMVC框架下，通过HTML5技术调用手机摄像头实现二维码扫描功能，并提供完整的代码实现方案。二、技术选型前端库：使用ZXing-js（支持浏览器二维码解析）后端框架：ASP.NETMVC5浏览器API：MediaDevicesAPI三、实现步骤1.准备工作在MVC项目中引入所需库：html运行HTML2.创建
  • 前端框架革命：React与Vue对比与解析 WHCIS Web开发技术前端框架react.jsvue.js
    一、框架设计哲学的本质差异1.1React：以JavaScript为核心的函数式哲学React的核心思想可以概括为**“UI即函数”**，其设计遵循以下原则：React核心声明式编程组件即函数单向数据流JSX描述UI函数组件+Hook状态提升模式声明式编程：开发者只需描述界面应该呈现的最终状态，无需关心具体DOM操作细节不可变数据流：通过setState触发组件树更新，保持数据流向的可预测性虚拟D
  • ubuntu 自动挂起_ubuntu 的挂起与休眠 AIS_Canada ubuntu自动挂起
    待机计算机将目前的运行状态等数据存放在内存，关闭硬盘、外设等设备，进入等待状态。此时内存仍然需要电力维持其数据，但整机耗电很少。恢复时计算机从内存读出数据，回到挂起前的状态，恢复速度较快。一般笔记本在电池无故障且充满的情况下可以支持这种挂起数小时甚至数天(依具体机型有差别)。其他名称：Suspend,STR(SuspendToRAM),挂起,挂起到内存休眠计算机将目前的运行状态等数据存放在硬盘上某
  • 前端面试：ajax 和 xhr 是什么关系？ returnShitBoy 前端面试ajax
    在前端开发中，AJAX（AsynchronousJavaScriptandXML）和XHR（XMLHttpRequest）是两个密切相关但有些不同的概念。以下是对这两者的详细解释及其关系：1.AJAX定义：AJAX是一个用于创建异步web应用程序的技术。它允许网页在不完全重新加载整页的情况下，与服务器交换数据并更新部分网页内容。主要特征：异步操作：AJAX使得页面可以在后台与服务器进行数据交换，用
  • 【Visual C++】游戏开发笔记三十五 站在巨人的肩膀上 游戏引擎导论 这是什么树
    本系列文章由zhmxy555（毛星云）编写，转载请注明出处。文章链接：http://blog.csdn.net/zhmxy555/article/details/8250057作者：毛星云（浅墨）邮箱：happylifemxy@163.com-------------------------------------------------------------------------------
  • 【Unity入门教程】第一章 游戏引擎基础 【中国大学MOOC游戏引擎原理及应用】 晴夏。 unity游戏开发游戏unity游戏开发unity3d
    以下均为来自中国大学mooc游戏引擎原理及应用时的学习笔记，不含商用，仅供学习交流使用，如果侵权请联系作者删除。第一章都很简单没什么好讲的，简单的介绍一下（其实是学习的时候第二章才开始记笔记）https://www.icourse163.org/course/CUC-1450317378?tid=1450731676才不会说是为了规格整齐每章都有才水了个第一章的
  • edger多组差异性分析_R语言统计分析微生物组数据 weixin_39961636 edger多组差异性分析
    我在学习这本书记了一些笔记，如果你有学习，欢迎分享你的笔记或者教程。我的已有笔记汇总如下：宏基因组学习笔记宏基因组学习笔记2宏基因组笔记(第二章)R语言宏基因组学统计分析学习笔记(第三章-1)R语言宏基因组学统计分析学习笔记(第三章-2)https://link.springer.com/book/10.1007/978-981-13-1534-3下载方法，sci-hub大法啦。出版日期：2018
  • 构建AngularJS动态Web应用的示例教程 你这人真狗
    本文还有配套的精品资源，点击获取简介：AngularJS是一个由Google支持的前端JavaScript框架，用于创建动态Web应用程序。本文将通过一个名为“angular-sample-app”的示例应用程序，详细介绍AngularJS的核心特性，包括双向数据绑定、控制器、指令系统、服务与依赖注入、表单处理、路由与导航、模板和局部存储以及其他高级特性。通过这个示例应用的深入剖析，开发者可以学习
  • C#学习笔记（3）： 调用YOLOv8 playerofIE c#学习笔记YOLOpython
    最近做的项目需要C#编写上位机程序，同时也要使用yolo进行深度学习检测。使用pythonnet调用写好的py文件，C#代码如下:Runtime.PythonDLL="python310.dll";PythonEngine.Initialize();using(Py.GIL()){dynamicsys=Py.Import("sys");dynamictorch=Py.Import("torch")
  • Java学习笔记（二十二） 路上阡陌 java学习笔记
    1Redis是单线程的那如何处理多个客户端发送的命令Redis虽然是单线程的，但它能够高效地处理多个客户端发送的命令，这主要得益于其内部使用的I/O多路复用技术和事件驱动模型。以下是Redis处理多个客户端命令的详细解释：1.1I/O多路复用技术Redis通过使用I/O多路复用技术，能够同时监听多个客户端连接上的I/O事件。当任何一个客户端连接上有读、写或异常等I/O事件发生时，I/O多路复用机制
  • Java~二叉树进阶练习题：根据先序遍历和中序遍历构建二叉树 与 根据后序遍历和中序遍历构建二叉树 Java墨言 程序员java面试算法
    《一线大厂Java面试题解析+核心总结学习笔记+最新讲解视频+实战项目源码》，点击传送门，即可获取！先序遍历中第一个一定是根结点。中序遍历中根结点左子树的所有结点一定在根结点的左边，右子树的所有结点一定在根结点的右边。所有中序遍历的序列组成可以表示为：左子树结点+根结点+右子树结点。后序遍历中最后一个结点一定是根结点。****根据先序遍历和中序遍历构建二叉树解题细想：**设置变量inedx方便从p
  • CSS语言的数论算法 宇瞳月 包罗万象golang开发语言后端
    CSS语言的数论算法引言数论作为数学的一个重要分支，主要研究整数及其性质。数论的基本问题包括素数的性质、最大公约数、最小公倍数、同余等，同时数论在密码学、计算机科学等领域具有广泛的应用。而CSS（层叠样式表）本身是一种样式表语言，用于控制HTML文档的样式和布局，虽然CSS本身并不能直接进行复杂的数论运算，但它可以和JavaScript等编程语言结合使用，实现数论算法的可视化与交互。本文将探讨数论
  • SAX解析xml文件 小猪猪08 xml
    1.创建SAXParserFactory实例 2.通过SAXParserFactory对象获取SAXParser实例 3.创建一个类SAXParserHander继续DefaultHandler，并且实例化这个类 4.SAXParser实例的parse来获取文件     public static void main(String[] args) { //
  • 为什么mysql里的ibdata1文件不断的增长？ brotherlamp linuxlinux运维linux资料linux视频linux运维自学
    我们在 Percona 支持栏目经常收到关于 MySQL 的 ibdata1 文件的这个问题。 当监控服务器发送一个关于 MySQL 服务器存储的报警时，恐慌就开始了 —— 就是说磁盘快要满了。 一番调查后你意识到大多数地盘空间被 InnoDB 的共享表空间 ibdata1 使用。而你已经启用了 innodbfileper_table，所以问题是： ibdata1存了什么？ 当你启用了 i
  • Quartz-quartz.properties配置 eksliang quartz
    其实Quartz JAR文件的org.quartz包下就包含了一个quartz.properties属性配置文件并提供了默认设置。如果需要调整默认配置，可以在类路径下建立一个新的quartz.properties，它将自动被Quartz加载并覆盖默认的设置。   下面是这些默认值的解释 #-----集群的配置 org.quartz.scheduler.instanceName =
  • informatica session的使用 18289753290 workflowsessionlogInformatica
    如果希望workflow存储最近20次的log，在session里的Config  Object设置，log  options做配置，save  session log :sessions  run  ;savesessio log for  these runs:20 session下面的source 里面有个tracing 
  • Scrapy抓取网页时出现CRC check failed 0x471e6e9a != 0x7c07b839L的错误 酷的飞上天空 scrapy
    Scrapy版本0.14.4 出现问题现象： ERROR: Error downloading <GET http://xxxxx  CRC check failed   解决方法   1.设置网络请求时的header中的属性'Accept-Encoding': '*;q=0'   明确表示不支持任何形式的压缩格式，避免程序的解压
  • java Swing小集锦 永夜-极光 java swing
    1.关闭窗体弹出确认对话框   1.1   this.setDefaultCloseOperation (JFrame.DO_NOTHING_ON_CLOSE);   1.2   this.addWindowListener ( new WindowAdapter () { public void windo
  • 强制删除.svn文件夹 随便小屋 java
              在windows上，从别处复制的项目中可能带有.svn文件夹，手动删除太麻烦，并且每个文件夹下都有。所以写了个程序进行删除。因为.svn文件夹在windows上是只读的，所以用File中的delete()和deleteOnExist()方法都不能将其删除，所以只能采用windows命令方式进行删除
  • GET和POST有什么区别？及为什么网上的多数答案都是错的。 aijuans get post
        如果有人问你，GET和POST，有什么区别？你会如何回答？ 我的经历      前几天有人问我这个问题。我说GET是用于获取数据的，POST，一般用于将数据发给服务器之用。     这个答案好像并不是他想要的。于是他继续追问有没有别的区别？我说这就是个名字而已，如果服务器支持，他完全可以把G
  • 谈谈新浪微博背后的那些算法 aoyouzi 谈谈新浪微博背后的那些算法
    本文对微博中常见的问题的对应算法进行了简单的介绍，在实际应用中的算法比介绍的要复杂的多。当然，本文覆盖的主题并不全，比如好友推荐、热点跟踪等就没有涉及到。但古人云“窥一斑而见全豹”，希望本文的介绍能帮助大家更好的理解微博这样的社交网络应用。 微博是一个很多人都在用的社交应用。天天刷微博的人每天都会进行着这样几个操作：原创、转发、回复、阅读、关注、@等。其中，前四个是针对短博文，最后的关注和@则针
  • Connection reset 连接被重置的解决方法 百合不是茶 java字符流连接被重置
    流是java的核心部分,,昨天在做android服务器连接服务器的时候出了问题,就将代码放到java中执行,结果还是一样连接被重置   被重置的代码如下;   客户端代码; package 通信软件服务器; import java.io.BufferedWriter; import java.io.OutputStream; import java.io.O
  • web.xml配置详解之filter bijian1013 javaweb.xmlfilter
    一.定义 <filter> <filter-name>encodingfilter</filter-name> <filter-class>com.my.app.EncodingFilter</filter-class> <init-param> <param-name>encoding<
  • Heritrix Bill_chen 多线程xml算法制造配置管理
    作为纯Java语言开发的、功能强大的网络爬虫Heritrix，其功能极其强大，且扩展性良好，深受热爱搜索技术的盆友们的喜爱，但它配置较为复杂，且源码不好理解，最近又使劲看了下，结合自己的学习和理解，跟大家分享Heritrix的点点滴滴。 Heritrix的下载（http://sourceforge.net/projects/archive-crawler/）安装、配置，就不罗嗦了，可以自己找找资
  • 【Zookeeper】FAQ bit1129 zookeeper
    1.脱离IDE，运行简单的Java客户端程序 #ZkClient是简单的Zookeeper~$ java -cp "./:zookeeper-3.4.6.jar:./lib/*" ZKClient    1. Zookeeper是的Watcher回调是同步操作，需要添加异步处理的代码 2. 如果Zookeeper集群跨越多个机房，那么Leader/
  • The user specified as a definer ('aaa'@'localhost') does not exist 白糖_ localhost
    今天遇到一个客户BUG，当前的jdbc连接用户是root，然后部分删除操作都会报下面这个错误：The user specified as a definer ('aaa'@'localhost') does not exist 最后找原因发现删除操作做了触发器，而触发器里面有这样一句 /*!50017 DEFINER = ''aaa@'localhost' */  原来最初
  • javascript中showModelDialog刷新父页面 bozch JavaScript刷新父页面showModalDialog
    在页面中使用showModalDialog打开模式子页面窗口的时候，如果想在子页面中操作父页面中的某个节点，可以通过如下的进行：       window.showModalDialog('url',self,‘status...’); // 首先中间参数使用self       在子页面使用w
  • 编程之美-买书折扣 bylijinnan 编程之美
    import java.util.Arrays; public class BookDiscount { /**编程之美 买书折扣 书上的贪心算法的分析很有意思，我看了半天看不懂，结果作者说，贪心算法在这个问题上是不适用的。。 下面用动态规划实现。 哈利波特这本书一共有五卷，每卷都是8欧元，如果读者一次购买不同的两卷可扣除5%的折扣，三卷10%，四卷20%，五卷
  • 关于struts2.3.4项目跨站执行脚本以及远程执行漏洞修复概要 chenbowen00 strutsWEB安全
    因为近期负责的几个银行系统软件，需要交付客户，因此客户专门请了安全公司对系统进行了安全评测，结果发现了诸如跨站执行脚本，远程执行漏洞以及弱口令等问题。 下面记录下本次解决的过程以便后续 1、首先从最简单的开始处理，服务器的弱口令问题，首先根据安全工具提供的测试描述中发现应用服务器中存在一个匿名用户，默认是不需要密码的，经过分析发现服务器使用了FTP协议， 而使用ftp协议默认会产生一个匿名用
  • [电力与暖气]煤炭燃烧与电力加温 comsci
          在宇宙中,用贝塔射线观测地球某个部分,看上去,好像一个个马蜂窝,又像珊瑚礁一样,原来是某个国家的采煤区.....       不过,这个采煤区的煤炭看来是要用完了.....那么依赖将起燃烧并取暖的城市,在极度严寒的季节中...该怎么办呢?   &nbs
  • oracle O7_DICTIONARY_ACCESSIBILITY参数 daizj oracle
    O7_DICTIONARY_ACCESSIBILITY参数控制对数据字典的访问.设置为true,如果用户被授予了如select any table等any table权限,用户即使不是dba或sysdba用户也可以访问数据字典.在9i及以上版本默认为false,8i及以前版本默认为true.如果设置为true就可能会带来安全上的一些问题.这也就为什么O7_DICTIONARY_ACCESSIBIL
  • 比较全面的MySQL优化参考 dengkane mysql
    本文整理了一些MySQL的通用优化方法，做个简单的总结分享，旨在帮助那些没有专职MySQL DBA的企业做好基本的优化工作，至于具体的SQL优化，大部分通过加适当的索引即可达到效果，更复杂的就需要具体分析了，可以参考本站的一些优化案例或者联系我，下方有我的联系方式。这是上篇。   1、硬件层相关优化   1.1、CPU相关   在服务器的BIOS设置中，可
  • C语言homework2，有一个逆序打印数字的小算法 dcj3sjt126com c
    #h1#   0、完成课堂例子 1、将一个四位数逆序打印 1234 ==> 4321 实现方法一： # include <stdio.h> int main(void) { int i = 1234; int one = i%10; int two = i / 10 % 10; int three = i / 100 % 10;
  • apacheBench对网站进行压力测试 dcj3sjt126com apachebench
       ab 的全称是 ApacheBench ， 是 Apache 附带的一个小工具 ， 专门用于 HTTP Server 的 benchmark testing ， 可以同时模拟多个并发请求。前段时间看到公司的开发人员也在用它作一些测试，看起来也不错，很简单，也很容易使用，所以今天花一点时间看了一下。 通过下面的一个简单的例子和注释，相信大家可以更容易理解这个工具的使用。
  • 2种办法让HashMap线程安全 flyfoxs javajdkjni
    多线程之--2种办法让HashMap线程安全 多线程之--synchronized 和reentrantlock的优缺点 多线程之--2种JAVA乐观锁的比较( NonfairSync VS. FairSync)     HashMap不是线程安全的,往往在写程序时需要通过一些方法来回避.其实JDK原生的提供了2种方法让HashMap支持线程安全.  
  • Spring Security（04）——认证简介 234390216 Spring Security认证过程
    认证简介 目录 1.1     认证过程 1.2     Web应用的认证过程 1.2.1    ExceptionTranslationFilter 1.2.2    在request之间共享SecurityContext   1
  • Java 位运算 Javahuhui java位运算
    // 左移( << ) 低位补0 // 0000 0000 0000 0000 0000 0000 0000 0110 然后左移2位后，低位补0： // 0000 0000 0000 0000 0000 0000 0001 1000 System.out.println(6 << 2);// 运行结果是24 // 右移( >> ) 高位补"
  • mysql免安装版配置 ldzyz007 mysql
    1、my-small.ini是为了小型数据库而设计的。不应该把这个模型用于含有一些常用项目的数据库。 2、my-medium.ini是为中等规模的数据库而设计的。如果你正在企业中使用RHEL,可能会比这个操作系统的最小RAM需求(256MB)明显多得多的物理内存。由此可见，如果有那么多RAM内存可以使用，自然可以在同一台机器上运行其它服务。 3、my-large.ini是为专用于一个SQL数据
  • MFC和ado数据库使用时遇到的问题 你不认识的休道人 sqlC++mfc
    =================================================================== 第一个 =================================================================== try{ CString sql; sql.Format("select * from p
  • 表单重复提交Double Submits rensanning double
    可能发生的场景： *多次点击提交按钮 *刷新页面 *点击浏览器回退按钮 *直接访问收藏夹中的地址 *重复发送HTTP请求（Ajax） （1）点击按钮后disable该按钮一会儿，这样能避免急躁的用户频繁点击按钮。 这种方法确实有些粗暴，友好一点的可以把按钮的文字变一下做个提示，比如Bootstrap的做法： http://getbootstrap.co
  • Java String 十大常见问题 tomcat_oracle java正则表达式
    　1.字符串比较，使用“==”还是equals()? 　　"=="判断两个引用的是不是同一个内存地址(同一个物理对象)。 　　equals()判断两个字符串的值是否相等。 　　除非你想判断两个string引用是否同一个对象，否则应该总是使用equals()方法。 　　如果你了解字符串的驻留(String Interning)则会更好地理解这个问题。 　 　
  • SpringMVC 登陆拦截器实现登陆控制 xp9802 springMVC
    思路，先登陆后，将登陆信息存储在session中，然后通过拦截器，对系统中的页面和资源进行访问拦截，同时对于登陆本身相关的页面和资源不拦截。   实现方法： 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他