songchunmin_
songchunmin_

纯JS实现slideToggle动画，慢慢下拉打开

没有存放页面的地方，借用别人的：http://www.zhangxinxu.com/study/201210/slide-transition-common-method.html

（1）CSS 设置动画时间，这是必须的

-webkit-transition: height 0.6s;
-moz-transition: height 0.6s;
-o-transition: height 0.6s;
transition: height 0.6s;
（2）JS设置 obj高度
 obj.style.height
（3）通过JS计算高度
 Array.prototype.slice.call(eleMore.childNodes).forEach(function(child) {
        if (child.nodeType === 1) {
            var oStyle = window.getComputedStyle(child);
            height = child.clientHeight + (parseInt(oStyle.borderTopWidth) || 0) + (parseInt(oStyle.borderBottomWidth) || 0);
        }
    });
demo：复杂代码保存htmL可以看效果
 
 
 
 
 
 
 
 
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="Content-type" name="viewport"
          content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no, width=device-width">
    <meta http-equiv="Expires" content="0">
    <meta http-equiv="Pragma" content="no-cache">
    <meta http-equiv="Cache-control" content="no-cache">
    <meta http-equiv="Cache" content="no-cache">
    <title>Title</title>
    <style>
        .box {
            width: 400px; padding: 15px;  background-color: #f0f3f9;
        }
        .container {
            height: 0; position: relative;  overflow: hidden;
            -webkit-transition: height 0.6s;
            -moz-transition: height 0.6s;
            -o-transition: height 0.6s;
            transition: height 0.6s;
        }
        .container .wrap {
            border: 20px solid #333;
        }
        :root .container .wrap {
            /* 正统slide效果 */
            position: absolute;
            bottom: 0;
        }
    </style>
</head>
<body>


HTML代码：
<p>想看美女图片？<a href="javascript:" id="button" data-rel="more">点击我</a></p>
<div id="more" class="container">
    <div class="wrap">
        <img src="http://image.zhangxinxu.com/image/study/s/s256/mm1.jpg" height="191" />
        <img src="http://image.zhangxinxu.com/image/study/s/s256/mm1.jpg" height="191" />
        <p>我就是张含韵！</p>
        <p>我就是张含韵！</p>
    </div>
</div>
<script>
    var slideToggleTrans = function(element, display) { //  display表示默认更多展开元素是显示状态还是隐藏
        element.addEventListener("click", function() {

            display = !display;

            var  eleMore = document.querySelector("#more" );

            eleMore && (eleMore.style.height = display? (function() {
                var height = 0;
                Array.prototype.slice.call(eleMore.childNodes).forEach(function(child) {
                    if (child.nodeType === 1) {
                        var oStyle = window.getComputedStyle(child);
                        height = child.clientHeight + (parseInt(oStyle.borderTopWidth) || 0) + (parseInt(oStyle.borderBottomWidth) || 0);
                    }
                });
                return height;
            })() + "px": "0px");

        });

    };

    // 应用渐进使用transition交互的slideToggle效果
    slideToggleTrans(document.getElementById("button"));

</script>


</body>
</html>
 
 
 
 
 
 
 


                            

                        

                    

                    
                    

                    
                    
                    

                

                

                    
                

            

        

    

    

        
你可能感兴趣的:(纯JS实现slideToggle动画，慢慢下拉打开)

        

            

                
    
                    
  • 铭刻于星（四十二）
                        随风至

                        
    69夜晚，绍敏同学做完功课后，看了眼房外，没听到动静才敢从书包的夹层里拿出那个心形纸团。折痕压得很深，都有些旧了，想来是已经写好很久了。绍敏同学慢慢地、轻轻地捏开折叠处，待到全部拆开后，又反复抚平纸张，然后仔细地一字字默看。只是开头的三个字是第一次看到，让她心漏跳了几拍。“亲爱的绍敏：从四年级的时候，我就喜欢你了，但是我一直不敢说，怕影响你学习。六年级的时候听说有人跟你表白，你接受了，我很难过，但
    
                    
    • 
                    
  • element实现动态路由+面包屑
                        软件技术NINI
