lampSir
lampSir

轮播图封装成组件



"UTF-8" >
轮播图
"stylesheet" href= "css/font-awesome.min.css" >
"stylesheet" href= "css/carousel.css" >
"stylesheet" href= "css/user-index.css" >
 
 
"carousel" >
          
"other" >

首先看一下如何使用这个组件，用到了font-awesome图标库，然后调用轮播图的css，最后是用户自己的css，用户必须设置容器id以及容器宽高，否则无法正常显示。生成轮播图时给构造函数传入容器元素，以及图片地址：

下边我们看下具体实现。首先是轮播图的构造函数：

function Carousel(obj) {
     this .wrap = obj.wrap;
     this .wrapId = obj.wrap.id;              //容器的id
     this .wrapWidth = this .wrap.offsetWidth; //容器宽
     this .imgNumber = obj.urlArr.length;     //图片数
     this .activePage = 0;                    //轮播图当前页
     this .settimeID;                         //定时器id
     this .init(obj.urlArr);
}

基本思路就是在构造函数里写入轮播图的实例属性，不同的轮播图具有不同的实例属性，将其共同拥有的方法写成原型属性，原型对象的基本结构如下所示：

Carousel.prototype = {
     constructor: Carousel,                  //构造函数指向原函数
     init: function (urlArr){},               //构建DOM结构
     bindEvent: function (){},                //绑定事件
     pageActiveColor: function (){},          //绘制圆点
     leftAngleclick: function (){},           //点击左箭头
     rightAngleclick: function (){},
     selectPage: function (selectNum){},      //点击圆点定位到指定图片
     setTime: function (){},                  //自动播放
     clearTime: function (){}                 //鼠标悬浮取消自动播放
}

建立dom结构的代码如下，根据容器的id生成后代dom节点的id以及class，然后在css中使用[attribute$=value]选择器对不同轮播图使用同样的样式。而在代码中也可以根据其容器id来区分不同轮播图中的类似元素。因为要支持轮播图宽度自适应，所以采用来百分比设置后代元素宽度。