vue案例vue.js前端
                        
    el-breadcrumb是ElementUI组件库中的一个面包屑导航组件，它用于显示当前页面的路径，帮助用户快速理解和导航到应用的各个部分。在Vue.js项目中，如果你已经安装了ElementUI，就可以很方便地使用el-breadcrumb组件。以下是一个基本的使用示例：安装ElementUI（如果你还没有安装的话）:你可以通过npm或yarn来安装ElementUI。bash复制代码npmi
    
                    
    • 
                    
  • 微服务下功能权限与数据权限的设计与实现
                        nbsaas-boot
微服务java架构
                        
    在微服务架构下，系统的功能权限和数据权限控制显得尤为重要。随着系统规模的扩大和微服务数量的增加，如何保证不同用户和服务之间的访问权限准确、细粒度地控制，成为设计安全策略的关键。本文将讨论如何在微服务体系中设计和实现功能权限与数据权限控制。1.功能权限与数据权限的定义功能权限：指用户或系统角色对特定功能的访问权限。通常是某个用户角色能否执行某个操作，比如查看订单、创建订单、修改用户资料等。数据权限：
    
                    
    • 
                    
  • 2021年12月19日，春蕾教育集团团建活动感受——黄晓丹
                        黄错错加油

                        
    感受:1.从陌生到熟悉的过程。游戏环节让我们在轻松的氛围中得到了锻炼，也增长了不少知识。2.游戏过程中，我们贡献的是个人力量，展现的是团队的力量。它磨合的往往不止是工作的熟悉，更是观念上契合度的贴近。3.这和工作是一样的道理。在各自的岗位上，每个人摆正自己的位置、各司其职充分发挥才能，并团结一致劲往一处使，才能实现最大的成功。新知:1.团队精神需要不断地创新。过去，人们把创新看作是冒风险，现在人们
    
                    
    • 
                    
  • 店群合一模式下的社区团购新发展——结合链动 2+1 模式、AI 智能名片与 S2B2C 商城小程序源码
                        说私域
人工智能小程序
                        
    摘要：本文探讨了店群合一的社区团购平台在当今商业环境中的重要性和优势。通过分析店群合一模式如何将互联网社群与线下终端紧密结合，阐述了链动2+1模式、AI智能名片和S2B2C商城小程序源码在这一模式中的应用价值。这些创新元素的结合为社区团购带来了新的机遇，提升了用户信任感、拓展了营销渠道，并实现了线上线下的完美融合。一、引言随着互联网技术的不断发展，社区团购作为一种新兴的商业模式，在满足消费者日常需
    
                    
    • 
                    
  • 消息中间件有哪些常见类型
                        xmh-sxh-1314
java
                        
    消息中间件根据其设计理念和用途，可以大致分为以下几种常见类型：点对点消息队列（Point-to-PointMessagingQueues）：在这种模型中，消息被发送到特定的队列中，消费者从队列中取出并处理消息。队列中的消息只能被一个消费者消费，消费后即被删除。常见的实现包括IBM的MQSeries、RabbitMQ的部分使用场景等。适用于任务分发、负载均衡等场景。发布/订阅消息模型（Pub/Sub
    
                    
    • 
                    
  • 第一场雪
                        岁月静好_nx

                        
    早晨起来，外面白茫茫的一片，总算是下雪了，这还是今年第一场雪呢！走在路上，踩着雪“咯吱咯吱”的，空气很湿润。树上、草坪上、屋顶上都落了白白的一层，天上还零星漂着几点雪。慢慢走在路上，呼吸着清新的空气，感受着冬天的美好，心情也好多了。
    
                    
    • 
                    
  • C#中使用split分割字符串
                        互联网打工人no1
c#
                        
    1、用字符串分隔：usingSystem.Text.RegularExpressions;stringstr="aaajsbbbjsccc";string[]sArray=Regex.Split(str,"js",RegexOptions.IgnoreCase);foreach(stringiinsArray)Response.Write(i.ToString()+"");输出结果：aaabbbc
    
                    
    • 
                    
  • 腾讯云技术深度探索：构建高效云原生微服务架构
                        我的运维人生
云原生架构腾讯云运维开发技术共享
                        
    腾讯云技术深度探索：构建高效云原生微服务架构在当今快速发展的技术环境中，云原生技术已成为企业数字化转型的关键驱动力。腾讯云作为行业领先的云服务提供商，不断推出创新的产品和技术，助力企业构建高效、可扩展的云原生微服务架构。本文将深入探讨腾讯云在微服务领域的最新进展，并通过一个实际案例展示如何在腾讯云平台上构建云原生应用。腾讯云微服务架构概览腾讯云微服务架构基于云原生理念，旨在帮助企业快速实现应用的容
    
                    
    • 
                    
  • linux sdl windows.h,Windows下的SDL安装
                        奔跑吧linux内核
linuxsdlwindows.h
                        
    首先你要下载并安装SDL开发包。如果装在C盘下，路径为C:\SDL1.2.5如果在WINDOWS下。你可以按以下步骤：1.打开VC++，点击"Tools",Options2,点击directories选项3.选择"Includefiles"增加一个新的路径。"C:\SDL1.2.5\include"4，现在选择"Libaryfiles“增加"C:\SDL1.2.5\lib"现在你可以开始编写你的第
    
                    
    • 
                    
  • Google earth studio 简介
                        陟彼高冈yu
旅游
                        
    GoogleEarthStudio是一个基于Web的动画工具，专为创作使用GoogleEarth数据的动画和视频而设计。它利用了GoogleEarth强大的三维地图和卫星影像数据库，使用户能够轻松地创建逼真的地球动画、航拍视频和动态地图可视化。网址为https://www.google.com/earth/studio/。GoogleEarthStudio是一个基于Web的动画工具，专为创作使用G
    
                    
    • 
                    
  • 今日囧事
                        唯愿岁月可回首

                        
    今天晚上，房东打来电话说晚上过来取个东西。晚上到家后，洗了一下水果，把卧室的空调打开，在卧室的阳台叠衣服。不一会儿，听见了敲门声，老公和丫头出去开门，果然是房东来了。由于我在叠衣服，床上比较乱，老公随手就把卧室门带上了。我赶紧把衣服收在柜子里，一拧门，好吧，打不开。听见外面热热闹闹的，我喊老公帮我开门，开了几次都开不开。丫头说：妈妈，你先在里面休息一会，我们正在找钥匙。听见外面房东拿了自己东西，老
    
                    
    • 
                    
  • 将cmd中命令输出保存为txt文本文件
                        落难Coder
Windowscmdwindow
                        
    最近深度学习本地的训练中我们常常要在命令行中运行自己的代码，无可厚非，我们有必要保存我们的炼丹结果，但是复制命令行输出到txt是非常麻烦的，其实Windows下的命令行为我们提供了相应的操作。其基本的调用格式就是：运行指令>输出到的文件名称或者具体保存路径测试下，我打开cmd并且ping一下百度：pingwww.baidu.com>./data.txt看下相同目录下data.txt的输出：如果你再
    
                    
    • 
                    
  • 下载github patch到本地
                        小米人er
我的博客gitpatch
                        
    以下是几种从GitHub上下载以.patch结尾的补丁文件的方法：通过浏览器直接下载打开包含该.patch文件的GitHub仓库。在仓库的文件列表中找到对应的.patch文件。点击该文件，浏览器会显示文件的内容，在页面的右上角通常会有一个“Raw”按钮，点击它可以获取原始文件内容。然后在浏览器中使用快捷键（如Ctrl+S或者Command+S）将原始文件保存到本地，选择保存的文件名并确保后缀为.p
    
                    
    • 
                    
  • 拥有断舍离的心态，过精简生活--《断舍离》读书笔记
                        爱吃丸子的小樱桃

                        
    不知不觉间房间里的东西越来越多，虽然摆放整齐，但也时常会觉得空间逼仄，令人心生烦闷。抱着断舍离的态度，我开始阅读《断舍离》这本书，希望从书中能找到一些有效的方法，帮助我实现空间、物品上的断舍离。《断舍离》是日本作家山下英子通过自己的经历、思考和实践总结而成的，整体内涵也从刚开始的私人生活哲学的“断舍离”升华成了“人生实践哲学”，接着又成为每个人都能实行的“改变人生的断舍离”，从“哲学”逐渐升华成“
    
                    
    • 
                    
  • 【华为OD机试真题2023B卷 JAVA&JS】We Are A Team
                        若博豆