init: function (urlArr) {                //创建dom结构
     this .wrap.style.position = "relative" ;
     this .wrap.style.overflow = "hidden" ;
     this .wrap.innerHTML = '+ this .wrapId + '_pre" class="fa fa-angle-left fa-3x">+ this .wrapId + '_next" class="fa fa-angle-right fa-3x">
    + this .wrapId + '_page">
+ this .wrapId + '_container">
' ;
     let container = document.getElementById( this .wrapId + '_container' );
     let page = document.getElementById( this .wrapId + "_page" );
     for (let value of urlArr) {         //构建圆点
         container.innerHTML += '
+ this .wrapId + '_img-item">+ value + '">
' ;
         page.innerHTML += '
  • + this .wrapId + '_pagination">
    • ' ;
         }
         container.style.width = this .imgNumber + "00%" ;
         container.style.left = 0;
         for (let value of document.getElementsByClassName( this .wrapId + "_img-item" )) {
             value.style.width = 100 / this .imgNumber + "%" ;
         }
         document.getElementsByClassName( this .wrapId + "_pagination" )[ this .activePage].id = this .wrapId + "_active" ;       
         this .pageActiveColor();
         this .setTime();
         this .bindEvent();
    }

    创建的结构大体上如图下所示：#id代表用户定义的容器，生成一个#(id)_container的包裹元素，宽度是容器宽度的图片张数倍，.(id)_img-item[n]的宽度和高度都等同于容器，图片在各自的.(id)_img-item[n]里铺满。给容器定义属性position: relative，通过设置了绝对定位的#(id)_container的left值来实现轮播。

    为左右箭头以及下边的小圆点添加事件，在鼠标移入轮播图时停止自动播放，移出时设置自动播放。需要注意的是addEventListener的第二个参数必须是bind了this后的函数。因为调用环境自带的函数会使this的绑定丢失，如果不清楚this的指向的话可以看这篇文章。

    bindEvent: function () {                 //绑定事件
         let preAngle = document.getElementById( this .wrapId + "_pre" );
         let nextAngle = document.getElementById( this .wrapId + "_next" );
         let pageUl = document.getElementById( this .wrapId + "_page" );
         let pages = pageUl.getElementsByClassName( this .wrapId + "_pagination" );
         for (let key = 0; key < pages.length; key++) {
             pages[key].addEventListener( "click" , this .selectPage.bind( this , key));
             console.log(key);
         }
         this .wrap.addEventListener( "mouseenter" , this .clearTime.bind( this ));
         this .wrap.addEventListener( "mouseleave" , this .setTime.bind( this ));
         preAngle.addEventListener( "click" , this .leftAngleclick.bind( this ));
         nextAngle.addEventListener( "click" , this .rightAngleclick.bind( this ));
    }

    切换图片的基本思路就是改变实例属性中的当前页这个变量，然后根据这个变量的值对包裹元素进行定位，再使对应的小圆点变色。下边是点击左箭头触发的函数，判断如果处于边缘就跳到最后。点击右箭头和下边圆点的事件与之类似。

    leftAngleclick: function () {            //点击左箭头
             let container = document.getElementById( this .wrapId + "_container" );
             if ( this .activePage == 0) {      //判断是否到边缘
                 this .activePage = this .imgNumber - 1;
             } else {
                 this .activePage--;
             }
             container.style.left = "-" + this .activePage + "00%" ;
             this .pageActiveColor();
         }

    最后给轮播图添加自动播放功能，即利用定时器每3秒触发一次右箭头的点击事件。将返回的定时器保存到实例属性中，以便在鼠标悬停的时候停止自动轮播。

    setTime: function () {                           //自动播放
             let wrapId = this .wrapId;               //解决this绑定丢失
             this .settimeID = setInterval( function () {
                 document.getElementById(wrapId + "_next" ).click();
             } , 3000);
             console.log( "set" );
         },
    clearTime: function () {                         //鼠标悬浮取消自动播放
             let theId = this .settimeID;             //解决this绑定丢失
             console.log( "clear" );
             clearInterval(theId);       
         }

    你可能感兴趣的:(轮播图封装成组件)

    • element实现动态路由+面包屑 软件技术NINI vue案例vue.js前端
      el-breadcrumb是ElementUI组件库中的一个面包屑导航组件，它用于显示当前页面的路径，帮助用户快速理解和导航到应用的各个部分。在Vue.js项目中，如果你已经安装了ElementUI，就可以很方便地使用el-breadcrumb组件。以下是一个基本的使用示例：安装ElementUI（如果你还没有安装的话）:你可以通过npm或yarn来安装ElementUI。bash复制代码npmi
    • 瑶池防线 谜影梦蝶
      冥华虽然逃过了影梦的军队，但他是一个忠臣，他选择上报战况。败给影梦后成逃兵，高层亡尔还活着，七重天失守......随便一条，即可处死冥华。冥华自然是知道以仙界高层的习性此信一发自己必死无疑，但他还选择上报实情，因为责任。同样此信送到仙宫后，知道此事的人，大多数人都认定冥华要完了，所以上到仙界高层，下到扫大街的，包括冥华自己，全都准备好迎接冥华之死。如果仙界现在还属于两方之争的话，冥华必死无疑。然而
    • 《庄子.达生9》 钱江潮369
      【原文】孔子观于吕梁，县水三十仞，流沫四十里，鼋鼍鱼鳖之所不能游也。见一丈夫游之，以为有苦而欲死也，使弟子并流而拯之。数百步而出，被发行歌而游于塘下。孔子从而问焉，曰：“吾以子为鬼，察子则人也。请问，‘蹈水有道乎’”曰：“亡，吾无道。吾始乎故，长乎性，成乎命。与齐俱入，与汩偕出，从水之道而不为私焉。此吾所以蹈之也。”孔子曰：“何谓始乎故，长乎性，成乎命？”曰：“吾生于陵而安于陵，故也；长于水而安于
    • 水泥质量纠纷案代理词 徐宝峰律师
      贵州领航建设有限公司诉贵州纳雍隆庆乌江水泥有限公司产品质量纠纷案代理词尊敬的审判长、审判员：贵州千里律师事务所接受被告贵州纳雍隆庆乌江水泥有限公司的委托，指派我担任其诉讼代理人，参加本案的诉讼活动。下面，我结合本案事实和相关法律规定发表如下代理意见，供合议庭评议案件时参考：原告应当举证证明其遭受的损失与被告生产的水泥质量的因果关系。首先水泥是一种粉状水硬性无机胶凝材料。加水搅拌后成浆体，能在空气中
    • 今又重阳 芮峻
      今又重阳图片发自App白露成霜菊花黄，岁岁重阳，今又重阳。登高远望，君不见，那来时路上少年，青丝已染雪霜。落日一点一点西坠，谁有力量，托住使其回往。转眼缺了大半，又能怎样？江天两茫茫。给我一壶烈酒，我要敬那斜阳，看谁先醉？笑指西天红了一片，借点酒力，老夫聊发一次少年狂。老严.2019年重阳节.杭州
    • 拥有断舍离的心态，过精简生活--《断舍离》读书笔记 爱吃丸子的小樱桃
      不知不觉间房间里的东西越来越多，虽然摆放整齐，但也时常会觉得空间逼仄，令人心生烦闷。抱着断舍离的态度，我开始阅读《断舍离》这本书，希望从书中能找到一些有效的方法，帮助我实现空间、物品上的断舍离。《断舍离》是日本作家山下英子通过自己的经历、思考和实践总结而成的，整体内涵也从刚开始的私人生活哲学的“断舍离”升华成了“人生实践哲学”，接着又成为每个人都能实行的“改变人生的断舍离”，从“哲学”逐渐升华成“
    • 利用LangChain的StackExchange组件实现智能问答系统 nseejrukjhad langchainmicrosoft数据库python
      利用LangChain的StackExchange组件实现智能问答系统引言在当今的软件开发世界中，StackOverflow已经成为程序员解决问题的首选平台之一。而LangChain作为一个强大的AI应用开发框架，提供了StackExchange组件，使我们能够轻松地将StackOverflow的海量知识库集成到我们的应用中。本文将详细介绍如何使用LangChain的StackExchange组件
    • 在一台Ubuntu计算机上构建Hyperledger Fabric网络 落叶无声9 区块链超级账本Hyperledgerfabric区块链ubuntu构建hyperledgerfabric
      在一台Ubuntu计算机上构建HyperledgerFabric网络Hyperledgerfabric是一个开源的区块链应用程序平台，为开发基于区块链的应用程序提供了一个起点。当我们提到HyperledgerFabric网络时，我们指的是使用HyperledgerFabric的正在运行的系统。即使只使用最少数量的组件，部署Fabric网络也不是一件容易的事。Fabric社区创建了一个名为Cello
    • webpack图片等资源的处理 dmengmeng
      需要的loaderfile-loader（让我们可以引入这些资源文件）url-loader（其实是file-loader的二次封装）img-loader（处理图片所需要的）在没有使用任何处理图片的loader之前，比如说css中用到了背景图片，那么最后打包会报错的，因为他没办法处理图片。其实你只想能够使用图片的话。只加一个file-loader就可以，打开网页能准确看到图片。{test:/\.(p
    • CX8903：Ebike自行车仪表电源方案开发,Ebike智能仪表电源芯片 诚芯微科技 社交电子
      CX8903：电动Ebike自行车仪表电源方案开发,Ebike智能仪表电源芯片推荐。电动助力自行车EBIKE凭借其环保、健康、低噪、和便捷等特点，成为了越来越受欢迎的骑行便利交通工具。提供电动Ebike自行车仪表电源方案开发、E-BIKE电动助力自行车仪表供电电源解决方案。CX8903采用100V高压制造工艺（芯片最高耐压可到100V以上），SOP-8L贴片封装，CX8903内置100V/90mΩ
    • 2020-12-16 长寿富贵
      9：56不知今天哪位亲来说说话呀？成萌：尽尽皆是道。道道皆相同。不解呀？成萌：郁郁不得志，混混过日子。哦……说谁的呀？成萌：说自己呀……还能说谁呢？那如何办呢？成萌：回头……如何回头？成萌：回见心源。如何回见心源？成萌：不追不随诸相迁，如如不动在心田。啊？成萌：慢慢守心吧。
    • ARM驱动学习之基础小知识 JT灬新一 ARM嵌入式arm开发学习
      ARM驱动学习之基础小知识•sch原理图工程师工作内容–方案–元器件选型–采购（能不能买到，价格）–原理图（涉及到稳定性）•layout画板工程师–layout（封装、布局，布线，log）（涉及到稳定性）–焊接的一部分工作（调试阶段板子的焊接）•驱动工程师–驱动，原理图，layout三部分的交集容易发生矛盾•PCB研发流程介绍–方案，原理图(网表)–layout工程师（gerber文件）–PCB板
    • 基于CODESYS的多轴运动控制程序框架：逻辑与运动控制分离，快速开发灵活操作 GPJnCrbBdl python开发语言
      基于codesys开发的多轴运动控制程序框架，将逻辑与运动控制分离，将单轴控制封装成功能块，对该功能块的操作包含了所有的单轴控制（归零、点动、相对定位、绝对定位、设置当前位置、伺服模式切换等等）。程序框架由主程序按照状态调用分归零模式、手动模式、自动模式、故障模式，程序状态的跳转都已完成，只需要根据不同的工艺要求完成所需的动作即可。变量的声明、地址的规划都严格按照C++的标准定义，能帮助开发者快速
    • 傍晚 小罗琳
      鸟叫声在小区那边，密密稠稠，轻快而明亮，它们是归巢前互道晚安呢！金色的黄昏洋洋洒洒地飘落在房屋上，给它们镀上了一层淡淡的金边。一到黄昏，没有一个地方不是热闹的，街上的车慢慢多起来，出来散步的人也三五成群，谈笑风生。狗狗们似乎也闷坏了，撒欢地你追我赶，尽管小雨刚停，但它们的热情不减，叫着跑着，好不热闹。潮湿的空气弥漫着醉人的芬芳，楼下的杜鹃花也欣欣然张开了嘴，火红的花瓣张扬地舞动着，鲜艳欲滴，花瓣似
    • 一个历史事件和查理一世走上断头台有很大关系，这个事件是什么？ 王老师聊围棋
      今天我要讲的历史事件，查理一世被处死的始末。其实查理一世给被处死的时候，与一个事件有很大的联系。这个事件是“普莱德清洗”。提到这个事件，我们不得不提到一个人，这个人就是克伦威尔。可以说，查理一世能够走上断头台，克伦威尔有很大的功劳。为什么这么说呢。那我们就成英国内战的终结说起吧。我们都知道英国的内战是有保王党挑起来。在保王党军队一路凯歌进攻的同时。就在1645年6月14日，在纳西比荒原上进行最后的
    • ES聚合分析原理与代码实例讲解 光剑书架上的书 大厂Offer收割机面试题简历程序员读书硅基计算碳基计算认知计算生物计算深度学习神经网络大数据AIGCAGILLMJavaPython架构设计Agent程序员实现财富自由
      ES聚合分析原理与代码实例讲解1.背景介绍1.1问题的由来在大规模数据分析场景中，特别是在使用Elasticsearch（ES）进行数据存储和检索时，聚合分析成为了一个至关重要的功能。聚合分析允许用户对数据集进行细分和分组，以便深入探索数据的结构和模式。这在诸如实时监控、日志分析、业务洞察等领域具有广泛的应用。1.2研究现状目前，ES聚合分析已经成为现代大数据平台的核心组件之一。它支持多种类型的聚
    • 做好总书记心中的新青年 漂洋过海来看岐岐
      习近平总书记在党的二十大报告中强调：“广大青年要坚定不移听党话、跟党走，怀抱梦想又脚踏实地，敢想敢为又善作善成，立志做有理想、敢担当、能吃苦、肯奋斗的新时代好青年。”青年的本领要从基层一线的服务中来，主动跟群众交友，促膝长谈交心，深入基层，为民排忧解难。俗话说，事业都是拼搏出来的，但事业取得成功的前提是要有过硬的本领、足够精湛的技艺，只要肯学习，坚持学以致用，努力求得真知、锤炼本领，就一定会有所收
    • 古风原创 慕白漓
      【江南月】词:慕白漓曲:《庐州月》西厢一语惊醒梦中月光佳人为何素眉不添淡妆抚帕刺秀绵缎一缕清香南望飞雁又归西方城外又闻秋稻泛黄成殇细雨纷飞里春又归乡离家而去的你是否迷失彷徨一句诺言永记心上家书一封道尽咏平常青草才青暮色又飘扬等也难当回又何妨古拙的山水今又细水流长江南月光照耀湖旁如今的情也已不在心上十载月晃容颜覆黄问一句你今在他乡何方江南月光苏州城隍孤单的你可还记得夜凉西厢人忘你是否还在独唱却唱不出
    • JVM、JRE和 JDK：理解Java开发的三大核心组件 Y雨何时停T Javajava
      Java是一门跨平台的编程语言，它的成功离不开背后强大的运行环境与开发工具的支持。在Java的生态中，JVM（Java虚拟机）、JRE（Java运行时环境）和JDK（Java开发工具包）是三个至关重要的核心组件。本文将探讨JVM、JDK和JRE的区别，帮助你更好地理解Java的运行机制。1.JVM：Java虚拟机（JavaVirtualMachine）什么是JVM？JVM，即Java虚拟机，是Ja
    • 曼妙的盛景掩藏于岁月深处，用一颗清净心寻觅更加温馨的归宿 佳依我心
      《大鱼·海棠》中曾这样说道：“只要你的心是善良的，对错都是别人的事。无论你经历过什么，都要活成自己喜欢的模样。对于不喜欢的人和事，要勇敢地拒绝，去追求自己所爱，永远不要丢失本心，永远要保持善良。”小的时候，不懂得什么是好与坏，善与恶，只是觉得拥有笑脸的人应该都是对自己好的，却并不知道那张笑脸的背后到底隐藏着怎样的阴暗与肮脏。不过我依旧相信：人的眼睛不会骗人，每当我看到亮晶晶的双眸，总是会想到它如同
    • ARMv8 Debug __pop_ ARMv8ARM64架构linux运维
      内容来自DEN0024A_v8_architecture_PG.pdf本质ARMv8Debug是什么历史在ARMv4开始被引入,并已发展成一系列广泛的调试(debug1)和跟踪(trace)功能ARMv6和ARMv7-a新增了自托管调试(debug2)和性能评测(trace-enhance)ARMv8处理器提供硬件功能侵入式:调试工具能够对核心活动提供显著级别的控制非侵入式:以非侵入性方式收集有关
    • 大三成了分手季? 三聿鱼
      图片发自App一次玩真心话大冒险的时候，知道漂亮的A学姐原来和社团那个帅帅的学长H原来是彼此的前任。知道时还是惊讶的，知道学长H现在在准备考研，上次从湖边回学校时，他说现在很忙，所以社团那边也没有再去。他想考武汉大学，每天都是泡图书馆。后来和学姐A在假期一次一次合作后，也熟络很多，知道她也将要回老家实习，想考公务员。学姐A大学专业是英语，当时想问更多，觉得不变开口，也没再问。在那次真心话大冒险中，
    • uniapp map组件自定义markers标记点 以对_ uni-app学习记录uni-appjavascript前端
      需求是根据后端返回数据在地图上显示标记点，并且根据数据状态控制标记点颜色，标记点背景通过两张图片实现控制{{item.options.labelName}}exportdefault{data(){return{storeIndex:0,locaInfo:{longitude:120.445172,latitude:36.111387},markers:[//标点列表{id:1,//标记点idin
    • 基于STM32与Qt的自动平衡机器人：从控制到人机交互的的详细设计流程 极客小张 stm32qt机器人物联网人机交互毕业设计c语言
      一、项目概述目标和用途本项目旨在开发一款基于STM32控制的自动平衡机器人，结合步进电机和陀螺仪传感器，实现对平衡机器人的精确控制。该机器人可以用于教育、科研、娱乐等多个领域，帮助用户了解自动控制、机器人运动学等相关知识。技术栈关键词STM32单片机步进电机陀螺仪传感器AD采集电路Qt人机界面实时数据监控二、系统架构系统架构设计本项目的系统架构设计包括以下主要组件：控制单元:STM32单片机传感器
    • JAVA·一个简单的登录窗口 MortalTom java开发语言学习
      文章目录概要整体架构流程技术名词解释技术细节资源概要JavaSwing是Java基础类库的一部分，主要用于开发图形用户界面（GUI）程序整体架构流程新建项目，导入sql.jar包（链接放在了文末），编译项目并运行技术名词解释一、特点丰富的组件提供了多种可视化组件，如按钮（JButton）、文本框（JTextField）、标签（JLabel）、下拉列表（JComboBox）等，可以满足不同的界面设计
    • 《流年一曲成殇》连载47 方冷颜
      第四十七章青葱岁月宋曲殇躺在床上，看着寝室的灯已经熄灭了，在上铺的好处大概就是可以看到窗外的景。军训基地在郊区，所以自然环境特别的好，是没有受到污染的地区，晚上真的可以看到满天繁星。一轮弯月挂在天空，月光透过窗户，照在窗外的柏树上，那挺拔的柏树像守卫银河系的战士。宋晟波的舞，就像电影的回放，让她大吃一惊。生活中似乎充满着惊喜，发现，就是一种惊喜。付流年的歌究竟是什么？她好想找个有网络的地方搜一番。
    • 2021-09-10 彧瑛
      [cp]九月果香，九月菊黄，九月忽然想起，是谁在播撒着希望？九月我们收集阳光，九月我们深情歌唱，一个感动的季节，被求知的眼睛珍藏。一寸一寸的粉笔，染白您的头发，腾然而起点燃成烛，照亮别人，让后来者攀上崖顶，让后来者踏着你的双肩，送一批批学子上路。黑发积霜织日月，粉笔无言写春秋。这就是老师的一生一一人类灵魂工程师的真实写照。粉笔里飞舞着您的万千情丝，书写着您的青春岁月；教室里定格着您的音容笑貌，记录
    • 愿你无病无灾，余生由我宠你 沐眠_a1fa
      01愿你无病无灾，余生由我宠你图片来源网络，侵权联系删图曾经在书中看到这样一段话：人老了就活成‘大孩子’了，需要你像当初他拉扯你长大一样去拉扯他了。”以前没有什么感触。但是这段时间，生病后到现在，我明显感觉你就是一个‘大孩子’，我们不许，你偏要，我们说你，你也会闹脾气，就活生生像一个三岁小孩。有时候，我真的很烦，很想对您发火，但是最后还是不了了之，因为看到那样的您，我真的不知道该如何开口。在几个月
    • 信息系统安全相关概念(上) YuanDaima2048 课程笔记基础概念安全信息安全笔记
      文章总览：YuanDaiMa2048博客文章总览下篇:信息系统安全相关概念(下)信息系统安全相关概念[上]信息系统概述信息系统信息系统架构信息系统发展趋势：信息系统日趋大型化、复杂化信息系统面临的安全威胁信息系统安全架构设计--以云计算为例信息系统安全需求及安全策略自主访问控制策略DAC强制访问控制策略MAC信息系统概述信息系统用于收集、存储和处理数据以及传递信息、知识和数字产品的一组集成组件。几
    • 淘宝网优惠券，你的购物神器，你知道吗？ 氧惠超好用
      淘宝网作为中国最大的综合性网络零售平台，吸引了无数消费者的目光。在淘宝网上，我们不仅可以找到丰富多样的商品，还可以通过各种促销活动享受到购物的乐趣。其中，淘宝网优惠券就是一项备受消费者喜爱的福利。那么，淘宝网优惠券究竟有何魅力，能够让我们在购物时更加得心应手呢？淘宝网优惠券作为一种促销手段，为消费者提供了实实在在的购物优惠。无论是店铺优惠券、平台优惠券还是特定商品优惠券，都能在一定程度上降低购物成
    • linux系统服务器下jsp传参数乱码 3213213333332132 javajsplinuxwindowsxml
      在一次解决乱码问题中， 发现jsp在windows下用js原生的方法进行编码没有问题，但是到了linux下就有问题， escape,encodeURI,encodeURIComponent等都解决不了问题 但是我想了下既然原生的方法不行，我用el标签的方式对中文参数进行加密解密总该可以吧。于是用了java的java.net.URLDecoder,结果还是乱码，最后在绝望之际，用了下面的方法解决了
    • Spring 注解区别以及应用 BlueSkator spring
      1. @Autowired @Autowired是根据类型进行自动装配的。如果当Spring上下文中存在不止一个UserDao类型的bean，或者不存在UserDao类型的bean，会抛出 BeanCreationException异常，这时可以通过在该属性上再加一个@Qualifier注解来声明唯一的id解决问题。   2. @Qualifier 当spring中存在至少一个匹
    • printf和sprintf的应用 dcj3sjt126com PHPsprintfprintf
      <?php printf('b: %b <br>c: %c <br>d: %d <bf>f: %f', 80,80, 80, 80); echo '<br />'; printf('%0.2f <br>%+d <br>%0.2f <br>', 8, 8, 1235.456); printf('th
    • config.getInitParameter 171815164 parameter
      web.xml <servlet> <servlet-name>servlet1</servlet-name> <jsp-file>/index.jsp</jsp-file> <init-param> <param-name>str</param-name>
    • Ant标签详解--基础操作 g21121 ant
              Ant的一些核心概念：         build.xml：构建文件是以XML 文件来描述的，默认构建文件名为build.xml。        project：每个构建文
    • [简单]代码片段_数据合并 53873039oycg 代码
              合并规则:删除家长phone为空的记录,若一个家长对应多个孩子,保留一条家长记录,家长id修改为phone,对应关系也要修改。         代码如下:        
    • java 通信技术 云端月影 Java 远程通信技术
      在分布式服务框架中，一个最基础的问题就是远程服务是怎么通讯的，在Java领域中有很多可实现远程通讯的技术，例如：RMI、MINA、ESB、Burlap、Hessian、SOAP、EJB和JMS等，这些名词之间到底是些什么关系呢，它们背后到底是基于什么原理实现的呢，了解这些是实现分布式服务框架的基础知识，而如果在性能上有高的要求的话，那深入了解这些技术背后的机制就是必须的了，在这篇blog中我们将来
    • string与StringBuilder 性能差距到底有多大 aijuans
                之前也看过一些对string与StringBuilder的性能分析，总感觉这个应该对整体性能不会产生多大的影响，所以就一直没有关注这块！         由于学程序初期最先接触的string拼接，所以就一直没改变过自己的习惯！        
    • 今天碰到 java.util.ConcurrentModificationException 异常 antonyup_2006 java多线程工作IBM
      今天改bug，其中有个实现是要对map进行循环，然后有删除操作，代码如下： Iterator<ListItem> iter = ItemMap.keySet.iterator(); while(iter.hasNext()){ ListItem it = iter.next(); //...一些逻辑操作 ItemMap.remove(it); } 结果运行报Con
    • PL/SQL的类型和JDBC操作数据库 百合不是茶 PL/SQL表标量类型游标PL/SQL记录
      PL/SQL的标量类型:    字符,数字,时间,布尔,%type五中类型的 --标量：数据库中预定义类型的变量 --定义一个变长字符串 v_ename varchar2(10); --定义一个小数,范围 -9999.99~9999.99 v_sal number(6,2); --定义一个小数并给一个初始值为5.4 :=是pl/sql的赋值号
    • Mockito：一个强大的用于 Java 开发的模拟测试框架实例 bijian1013 mockito单元测试
      Mockito框架：         Mockito是一个基于MIT协议的开源java测试框架。         Mockito区别于其他模拟框架的地方主要是允许开发者在没有建立“预期”时验证被测系统的行为。对于mock对象的一个评价是测试系统的测
    • 精通Oracle10编程SQL(10)处理例外 bijian1013 oracle数据库plsql
      /* *处理例外 */ --例外简介 --处理例外-传递例外 declare v_ename emp.ename%TYPE; begin SELECT ename INTO v_ename FROM emp where empno=&no; dbms_output.put_line('雇员名：'||v_ename); exceptio
    • 【Java】Java执行远程机器上Linux命令 bit1129 linux命令
      Java使用ethz通过ssh2执行远程机器Linux上命令，   封装定义Linux机器的环境信息   package com.tom; import java.io.File; public class Env { private String hostaddr; //Linux机器的IP地址 private Integer po
    • java通信之Socket通信基础 白糖_ javasocket网络协议
      正处于网络环境下的两个程序，它们之间通过一个交互的连接来实现数据通信。每一个连接的通信端叫做一个Socket。一个完整的Socket通信程序应该包含以下几个步骤： ①创建Socket； ②打开连接到Socket的输入输出流； ④按照一定的协议对Socket进行读写操作； ④关闭Socket。   Socket通信分两部分：服务器端和客户端。服务器端必须优先启动，然后等待soc
    • angular.bind boyitech AngularJSangular.bindAngularJS APIbind
      angular.bind 描述：         上下文，函数以及参数动态绑定，返回值为绑定之后的函数. 其中args是可选的动态参数，self在fn中使用this调用。 使用方法：          angular.bind(se
    • java-13个坏人和13个好人站成一圈，数到7就从圈里面踢出一个来，要求把所有坏人都给踢出来，所有好人都留在圈里。请找出初始时坏人站的位置。 bylijinnan java
      import java.util.ArrayList; import java.util.List; public class KickOutBadGuys { /** * 题目：13个坏人和13个好人站成一圈，数到7就从圈里面踢出一个来，要求把所有坏人都给踢出来，所有好人都留在圈里。请找出初始时坏人站的位置。 * Maybe you can find out
    • Redis.conf配置文件及相关项说明（自查备用） Kai_Ge redis
         Redis.conf配置文件及相关项说明 # Redis configuration file example # Note on units: when memory size is needed, it is possible to specifiy # it in the usual form of 1k 5GB 4M and so forth: #
    • [强人工智能]实现大规模拓扑分析是实现强人工智能的前奏 comsci 人工智能
           真不好意思,各位朋友...博客再次更新...      节点数量太少,网络的分析和处理能力肯定不足,在面对机器人控制的需求方面,显得力不从心....      但是,节点数太多,对拓扑数据处理的要求又很高,设计目标也很高,实现起来难度颇大...
    • 记录一些常用的函数 dai_lm java
      public static String convertInputStreamToString(InputStream is) { StringBuilder result = new StringBuilder(); if (is != null) try { InputStreamReader inputReader = new InputStreamRead
    • Hadoop中小规模集群的并行计算缺陷 datamachine mapreducehadoop并行计算
      注：写这篇文章的初衷是因为Hadoop炒得有点太热，很多用户现有数据规模并不适用于Hadoop，但迫于扩容压力和去IOE（Hadoop的廉价扩展的确非常有吸引力）而尝试。尝试永远是件正确的事儿，但有时候不用太突进，可以调优或调需求，发挥现有系统的最大效用为上策。 -----------------------------------------------------------------
    • 小学4年级英语单词背诵第二课 dcj3sjt126com englishword
      egg  蛋 twenty 二十 any 任何 well 健康的，好   twelve 十二 farm 农场 every 每一个 back 向后，回   fast 快速的 whose 谁的 much 许多 flower 花   watch 手表 very 非常，很 sport 运动 Chinese 中国的  
    • 自己实践了github的webhooks, linux上面的权限需要注意 dcj3sjt126com githubwebhook
      环境, 阿里云服务器   1. 本地创建项目, push到github服务器上面   2. 生成www用户的密钥 sudo -u www ssh-keygen -t rsa -C "[email protected]"     3. 将密钥添加到github帐号的SSH_KEYS里面   3. 用www用户执行克隆, 源使
    • Java冒泡排序 蕃薯耀 冒泡排序Java冒泡排序Java排序
      冒泡排序 >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> 蕃薯耀 2015年6月23日 10:40:14 星期二 http://fanshuyao.iteye.com/
    • Excle读取数据转换为实体List【基于apache-poi】 hanqunfeng apache
      1.依赖apache-poi   2.支持xls和xlsx   3.支持按属性名称绑定数据值   4.支持从指定行、列开始读取   5.支持同时读取多个sheet   6.具体使用方式参见org.cpframework.utils.excelreader.CP_ExcelReaderUtilTest.java 比如： Str
    • 3个处于草稿阶段的Javascript API介绍 jackyrong JavaScript
      原文： http://www.sitepoint.com/3-new-javascript-apis-may-want-follow/?utm_source=html5weekly&utm_medium=email   本文中，介绍3个仍然处于草稿阶段，但应该值得关注的Javascript API. 1) Web Alarm API   &
    • 6个创建Web应用程序的高效PHP框架 lampcy Web框架PHP
      以下是创建Web应用程序的PHP框架，有coder bay网站整理推荐： 1. CakePHP CakePHP是一个PHP快速开发框架，它提供了一个用于开发、维护和部署应用程序的可扩展体系。CakePHP使用了众所周知的设计模式，如MVC和ORM，降低了开发成本，并减少了开发人员写代码的工作量。 2. CodeIgniter CodeIgniter是一个非常小且功能强大的PHP框架，适合需
    • 评"救市后中国股市新乱象泛起"谣言 nannan408
      首先来看百度百家一位易姓作者的新闻： 三个多星期来股市持续暴跌，跌得投资者及上市公司都处于极度的恐慌和焦虑中，都要寻找自保及规避风险的方式。面对股市之危机，政府突然进入市场救市，希望以此来重建市场信心，以此来扭转股市持续暴跌的预期。而政府进入市场后，由于市场运作方式发生了巨大变化，投资者及上市公司为了自保及为了应对这种变化，中国股市新的乱象也自然产生。 首先，中国股市这两天
    • 页面全屏遮罩的实现 方式 Rainbow702 htmlcss遮罩mask
      之前做了一个页面，在点击了某个按钮之后，要求页面出现一个全屏遮罩，一开始使用了position:absolute来实现的。当时因为画面大小是固定的，不可以resize的，所以，没有发现问题。 最近用了同样的做法做了一个遮罩，但是画面是可以进行resize的，所以就发现了一个问题，当画面被reisze到浏览器出现了滚动条的时候，就发现，用absolute 的做法是有问题的。后来改成fixed定位就
    • 关于angularjs的点滴 tntxia AngularJS
        angular是一个新兴的JS框架，和以往的框架不同的事，Angularjs更注重于js的建模，管理，同时也提供大量的组件帮助用户组建商业化程序，是一种值得研究的JS框架。   Angularjs使我们可以使用MVC的模式来写JS。Angularjs现在由谷歌来维护。   这里我们来简单的探讨一下它的应用。   首先使用Angularjs我
    • Nutz--->>反复新建ioc容器的后果 xiaoxiao1992428 DAOmvcIOCnutz
      问题： public class DaoZ {     public static Dao dao() { // 每当需要使用dao的时候就取一次     Ioc ioc = new NutIoc(new JsonLoader("dao.js"));     return ioc.get(
    按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他