java算法华为javascript
                        
    华为OD2023（B卷）机试题库全覆盖，刷题指南点这里WeAreATeam时间限制：1秒|内存限制：32768K|语言限制：不限题目描述：总共有n个人在机房，每个人有一个标号（1<=标号<=n），他们分成了多个团队，需要你根据收到的m条消息判定指定的两个人是否在一个团队中，具体的：1、消息构成为：abc，整数a、b分别代
    
                    
    • 
                    
  • 从0到500+，我是如何利用自媒体赚钱？
                        一列脚印

                        
    运营公众号半个多月，从零基础的小白到现在慢慢懂了一些运营的知识。做好公众号是很不容易的，要做很多事情；排版、码字、引流…通通需要自己解决，业余时间全都花费在这上面涨这么多粉丝是真的不容易，对比知乎大佬来说，我们这种没资源，没人脉，还没钱的小透明来说，想要一个月涨粉上万，怕是今天没睡醒（不过你有的方法，算我piapia打脸）至少我是清醒的，自己慢慢努力，实现我的万粉目标！大家快来围观、支持我吧！孩子
    
                    
    • 
                    
  • 使用LLaVa和Ollama实现多模态RAG示例
                        llzwxh888
python人工智能开发语言
                        
    本文将详细介绍如何使用LLaVa和Ollama实现多模态RAG（检索增强生成），通过提取图像中的结构化数据、生成图像字幕等功能来展示这一技术的强大之处。安装环境首先，您需要安装以下依赖包：!pipinstallllama-index-multi-modal-llms-ollama!pipinstallllama-index-readers-file!pipinstallunstructured!p
    
                    
    • 
                    
  • 利用LangChain的StackExchange组件实现智能问答系统
                        nseejrukjhad
langchainmicrosoft数据库python
                        
    利用LangChain的StackExchange组件实现智能问答系统引言在当今的软件开发世界中，StackOverflow已经成为程序员解决问题的首选平台之一。而LangChain作为一个强大的AI应用开发框架，提供了StackExchange组件，使我们能够轻松地将StackOverflow的海量知识库集成到我们的应用中。本文将详细介绍如何使用LangChain的StackExchange组件
    
                    
    • 
                    
  • 数组去重
                        好奇的猫猫猫

                        
    整理自js中基础数据结构数组去重问题思考？如何去除数组中重复的项例如数组：[1,3,4,3,5]我们在做去重的时候，一开始想到的肯定是，逐个比较，外面一层循环，内层后一个与前一个一比较，如果是久不将当前这一项放进新的数组，挨个比较完之后返回一个新的去过重复的数组不好的实践方式上述方法效率极低，代码量还多，思考？有没有更好的方法这时候不禁一想当然有了！！！hashtable啊，通过对象的hash办法
    
                    
    • 
                    
  • 勇士赢了，我把掌声给了骑士
                        复角度的生活

                        
    今天，不参加高考，只看NBA总决赛第三场的较量。这么说有点得罪高考生了，不过我没有当他们面秀，也没有跑到考点外面得瑟，所以我内心毫无波澜。毫无疑问，考场里不乏骑士和勇士球迷，在紧张作答语文考卷同时还心系着球队，不过我希望今天的比赛不会让你们有所分心，毕竟高考不会像比赛录像那样可以再来。今天，好像起来赶考一样，我起得很早，然而事实是睡不着，挺郁闷的，又不是我高考，我紧张什么？九点我并没有准时打开浏览
    
                    
    • 
                    
  • 【JS】执行时长(100分) |思路参考+代码解析（C++）
                        l939035548
JS算法数据结构c++
                        
    题目为了充分发挥GPU算力，需要尽可能多的将任务交给GPU执行，现在有一个任务数组，数组元素表示在这1秒内新增的任务个数且每秒都有新增任务。假设GPU最多一次执行n个任务，一次执行耗时1秒，在保证GPU不空闲情况下，最少需要多长时间执行完成。题目输入第一个参数为GPU一次最多执行的任务个数，取值范围[1,10000]第二个参数为任务数组长度，取值范围[1,10000]第三个参数为任务数组，数字范围
    
                    
    • 
                    
  • 大伟说成语之唉声叹气
                        求索大伟

                        
    ＊大伟说成语＊【唉声叹气】叹气：因心里不痛快或不如意而吐出长气，发出声音。因为痛苦、憋闷或感伤而发出叹息的声音。【大伟说】情绪外露，非人类所特有，动物亦有情绪，悲哀和欢乐所表示的情绪亦是不一样的，会嗷嗷大叫也会低吟痛哭。不同的是，人类的情绪更复杂，更多样，更丰富。唉声叹气，可以说是最基础的情绪，因为无奈而举足无措，不知该如何如何化解，只有独自一人慢慢承受，长吁短叹不知如何是好，其实是无能无力的表现
    
                    
    • 
                    
  • MongoDB Oplog 窗口
                        喝醉酒的小白
MongoDB运维
                        
    在MongoDB中，oplog（操作日志）是一个特殊的日志系统，用于记录对数据库的所有写操作。oplog允许副本集成员（通常是从节点）应用主节点上已经执行的操作，从而保持数据的一致性。它是MongoDB副本集实现数据复制的基础。MongoDBOplog窗口oplog窗口是指在MongoDB副本集中，从节点可以用来同步数据的时间范围。这个窗口通常由以下因素决定：Oplog大小：oplog的大小是有限
    
                    
    • 
                    
  • webpack图片等资源的处理
                        dmengmeng

                        
    需要的loaderfile-loader（让我们可以引入这些资源文件）url-loader（其实是file-loader的二次封装）img-loader（处理图片所需要的）在没有使用任何处理图片的loader之前，比如说css中用到了背景图片，那么最后打包会报错的，因为他没办法处理图片。其实你只想能够使用图片的话。只加一个file-loader就可以，打开网页能准确看到图片。{test:/\.(p
    
                    
    • 
                    
  • Faiss Tips：高效向量搜索与聚类的利器
                        焦习娜Samantha

                        
    FaissTips：高效向量搜索与聚类的利器faiss_tipsSomeusefultipsforfaiss项目地址:https://gitcode.com/gh_mirrors/fa/faiss_tips项目介绍Faiss是由FacebookAIResearch开发的一个用于高效相似性搜索和密集向量聚类的库。它支持多种硬件平台，包括CPU和GPU，能够在海量数据集上实现快速的近似最近邻搜索（AN
    
                    
    • 
                    
  • 没有邀请码怎么注册买手妈妈?
                        氧惠评测

                        
    买手妈妈怎么注册小编为大家带来买手妈妈没有邀请码怎么注册。打开买手妈妈APP，点击“马上注册”，输入邀请信息“邀请码”点击下一步，没有邀请码是登录不上的，所以这个必须要填写，那我们没有怎么办？填写成功就可以登录下一步。这里面有手机登录和淘宝登录，手机登录以后也需要用淘宝授权的，所以基本上都是淘宝登录。购物、看电影、点外卖、用氧惠APP！更优惠！氧惠（全网优惠上氧惠）——是与以往完全不同的抖客+淘客
    
                    
    • 
                    
  • node.js学习
                        小猿L
node.jsnode.js学习vim
                        
    node.js学习实操及笔记温故node.js，node.js学习实操过程及笔记~node.js学习视频node.js官网node.js中文网实操笔记githubcsdn笔记为什么学node.js可以让别人访问我们编写的网页为后续的框架学习打下基础，三大框架vuereactangular离不开node.jsnode.js是什么官网：node.js是一个开源的、跨平台的运行JavaScript的运行
    
                    
    • 
                    
  • Python 实现图片裁剪（附代码） | Python工具
                        剑客阿良_ALiang

                        
    前言本文提供将图片按照自定义尺寸进行裁剪的工具方法，一如既往的实用主义。环境依赖ffmpeg环境安装，可以参考我的另一篇文章：windowsffmpeg安装部署_阿良的博客-CSDN博客本文主要使用到的不是ffmpeg，而是ffprobe也在上面这篇文章中的zip包中。ffmpy安装：pipinstallffmpy-ihttps://pypi.douban.com/simple代码不废话了，上代码
    
                    
    • 
                    
  • 2020-12-16
                        长寿富贵

                        
    9：56不知今天哪位亲来说说话呀？成萌：尽尽皆是道。道道皆相同。不解呀？成萌：郁郁不得志，混混过日子。哦……说谁的呀？成萌：说自己呀……还能说谁呢？那如何办呢？成萌：回头……如何回头？成萌：回见心源。如何回见心源？成萌：不追不随诸相迁，如如不动在心田。啊？成萌：慢慢守心吧。
    
                    
    • 
                                
  • SQL的各种连接查询
                                    xieke90
UNION ALLUNION外连接内连接JOIN
                                    
    一、内连接 
  概念：内连接就是使用比较运算符根据每个表共有的列的值匹配两个表中的行。 
                内连接（join 或者inner join ） 
      SQL语法： 
      select * fron
    
                                
    • 
                                
  • java编程思想--复用类
                                    百合不是茶
java继承代理组合final类
                                    
          复用类看着标题都不知道是什么,再加上java编程思想翻译的比价难懂,所以知道现在才看这本软件界的奇书 
  
一:组合语法:就是将对象的引用放到新类中即可 
    代码: 
    
package com.wj.reuse;

/**
 * 
 * @author Administrator 组
    
                                
    • 
                                
  • [开源与生态系统]国产CPU的生态系统
                                    comsci
cpu
                                    
     
 
      计算机要从娃娃抓起...而孩子最喜欢玩游戏.... 
 
      要让国产CPU在国内市场形成自己的生态系统和产业链,国家和企业就不能够忘记游戏这个非常关键的环节.... 
 
      投入一些资金和资源,人力和政策,让游
    
                                
    • 
                                
  • JVM内存区域划分Eden Space、Survivor Space、Tenured Gen，Perm Gen解释
                                    商人shang
jvm内存
                                    
    jvm区域总体分两类，heap区和非heap区。heap区又分：Eden Space（伊甸园）、Survivor Space(幸存者区)、Tenured Gen（老年代-养老区）。 非heap区又分：Code Cache(代码缓存区)、Perm Gen（永久代）、Jvm Stack(java虚拟机栈)、Local Method Statck(本地方法栈)。 
HotSpot虚拟机GC算法采用分代收
    
                                
    • 
                                
  • 页面上调用 QQ
                                    oloz
qq
                                    
    <A href="tencent://message/?uin=707321921&amp;Site=有事Q我&amp;Menu=yes">   
<img style="border:0px;" src=http://wpa.qq.com/pa?p=1:707321921:1></a>
    
                                
    • 
                                
  • 一些问题
                                    文强chu
问题
                                    
    1.eclipse 导出 doc  出现“The Javadoc command does not exist.” javadoc command 选择 jdk/bin/javadoc.exe 2.tomcate 配置 web 项目 ..... 
SQL:3.mysql  * 必须得放前面 否则  select&nbs
    
                                
    • 
                                
  • 生活没有安全感
                                    小桔子
生活孤独安全感
                                    
           圈子好小，身边朋友没几个，交心的更是少之又少。在深圳，除了男朋友，没几个亲密的人。不知不觉男朋友成了唯一的依靠，毫不夸张的说，业余生活的全部。现在感情好，也很幸福的。但是说不准难免人心会变嘛，不发生什么大家都乐融融，发生什么很难处理。我想说如果不幸被分手(无论原因如何)，生活难免变化很大，在深圳，我没交心的朋友。明
    
                                
    • 
                                
  • php 基础语法
                                    aichenglong
php 基本语法
                                    
    1 .1 php变量必须以$开头 
<?php 
$a=” b”; 
echo 
?> 
1 .2 php基本数据库类型 Integer  float/double Boolean string 
1 .3 复合数据类型 数组array和对象 object 
1 .4 特殊数据类型  null 资源类型(resource)    $co
    
                                
    • 
                                
  • mybatis tools 配置详解
                                    AILIKES
mybatis
                                    
    MyBatis Generator中文文档 
MyBatis Generator中文文档地址： 
 
 http://generator.sturgeon.mopaas.com/ 
 
该中文文档由于尽可能和原文内容一致，所以有些地方如果不熟悉，看中文版的文档的也会有一定的障碍，所以本章根据该中文文档以及实际应用，使用通俗的语言来讲解详细的配置。 
本文使用Markdown进行编辑，但是博客显示效
    
                                
    • 
                                
  • 继承与多态的探讨
                                    百合不是茶
JAVA面向对象 继承 对象
                                    
    继承 extends   多态 
继承是面向对象最经常使用的特征之一：继承语法是通过继承发、基类的域和方法 //继承就是从现有的类中生成一个新的类，这个新类拥有现有类的所有extends是使用继承的关键字： 
  
  
在A类中定义属性和方法； 
class A{
//定义属性
int age；
//定义方法
public void go
    
                                
    • 
                                
  • JS的undefined与null的实例
                                    bijian1013
JavaScriptJavaScript
                                    
    <form name="theform" id="theform">
</form>

<script language="javascript">
    var a
    alert(typeof(b));    //这里提示undefined
    if(theform.datas
    
                                
    • 
                                
  • TDD实践（一）
                                    bijian1013
java敏捷TDD
                                    
    一.TDD概述 
        TDD：测试驱动开发，它的基本思想就是在开发功能代码之前，先编写测试代码。也就是说在明确要开发某个功能后，首先思考如何对这个功能进行测试，并完成测试代码的编写，然后编写相关的代码满足这些测试用例。然后循环进行添加其他功能，直到完全部功能的开发。 
    
    
                                
    • 
                                
  • [Maven学习笔记十]Maven Profile与资源文件过滤器
                                    bit1129
maven
                                    
    什么是Maven Profile 
Maven Profile的含义是针对编译打包环境和编译打包目的配置定制，可以在不同的环境上选择相应的配置，例如DB信息，可以根据是为开发环境编译打包，还是为生产环境编译打包，动态的选择正确的DB配置信息 
  
Profile的激活机制 
1.Profile可以手工激活，比如在Intellij Idea的Maven Project视图中可以选择一个P
    
                                
    • 
                                
  • 【Hive八】Hive用户自定义生成表函数(UDTF)
                                    bit1129
hive
                                    
    1. 什么是UDTF 
  
UDTF，是User Defined Table-Generating Functions，一眼看上去，貌似是用户自定义生成表函数，这个生成表不应该理解为生成了一个HQL Table， 貌似更应该理解为生成了类似关系表的二维行数据集 
  2. 如何实现UDTF 
 
 继承org.apache.hadoop.hive.ql.udf.generic
    
                                
    • 
                                
  • tfs restful api 加auth 2.0认计
                                    ronin47

                                    
    　　目前思考如何给tfs的ngx-tfs api增加安全性。有如下两点： 
　　一是基于客户端的ip设置。这个比较容易实现。 
　　二是基于OAuth2.0认证，这个需要lua，实现起来相对于一来说，有些难度。 
　　现在重点介绍第二种方法实现思路。 
　　 
前言：我们使用Nginx的Lua中间件建立了OAuth2认证和授权层。如果你也有此打算，阅读下面的文档，实现自动化并获得收益。SeatGe
    
                                
    • 
                                
  • jdk环境变量配置
                                    byalias
javajdk
                                    
    进行java开发，首先要安装jdk，安装了jdk后还要进行环境变量配置： 
 
1、下载jdk（http://java.sun.com/javase/downloads/index.jsp），我下载的版本是：jdk-7u79-windows-x64.exe 
 
2、安装jdk-7u79-windows-x64.exe 
 
3、配置环境变量：右击"计算机"-->&quo
    
                                
    • 
                                
  • 《代码大全》表驱动法-Table Driven Approach-2
                                    bylijinnan
java
                                    
    package com.ljn.base;

import java.io.BufferedReader;
import java.io.FileInputStream;
import java.io.InputStreamReader;
import java.util.ArrayList;
import java.util.Collections;
import java.uti
    
                                
    • 
                                
  • SQL 数值四舍五入 小数点后保留2位
                                    chicony
四舍五入
                                    
      
1.round() 函数是四舍五入用，第一个参数是我们要被操作的数据，第二个参数是设置我们四舍五入之后小数点后显示几位。 
2.numeric 函数的2个参数，第一个表示数据长度，第二个参数表示小数点后位数。 
例如： 
　　select   cast(round(12.5,2)   as   numeric(5,2))  
    
                                
    • 
                                
  • c++运算符重载
                                    CrazyMizzz
C++
                                    
    一、加+，减-，乘*，除/ 的运算符重载 
 
Rational operator*(const Rational &x) const{ 
 return Rational(x.a * this->a); 
 } 
在这里只写乘法的，加减除的写法类似 
 
二、<<输出,>>输入的运算符重载 
     &nb
    
                                
    • 
                                
  • hive DDL语法汇总
                                    daizj
hive修改列DDL修改表
                                    
    hive DDL语法汇总 
１、对表重命名 
hive> ALTER TABLE table_name RENAME TO new_table_name; 
  
2、修改表备注 
hive> ALTER TABLE table_name SET TBLPROPERTIES ('comment' = new_comm
    
                                
    • 
                                
  • jbox使用说明
                                    dcj3sjt126com
Web
                                    
    参考网址：http://www.kudystudio.com/jbox/jbox-demo.html   jBox v2.3 beta    [ 
点击下载]  
 
技术交流QQGroup：172543951 100521167   
 
 [2011-11-11] jBox v2.3 正式版 
 - [调整&修复] IE6下有iframe或页面有active、applet控件
    
                                
    • 
                                
  • UISegmentedControl 开发笔记
                                    dcj3sjt126com

                                    
      //    typedef NS_ENUM(NSInteger, UISegmentedControlStyle) { 
    //        UISegmentedControlStylePlain,     // large plain 
  &
    
                                
    • 
                                
  • Slick生成表映射文件
                                    ekian
scala
                                    
    Scala添加SLICK进行数据库操作，需在sbt文件上添加slick-codegen包 
 
"com.typesafe.slick"    %% "slick-codegen"      % slickVersion 
因为我是连接SQL Server数据库，还需添加slick-extensions，jtds包 
 

"com.typesa
    
                                
    • 
                                
  • ES-TEST
                                    gengzg
test
                                    
    package com.MarkNum;

import java.io.IOException;
import java.util.Date;
import java.util.HashMap;
import java.util.Map;

import javax.servlet.ServletException;
import javax.servlet.annotation
    
                                
    • 
                                
  • 为何外键不再推荐使用
                                    hugh.wang
mysqlDB
                                    
    表的关联，是一种逻辑关系，并不需要进行物理上的“硬关联”，而且你所期望的关联，其实只是其数据上存在一定的联系而已，而这种联系实际上是在设计之初就定义好的固有逻辑。 
 
在业务代码中实现的时候，只要按照设计之初的这种固有关联逻辑来处理数据即可，并不需要在数据库层面进行“硬关联”，因为在数据库层面通过使用外键的方式进行“硬关联”，会带来很多额外的资源消耗来进行一致性和完整性校验，即使很多时候我们并不
    
                                
    • 
                                
  • 领域驱动设计
                                    julyflame
VODAO设计模式DTOpo
                                    
    概念： 
 
VO（View Object）：视图对象，用于展示层，它的作用是把某个指定页面（或组件）的所有数据封装起来。 
 
DTO（Data Transfer Object）：数据传输对象，这个概念来源于J2EE的设计模式，原来的目的是为了EJB的分布式应用提供粗粒度的数据实体，以减少分布式调用的次数，从而提高分布式调用的性能和降低网络负载，但在这里，我泛指用于展示层与服务层之间的数据传输对
    
                                
    • 
                                
  • 单例设计模式
                                    hm4123660
javaSingleton单例设计模式懒汉式饿汉式
                                    
           单例模式是一种常用的软件设计模式。在它的核心结构中只包含一个被称为单例类的特殊类。通过单例模式可以保证系统中一个类只有一个实例而且该实例易于外界访问，从而方便对实例个数的控制并节约系统源。如果希望在系统中某个类的对象只能存在一个，单例模式是最好的解决方案。 
     &nb
    
                                
    • 
                                
  • logback
                                    zhb8015
loglogback
                                    
    一、logback的介绍 
     Logback是由log4j创始人设计的又一个开源日志组件。logback当前分成三个模块：logback-core,logback- classic和logback-access。logback-core是其它两个模块的基础模块。logback-classic是log4j的一个 改良版本。此外logback-class
    
                                
    • 
                                
  • 整合Kafka到Spark Streaming——代码示例和挑战
                                    Stark_Summer
sparkstormzookeeperPARALLELISMprocessing
                                    
    作者Michael G. Noll是瑞士的一位工程师和研究员，效力于Verisign，是Verisign实验室的大规模数据分析基础设施（基础Hadoop）的技术主管。本文，Michael详细的演示了如何将Kafka整合到Spark Streaming中。 期间， Michael还提到了将Kafka整合到 Spark Streaming中的一些现状，非常值得阅读，虽然有一些信息在Spark 1.2版
    
                                
    • 
                                
  • spring-master-slave-commondao
                                    王新春
DAOspringdataSourceslavemaster
                                    
    互联网的web项目，都有个特点：请求的并发量高，其中请求最耗时的db操作，又是系统优化的重中之重。 
 
为此，往往搭建 db的 一主多从库的 数据库架构。作为web的DAO层，要保证针对主库进行写操作，对多个从库进行读操作。当然在一些请求中，为了避免主从复制的延迟导致的数据不一致性，部分的读操作也要到主库上。（这种需求一般通过业务垂直分开，比如下单业务的代码所部署的机器，读去应该也要从主库读取数
    
                                
    • 
                

            

        

    




    

        

            按字母分类：
            ABCDEFGHIJKLMNOPQRSTUVWXYZ其他