计划
计划

JS实现自适应宽度的Tag切换

 

效果体验：http://hovertree.com/texiao/js/3.htm

 

该效果使用纯JavaScript代码，实现TAB页切换效果，TAB标签根据内容自适应宽度，点击TAB标签切换内容页。


HTML文件代码：

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>JS实现自适应宽度的Tag切换 - HoverTree</title><base target="_blank" />
<style type="text/css">
#hovertreecon {
FONT-SIZE: 12px;
MARGIN: 0px auto;
WIDTH: 600px;
}

#hovertreecon a {font-size:14px;line-height:20px;
color:blue;text-decoration:none;}

#hovertreetags {
PADDING-RIGHT: 0px;
PADDING-LEFT: 0px;
PADDING-BOTTOM: 0px;
MARGIN: 0px 0px 0px 10px;
WIDTH: 400px;
PADDING-TOP: 0px;
HEIGHT: 23px;
}

#hovertreetags LI {
BACKGROUND: url(http://hovertree.com/texiao/js/3/tagleft.gif) no-repeat left bottom;
FLOAT: left;
MARGIN-RIGHT: 1px;
LIST-STYLE-TYPE: none;
HEIGHT: 23px;
}

#hovertreetags LI A {
PADDING-RIGHT: 10px;
PADDING-LEFT: 10px;
BACKGROUND: url(http://hovertree.com/texiao/js/3/tagright.gif) no-repeat right bottom;
FLOAT: left;
PADDING-BOTTOM: 0px;
COLOR: #999;
LINE-HEIGHT: 23px;
PADDING-TOP: 0px;
HEIGHT: 23px;
TEXT-DECORATION: none;
}

#hovertreetags LI.emptyTag {
BACKGROUND: none transparent scroll repeat 0% 0%;
WIDTH: 4px;
}

#hovertreetags LI.hovertreeSelectTag {
BACKGROUND-POSITION: left top;
MARGIN-BOTTOM: -2px;
POSITION: relative;
HEIGHT: 25px;
}

#hovertreetags LI.hovertreeSelectTag A {
BACKGROUND-POSITION: right top;
COLOR: #000;
LINE-HEIGHT: 25px;
HEIGHT: 25px;
}

#hovertreeContent {
BORDER-RIGHT: #aecbd4 1px solid;
PADDING-RIGHT: 1px;
BORDER-TOP: #aecbd4 1px solid;
PADDING-LEFT: 1px;
PADDING-BOTTOM: 1px;
BORDER-LEFT: #aecbd4 1px solid;
PADDING-TOP: 1px;
BORDER-BOTTOM: #aecbd4 1px solid;
BACKGROUND-COLOR: #fff;
}

#hovertreeContent DIV.hovertreeSelectTag {
DISPLAY: block;
}

.hovertreeTagContent {
PADDING-RIGHT: 10px;
DISPLAY: none;
PADDING-LEFT: 10px;
BACKGROUND: url(http://hovertree.com/texiao/js/3/bg.gif) repeat-x;
PADDING-BOTTOM: 10px;
WIDTH: 576px;
COLOR: #474747;
PADDING-TOP: 10px;
HEIGHT: 250px;
}
</style>
</head>
<body>
<div id="hovertreecon">
<ul id="hovertreetags">
<li>
<a onclick="hovertreeSelectTag('hovertreeTagContent0',this)"
href="javascript:void(0)">标签一</a>
</li>
<li class="hovertreeSelectTag">
<a onclick="hovertreeSelectTag('hovertreeTagContent1',this)"
href="javascript:void(0)">标签二</a>
</li>
<li>
<a onclick="hovertreeSelectTag('hovertreeTagContent2',this)"
href="javascript:void(0)">自适应宽度的标签</a>
</li>
</ul>
<div id="hovertreeContent">
<div class="hovertreeTagContent" id="hovertreeTagContent0">第一个标签的内容<br />
<ul style="list-style:none;"><li><a href="http://hovertree.com/hvtart/bjae/nh0pk7kc.htm">网页顶部定时收起广告jQuery特效</a></li><li><a href="http://hovertree.com/hvtart/bjae/g71ha4qs.htm">简洁的HTML+CSS下拉菜单</a></li><li><a href="http://hovertree.com/hvtart/bjae/009i1gl6.htm">CSS带说明信息导航菜单</a></li><li><a href="http://hovertree.com/hvtart/bjae/5w5svpu4.htm">HoverTree带说明的CSS菜单</a></li><li><a href="http://hovertree.com/hvtart/bjae/f25wc8ik.htm">DIV和LI实现表格</a></li><li><a href="http://hovertree.com/hvtart/bjae/wucpcnjm.htm">JavaScript变换表格边框颜色</a></li><li><a href="http://hovertree.com/hvtart/bjae/ae553e2f1027d0ff.htm">使用jQuery改变链接的颜色</a></li><li><a href="http://hovertree.com/hvtart/bjae/74cc61ed089a2991.htm">jQuery图片列表鼠标经过遮罩显示文字</a></li><li><a href="http://hovertree.com/hvtart/bjae/48fa7b1b3162a7a4.htm">一个简单的移动端网页</a></li><li><a href="http://hovertree.com/hvtart/bjae/7f408b3a6bf8a433.htm">jQuery突出图片列表中鼠标经过项</a></li></ul>
</div>
<div class="hovertreeTagContent hovertreeSelectTag" id="hovertreeTagContent1">第二个标签的内容<br />
<ul style="list-style:none;"><li><a href="http://hovertree.com">首页</a> <a href="http://hovertree.com/texiao/">更多特效</a> <a href="http://hovertree.com/hvtart/bjae/wokffp10.htm">原文</a> <a href="http://hovertree.com/hvtart/bjae/1cijrgj1.htm">jQuery操作select</a></li><li><a href="http://hovertree.com/hvtart/bjae/b6fd7e9e75b8773b.htm">jQ的css() 方法</a></li><li><a href="http://hovertree.com/hvtart/bjae/47ce00836ac8b662.htm">jQuery的几个特点</a></li><li><a href="http://hovertree.com/hvtart/bjae/b6f6650a1b6ce369.htm">jQuery的发展和应用</a></li><li><a href="http://hovertree.com/hvtart/bjae/a3fc809e13e1157e.htm">jquery通过HTML标签实现控件隐藏</a></li><li><a href="http://hovertree.com/hvtart/bjae/5aac47a87eb2a3c2.htm">盘点jQuery弃用的函数</a></li><li><a href="http://hovertree.com/hvtart/bjae/c5a746a2d25d43b7.htm">jQuery 属性操作 - attr() 方法</a></li><li><a href="http://hovertree.com/hvtart/bjae/e367418912caa0b8.htm">JQuery实现锚点平滑滚动</a></li><li><a href="http://hovertree.com/hvtart/bjae/e23e16b491f3cae2.htm">关于Jquery中的$.each获取各种返回类型数据的使用方法</a></li><li><a href="http://hovertree.com/hvtart/bjae/fa1cb9dc2e859da8.htm">jQuery使用的8个经验技巧</a></li></ul>
</div>
<div class="hovertreeTagContent" id="hovertreeTagContent2">第三个标签的内容
<br />
<ul style="list-style:none;"><li><a href="http://hovertree.com/hvtart/bjae/bvnsa1gk.htm">div标签嵌套浮动div标签时无法撑开外部div的解决办法</a></li><li><a href="http://hovertree.com/hvtart/bjae/kl77symv.htm">web前端开发之编写高质量代码</a></li><li><a href="http://hovertree.com/hvtart/bjae/nf4w1l0h.htm">3个有用的css小知识</a></li><li><a href="http://hovertree.com/hvtart/bjae/ia0qi2nv.htm">用CSS设置Table的细边框的最好用的方法</a></li><li><a href="http://hovertree.com/hvtart/bjae/usi4p1v9.htm">如何利用CSS中的ime-mode用来控制页面上文本框中的全角/半角输入</a></li><li><a href="http://hovertree.com/hvtart/bjae/j2w0mylg.htm">CSS选择器介绍</a></li><li><a href="http://hovertree.com/hvtart/bjae/isnqi1t4.htm"> Css中的两个重要概念：块状元素和内联元素</a></li><li><a href="http://hovertree.com/hvtart/bjae/v8e7w4u1.htm">伪类link,hover,active,visited,focus的区别</a></li><li><a href="http://hovertree.com/hvtart/bjae/alaxpy6v.htm">实例看padding与margin的区别</a></li><li><a href="http://hovertree.com/hvtart/bjae/4a41528072f21543.htm">div+css页面居中代码</a></li></ul>

</div>
</div>
</div>

<script>
function hovertreeSelectTag(showContent, selfObj) {
// 操作标签
var tag = document.getElementById("hovertreetags").getElementsByTagName("li");
var taglength = tag.length;
for (i = 0; i < taglength; i++) {
tag[i].className = "";
}
selfObj.parentNode.className = "hovertreeSelectTag";
// 操作内容
for (i = 0; j = document.getElementById("hovertreeTagContent" + i) ; i++) {
j.style.display = "none";
}
document.getElementById(showContent).style.display = "block";
}
</script>
</body>
</html>

web前端汇总：http://www.cnblogs.com/jihua/p/webfront.html

你可能感兴趣的:(JS实现自适应宽度的Tag切换)

  • oracle中的user函数,Oracle 系统变量函数用法指南 Fayyy Li oracle中的user函数
    Oracle函数多种多样，系统变量函数就是其中之一，介绍三种最常见的系统变量函数。Oracle系统变量函数：1)SYSDATE该函数返回当前的日期和时间。返回的是Oracle服务器的当前日期和时间。selectsysdatefromdual;insertintopurchasevalues(‘SmallWidget','SH',sysdate,10);insertintopurchasevalue
  • Mybatis基本使用 沉下心来学技术 mybatis
    什么是MyBatis?MyBatis是一个优秀的持久层框架，它对jdbc的操作进行了封装，使得数据库的操作不再繁琐，避免大量的代码编写，使开发人员将更多的精力放在sql语句上。MyBatis的优点简单易学：本身就很小且简单。没有任何第三方依赖，最简单安装只要两个jar文件+配置几个sql映射文件。灵活：mybatis不会对应用程序或者数据库的现有设计强加任何影响。它只是一种帮助程序，让程序开发者自
  • Spring基本使用 沉下心来学技术 springjava后端
    Spring是什么？Spring是一个开源框架，它由RodJohnson创建，于2003年发布。Spring框架的主要目标是简化Java企业级应用的开发，通过提供一组全面的解决方案，如依赖注入、控制反转（IOC）、面向切面编程（AOP）、事务管理等，使得开发者能够更加专注于业务逻辑的实现，而不是底层的细节。官网：https://spring.io/projects/spring-framework
  • Pytest项目_day01（HTTP接口） 丿罗小黑 Pytestpytesthttp网络协议
    HTTPHTTP是一个协议（服务器传输超文本到浏览器的传送协议），是基于TCP/IP通信协议来传输数据（HTML文件，图片文件，查询结果等）。访问域名例如www.baidu.com就是百度的域名，我们想要访问百度，就需要使用DNS，来将www.baidu.com域名解析为ip地址。随后客户端向服务端发起TCP请求，三次握手进行连接，三次握手如下：客户端向服务端说：你准备好了吗，我要发送请求了服务端
  • Oracle解析exp、imp及常见的问题 小董啥都不懂 Oracleoracle数据库
    前言在工作中经常需要不同数据库的导入和导出。exp和imp可以实现数据的迁移。exo会转储产生对应的二进制文件，里面包括数据的定义信息、数据内容等，即为dump文件。下面是使用exp和imp的一些场景exp和imp主要有4中模式：1）数据库模式数据库模式也就是我们说的全备，可以导出除sys之外的数据库所有的对象。如果数据量比较小的时候可以选择使用该模式。[root@cdp1~]#mkdir-p/d
  • Java创造型模式之原型模式详解 菜就多练少说 设计模式java开发语言
    设计模式是面向对象设计中的一种标准方法，用于解决常见的设计问题。原型设计模式（PrototypePattern）是23种经典设计模式之一，属于创建型模式，它允许通过复制现有对象来创建新对象，而不是通过构造函数或工厂方法来创建。这样，开发者可以在运行时通过复制原型对象来快速生成新的对象，极大地提高了程序的灵活性和性能。本文将深入讲解Java中的原型设计模式，解释其概念、使用场景、以及如何在Java中
  • oracle cdc logminer与oracle xstream 24k小善 java大数据flink
    以下为OracleCDC技术中XStream与LogMiner的核心差异解析，结合技术背景、实现原理、性能表现等维度进行系统化对比。一、技术背景与定位差异LogMiner：官方日志分析工具的非正式应用最初设计用于数据库管理员（DBA）审计和分析历史日志，非专为CDC场景优化[1][9][16]。通过解析归档日志（ArchiveLog）或在线日志（OnlineRedoLog）提取变更记录，采用轮询机
  • 高级java每日一道面试题-2025年3月06日-微服务篇[Eureka篇]-Eureka服务注册与发现是什么? java我跟你拼了 java每日一道面试题java微服务eureka
    如果有遗漏,评论区告诉我进行补充面试官:Eureka服务注册与发现是什么我回答:根据你提供的详细解析，结合之前的回答，我们可以更加全面地理解Eureka服务注册与发现机制，并补充一些关键点，特别是针对面试准备的内容。一、服务注册（ServiceRegistration）核心机制：当服务提供者启动时，它会通过EurekaClient向EurekaServer发送元数据。这些元数据包括但不限于IP地址
  • 设计模式-适配器模式 小九没绝活 设计模式设计模式适配器模式java
    适配器模式是一种结构型设计模式，用于将一个类的接口转换为客户端期望的另一个接口，使得原本不兼容的类可以协同工作。它的核心思想是通过中间层（适配器）解决接口不匹配的问题，类似于电源插头转换器。核心思想适配器模式通过以下方式实现接口的兼容：定义目标接口（Target）：客户端期望使用的接口。引入适配者类（Adaptee）：需要被适配的现有类（接口不兼容）。创建适配器类（Adapter）：将适配者的接口
  • ==操作符、equals方法和hashcode是什么？它们之前有什么区别？ 小九没绝活 Java基础java开发语言java-ee
    在Java中，==、equals()和hashCode()是用于对象比较和哈希管理的核心机制，但它们的作用和适用场景有本质区别。以下是它们的详细说明和对比：一.==操作符作用基本数据类型：比较两个变量的值是否相等对象引用：比较两个对象的内存地址是否相同（即是否指向同一个对象）特点不可重写直接基于底层内存或值进行比较示例inta=10;intb=10;System.out.println(a==b)
  • 设计模式及其分类 小九没绝活 设计模式设计模式
    什么是设计模式？设计模式是在软件设计过程中，针对特定问题场景和需求提出的一套被公认的解决方案。设计模式旨在提高代码的可读性、可维护性、可拓展性和重用性。设计模式的主要作用：提供可复用的解决方案设计模式提供了经过验证的解决方案，可以帮助开发人员更快速地解决常见的设计问题。促进代码的组织和理解设计模式规范了代码组织和结构，使代码更易理解和维护。提高代码的质量设计模式强调良好的设计原则，可以帮助开发人员
  • Oracle分析函数，窗口函数 殷乾Lakers oracle数据库
    Oracle窗口函数也叫分析函数，是系统自带的一种函数。可以对数据的结果集进行分组操作，然后对分组的数据进行分析统计，可以在每个分组的每一行中返回统计值。分析函数-定义：分析函数是Oracle专门用于解决复杂报表统计需求的功能强大的函数，它可以在数据中进行分组然后计算基于组的某种统计值，并且每一组的每一行都可以返回一个统计值。分析函数和聚合函数区别：1）普通的聚合函数用groupby分组，每个分组
  • 最新xhs旋转滑块验证码分析（含识别与轨迹算法） 吴秋霖 深耕爬虫领域算法验证码滑块验证Python
    文章目录1.写在前面2.接口分析3.验证轨迹4.算法还原【作者主页】：吴秋霖【作者介绍】：擅长爬虫与JS加密逆向分析！Python领域优质创作者、CSDN博客专家、阿里云博客专家、华为云享专家。一路走来长期坚守并致力于Python与爬虫领域研究与开发工作！【作者推荐】：对爬虫领域以及JS逆向分析感兴趣的朋友可以关注《爬虫JS逆向实战》《深耕爬虫领域》未来作者会持续更新所用到、学到、看到的技术知识！
  • C++ 预处理器 阳光向日葵向阳 c++开发语言
    预处理器是一些指令，指示编译器在实际编译之前所需完成的预处理。所有的预处理器指令都是以井号（#）开头，只有空格字符可以出现在预处理指令之前。预处理指令不是C++语句，所以它们不会以分号（;）结尾。我们已经看到，之前所有的实例中都有#include指令。这个宏用于把头文件包含到源文件中。C++还支持很多预处理指令，比如#include、#define、#if、#else、#line等，让我们一起看看
  • 设计模式 - 装饰器模式 菜鸟小码 设计模式设计模式装饰器模式java
    首先，欢迎各位来到我的博客！本文深入理解设计模式原理、应用技巧、强调实战操作，提供代码示例和解决方案，适合有一定编程基础并希望提升设计能力的开发者，帮助读者快速掌握并灵活运用设计模式。如有需要请大家订阅我的专栏【设计模式】哟！我会定期更新相关系列的文章文章目录引言一、装饰器模式的基本概念二、装饰器模式的实现1.定义组件接口2.定义具体组件3.定义装饰器4.定义具体装饰器5.客户端代码三、装饰器模式
  • 【SpringMVC】_简单示例计算器 _周游 SpringJavaEEjava-eemvcspring
    目录1.需求分析2.接口定义3.请求参数4.响应数据5.服务器代码6.前端页面代码7.运行测试为阶段性总结与应用，现将以SpringMVC项目创建一个可以实现加法的计算器为例1.需求分析加法计算器功能，对两个整数进行相加，需要客户端提供参与计算的两个数，服务器返回这两个整数计算的结果。2.接口定义（1）请求路径：cala/sum（2）请求方式：GET/POST（3）接口描述：计算两个整数相加3.请
  • 一文带大家了解RARR（Retrieve-Read-Rerank） 和 RAG（Retrieval-Augmented Generation）的区别 测试开发Kevin AI相关人工智能ai
    RARR（Retrieve-Read-Rerank）和RAG（Retrieval-AugmentedGeneration）是两种不同的检索增强生成技术，核心差异在于流程设计、优化目标及适用场景。以下从多个维度对比两者的区别：1.流程架构与核心步骤RAG（检索增强生成）流程：检索（Retrieve）：从外部知识库中检索与查询相关的文档或文本片段。生成（Generate）：将检索到的内容与原始查询拼接
  • RG-S3760应用协议配置 路星辞* 网络服务器运维
    RG-S3760应用协议配置1.dhcp服务配置提问：如何在设备上开启dhcp服务，让不同VLAN下的电脑获得相应的IP地址？回答：步骤一：配置VLAN网关IP地址，及将相关端口划入相应的VLAN中S3760#contS3760(config)#vlan2----创建VLAN2S3760(config-vlan)#exit----退回到全局配置模式下S3760(config)#vlan3----创
  • Selenium 中并行测试的重要性 测试大大怪 selenium测试工具单元测试测试用例压力测试jmeter功能测试
    随着技术的进步，测试解决方案变得更具可扩展性，加速了团队从手动测试到Selenium测试自动化的转型。但是成年人的世界，没有什么是容易的。对于许多团队来说，并行运行多个测试仍然是不可扩展的。他们倾向于遵循传统的顺序执行测试方法，但是这需要大量时间、精力。这时候，就需要一种更加高效的测试方法，来解决这些问题。并行测试并行测试是指在多个计算机或处理器上同时运行测试用例，以提高测试效率和准确性的测试方法
  • 使用 DeepSeek-R1 为 RAG 运行本地 Gradio 应用程序 呱牛 do IT 人工智能deepseek
    让我们使用Gradio构建一个简单的演示应用程序，以使用DeepSeek-R1查询和分析文档。第1步：先决条件在深入研究实现之前，我们确保已安装以下工具和库：Python3.8+Python3.8+版Langchain：用于构建由大型语言模型（）LLMs提供支持的应用程序的框架，支持轻松检索、推理和工具集成Chromadb：一个高性能的向量数据库，专为高效的相似性搜索和嵌入存储而设计。Gradio
  • 2024年第十五届蓝桥杯大赛软件类省赛C/C++大学B组真题——好数 小黄Calm 蓝桥杯c语言c++
    题目：一个整数如果按从低位到高位的顺序，奇数位（个位、百位、万位···）上的数字是奇数，偶数位（十位、千位、十万位···）上的数字是偶数，我们就称之为“好数”。给定一个正整数N，请计算从1到N一共有多少个好数。由于题目中最高只有七位数，可以通过多少位数来分别判断：#includeintmain(){intnum1,count=0,n=0;scanf("%d",&num1);for(intnum=1
  • 大语言模型的训练数据清洗策略 gs80140 AIpython
    目录大语言模型的训练数据清洗策略1.数据去重与标准化问题解决方案示例代码（Python实现数据去重）：2.过滤有害内容问题解决方案示例代码（基于关键词过滤有害内容）：3.纠正数据不均衡问题解决方案示例代码（欠采样非均衡数据）：4.识别和纠正刻板印象问题解决方案示例代码（简单的数据增强）：5.处理低质量与无关数据问题解决方案示例代码（去除HTML标签）：6.处理时效性数据问题解决方案示例代码（基于时
  • 最大公因数与最小公倍数的关系（公式推导） Geometry Fu 最大公因数最小公倍数
    最大公因数与最小公倍数公式概览a,ba,ba,b的最小公倍数lcm(a,b)lcm(a,b)lcm(a,b)a,ba,ba,b的最大公因数gcd(a,b)gcd(a,b)gcd(a,b)a,b,ca,b,ca,b,c的最小公倍数lcm(lcm(a,b),c)lcm(lcm(a,b),c)lcm(lcm(a,b),c)（二者先求最小公倍数，结果与第三个数求最小公倍数）a,b,ca,b,ca,b,c的
  • 宝石组合 第十五届蓝桥杯大赛软件赛省赛C/C++ 大学 B 组 Geometry Fu 蓝桥杯蓝桥杯c语言c++
    宝石组合题目来源第十五届蓝桥杯大赛软件赛省赛C/C++大学B组原题链接蓝桥杯宝石组合https://www.lanqiao.cn/problems/19711/learning/问题描述P10426[蓝桥杯2024省B]宝石组合题目描述在一个神秘的森林里，住着一个小精灵名叫小蓝。有一天，他偶然发现了一个隐藏在树洞里的宝藏，里面装满了闪烁着美丽光芒的宝石。这些宝石都有着不同的颜色和形状，但最引人注目
  • spring（三）AOP、spring声明式事务、Webflux的执行流程和核心API ·小脑斧· springjavaspringaop
    AOP切面编程什么是AOP  AOP是面向切面编程。全称：AspectOrientedProgramming  面向切面编程指的是：程序是运行期间，动态地将某段代码插入到原来方法代码的某些位置中。这就叫面向切面编程。一个简单计算数功能加日记  准备计算器相关类计算接口publicinterfaceCalculate{publicintadd(intnum1,intnum2);publicintmu
  • Spring Boot Starter 设计原理与实战：打造企业级自定义启动器 fanxbl957 Webspringboot后端java
    博主介绍：Java、Python、js全栈开发“多面手”，精通多种编程语言和技术，痴迷于人工智能领域。秉持着对技术的热爱与执着，持续探索创新，愿在此分享交流和学习，与大家共进步。全栈开发环境搭建运行攻略：多语言一站式指南(环境搭建+运行+调试+发布+保姆级详解)感兴趣的可以先收藏起来，希望帮助更多的人SpringBootStarter设计原理与实战：打造企业级自定义启动器一、引言在当今的企业级Ja
  • 【ChatGPT】如何选择不同版本的Java 南天归鴻 java
    下面提供一份综合多方专业平台（如Oracle、InfoWorld、DZone、AdoptOpenJDK、RedHat等）信息整理的Java版本推荐报告，数据截止至2025年3月18日。下文将对“最新版本”、“稳定的最新版本”、“最稳定的版本”以及“市面上最常用的版本”进行详细对比，并从版本特性、优势、劣势、学习/实验需求、企业生产需求、兼容性与安全性等角度进行分析，供各类用户参考。一、背景说明Ja
  • Java JDK代理、CGLIB、AspectJ代理分析比较 骚年编程去 JAVA之美springjavaaop动态代理ASPECTJ
    前言什么是代理,在DesignpatternsInjava这个本书中是这样描述的，简单的说就是为某个对象提供一个代理，以控制对这个对象的访问。在不修改源代码的基础上做方法增强,代理是一种设计模式，又简单的分为两种。静态代理:代理类和委托类在代码运行前关系就确定了,也就是说在代理类的代码一开始就已经存在了。动态代理:动态代理类的字节码在程序运行时的时候生成。静态代理先来看一个静态代理的例子，Calc
  • 有关骑手跑单分段统计 TracyLi2019 mysql数据库
    MYSQL骑手跑单分段统计需求统计24年各月，在固定配送团队的，不同订单距离的骑手跑单量*根据月份和骑手id作为分类SELECTYEAR(date)AS年份,MONTH(date)AS月份,team_nameAS配送团队,rider_idAS骑手id,rider_nameAS骑手姓名,
  • 用VSCode做前端开发 北子ALF 杂谈vscodeide编辑器
    vscode写前端和记markdown还是很好用的，虽然在C++,Java和Python大型项目开发的体验不如vs,idea和pycharm自动生成html骨架打个感叹号预览网页：liveserver插件
  • 统一思想认识 永夜-极光 思想
    1.统一思想认识的基础,才能有的放矢  原因:    总有一种描述事物的方式最贴近本质,最容易让人理解.    如何让教育更轻松,在于找到最适合学生的方式.          难点在于,如何模拟对方的思维基础选择合适的方式.   &
  • Joda Time使用笔记 bylijinnan javajoda time
    Joda Time的介绍可以参考这篇文章： http://www.ibm.com/developerworks/cn/java/j-jodatime.html 工作中也常常用到Joda Time，为了避免每次使用都查API，记录一下常用的用法：     /** * DateTime变化（增减） */ @Tes
  • FileUtils API eksliang FileUtilsFileUtils API
    转载请出自出处：http://eksliang.iteye.com/blog/2217374 一、概述 这是一个Java操作文件的常用库，是Apache对java的IO包的封装，这里面有两个非常核心的类FilenameUtils跟FileUtils，其中FilenameUtils是对文件名操作的封装;FileUtils是文件封装，开发中对文件的操作，几乎都可以在这个框架里面找到。 非常的好用。
  • 各种新兴技术 不懂事的小屁孩 技术
    1:gradle Gradle 是以 Groovy 语言为基础，面向Java应用为主。基于DSL（领域特定语言）语法的自动化构建工具。 现在构建系统常用到maven工具，现在有更容易上手的gradle， 搭建java环境: http://www.ibm.com/developerworks/cn/opensource/os-cn-gradle/ 搭建android环境： http://m
  • tomcat6的https双向认证 酷的飞上天空 tomcat6
    1.生成服务器端证书 keytool -genkey -keyalg RSA -dname "cn=localhost,ou=sango,o=none,l=china,st=beijing,c=cn" -alias server -keypass password -keystore server.jks -storepass password -validity 36
  • 托管虚拟桌面市场势不可挡 蓝儿唯美
    用户还需要冗余的数据中心，dinCloud的高级副总裁兼首席营销官Ali Din指出。该公司转售一个MSP可以让用户登录并管理和提供服务的用于DaaS的云自动化控制台，提供服务或者MSP也可以自己来控制。 在某些情况下，MSP会在dinCloud的云服务上进行服务分层，如监控和补丁管理。 MSP的利润空间将根据其参与的程度而有所不同，Din说。 “我们有一些合作伙伴负责将我们推荐给客户作为个
  • spring学习——xml文件的配置 a-john spring
    在Spring的学习中，对于其xml文件的配置是必不可少的。在Spring的多种装配Bean的方式中，采用XML配置也是最常见的。以下是一个简单的XML配置文件： <?xml version="1.0" encoding="UTF-8"?> <beans xmlns="http://www.springframework.or
  • HDU 4342 History repeat itself 模拟 aijuans 模拟
    来源：http://acm.hdu.edu.cn/showproblem.php?pid=4342 题意：首先让求第几个非平方数，然后求从1到该数之间的每个sqrt(i)的下取整的和。 思路：一个简单的模拟题目，但是由于数据范围大，需要用__int64。我们可以首先把平方数筛选出来，假如让求第n个非平方数的话，看n前面有多少个平方数，假设有x个，则第n个非平方数就是n+x。注意两种特殊情况，即
  • java中最常用jar包的用途 asia007 java
    java中最常用jar包的用途 jar包用途axis.jarSOAP引擎包commons-discovery-0.2.jar用来发现、查找和实现可插入式接口，提供一些一般类实例化、单件的生命周期管理的常用方法.jaxrpc.jarAxis运行所需要的组件包saaj.jar创建到端点的点到点连接的方法、创建并处理SOAP消息和附件的方法，以及接收和处理SOAP错误的方法.  w
  • ajax获取Struts框架中的json编码异常和Struts中的主控制器异常的解决办法 百合不是茶 jsjson编码返回异常
    一:ajax获取自定义Struts框架中的json编码  出现以下 问题:       1,强制flush输出  json编码打印在首页 2, 不强制flush js会解析json 打印出来的是错误的jsp页面   却没有跳转到错误页面 3,  ajax中的dataType的json 改为text 会
  • JUnit使用的设计模式 bijian1013 java设计模式JUnit
    JUnit源代码涉及使用了大量设计模式 1、模板方法模式（Template Method）         定义一个操作中的算法骨架，而将一些步骤延伸到子类中去，使得子类可以不改变一个算法的结构，即可重新定义该算法的某些特定步骤。这里需要复用的是算法的结构，也就是步骤，而步骤的实现可以在子类中完成。   
  • Linux常用命令（摘录） sunjing crondchkconfig
    chkconfig --list   查看linux所有服务 chkconfig --add servicename 添加linux服务 netstat -apn | grep 8080  查看端口占用 env 查看所有环境变量 echo $JAVA_HOME 查看JAVA_HOME环境变量   安装编译器 yum install -y gcc
  • 【Hadoop一】Hadoop伪集群环境搭建 bit1129 hadoop
     结合网上多份文档，不断反复的修正hadoop启动和运行过程中出现的问题，终于把Hadoop2.5.2伪分布式安装起来，跑通了wordcount例子。Hadoop的安装复杂性的体现之一是，Hadoop的安装文档非常多，但是能一个文档走下来的少之又少，尤其是Hadoop不同版本的配置差异非常的大。Hadoop2.5.2于前两天发布，但是它的配置跟2.5.0，2.5.1没有分别。 &nb
  • Anychart图表系列五之事件监听 白糖_ chart
    创建图表事件监听非常简单：首先是通过addEventListener('监听类型',js监听方法)添加事件监听，然后在js监听方法中定义具体监听逻辑。 以钻取操作为例，当用户点击图表某一个point的时候弹出point的name和value，代码如下： <script> //创建AnyChart var chart = new AnyChart(); //添加钻取操作&quo
  • Web前端相关段子 braveCS web前端
    Web标准：结构、样式和行为分离   使用语义化标签 0）标签的语义：使用有良好语义的标签，能够很好地实现自我解释，方便搜索引擎理解网页结构，抓取重要内容。去样式后也会根据浏览器的默认样式很好的组织网页内容，具有很好的可读性，从而实现对特殊终端的兼容。 1）div和span是没有语义的：只是分别用作块级元素和行内元素的区域分隔符。当页面内标签无法满足设计需求时，才会适当添加div
  • 编程之美-24点游戏 bylijinnan 编程之美
    import java.util.ArrayList; import java.util.Arrays; import java.util.HashSet; import java.util.List; import java.util.Random; import java.util.Set; public class PointGame { /**编程之美
  • 主页面子页面传值总结 chengxuyuancsdn 总结
    1、showModalDialog returnValue是javascript中html的window对象的属性,目的是返回窗口值,当用window.showModalDialog函数打开一个IE的模式窗口时,用于返回窗口的值 主界面 var sonValue=window.showModalDialog("son.jsp"); 子界面 window.retu
  • [网络与经济]互联网+的含义 comsci 互联网+
          互联网+后面是一个人的名字 = 网络控制系统       互联网+你的名字 =  网络个人数据库       每日提示:如果人觉得不舒服,千万不要外出到处走动,就呆在床上,玩玩手游,更不能够去开车,现在交通状况不
  • oracle 创建视图 with check option daizj 视图vieworalce
    我们来看下面的例子： create or replace view testview as select empno,ename from emp where ename like ‘M%’ with check option; 这里我们创建了一个视图，并使用了with check option来限制了视图。 然后我们来看一下视图包含的结果： select * from testv
  • ToastPlugin插件在cordova3.3下使用 dibov Cordova
        自己开发的Todos应用，想实现“ 再按一次返回键退出程序 ”的功能，采用网上的ToastPlugins插件，发现代码或文章基本都是老版本，运行问题比较多。折腾了好久才弄好。下面吧基于cordova3.3下的ToastPlugins相关代码共享。       ToastPlugin.java package&nbs
  • C语言22个系统函数 dcj3sjt126com cfunction
    C语言系统函数一、数学函数下列函数存放在math.h头文件中Double floor(double num) 求出不大于num的最大数。Double fmod(x, y) 求整数x/y的余数。Double frexp(num, exp); double num; int *exp; 将num分为数字部分（尾数）x和 以2位的指数部分n，即num=x*2n，指数n存放在exp指向的变量中，返回x。D
  • 开发一个类的流程 dcj3sjt126com 开发
    本人近日根据自己的开发经验总结了一个类的开发流程。这个流程适用于单独开发的构件，并不适用于对一个项目中的系统对象开发。开发出的类可以存入私人类库，供以后复用。   以下是开发流程： 1. 明确类的功能，抽象出类的大概结构 2. 初步设想类的接口 3. 类名设计（驼峰式命名） 4. 属性设置(权限设置) 判断某些变量是否有必要作为成员属
  • java 并发 shuizhaosi888 java 并发
    能够写出高伸缩性的并发是一门艺术   在JAVA SE5中新增了3个包 java.util.concurrent java.util.concurrent.atomic java.util.concurrent.locks 在java的内存模型中，类的实例字段、静态字段和构成数组的对象元素都会被多个线程所共享，局部变量与方法参数都是线程私有的，不会被共享。
  • Spring Security（11）——匿名认证 234390216 Spring SecurityROLE_ANNOYMOUS匿名
    匿名认证 目录 1.1     配置 1.2     AuthenticationTrustResolver          对于匿名访问的用户，Spring Security支持为其建立一个匿名的AnonymousAuthenticat
  • NODEJS项目实践0.2[ express,ajax通信...] 逐行分析JS源代码 Ajaxnodejsexpress
      一、前言         通过上节学习，我们已经        ubuntu系统搭建了一个可以访问的nodejs系统，并做了nginx转发。本节原要做web端服务 及 mongodb的存取，但写着写着，web端就
  • 在Struts2 的Action中怎样获取表单提交上来的多个checkbox的值 lhbthanks javahtmlstrutscheckbox
    第一种方法：获取结果String类型 在 Action 中获得的是一个 String 型数据，每一个被选中的 checkbox 的 value 被拼接在一起，每个值之间以逗号隔开(,)。 所以在 Action 中定义一个跟 checkbox 的 name 同名的属性来接收这些被选中的 checkbox 的 value 即可。 以下是实现的代码： 前台 HTML 代码：
  • 003.Kafka基本概念 nweiren hadoopkafka
    Kafka基本概念：Topic、Partition、Message、Producer、Broker、Consumer。 Topic：             消息源（Message）的分类。 Partition：             Topic物理上的分组，一
  • Linux环境下安装JDK roadrunners jdklinux
    1、准备工作 创建JDK的安装目录： mkdir -p /usr/java/   下载JDK，找到适合自己系统的JDK版本进行下载： http://www.oracle.com/technetwork/java/javase/downloads/index.html   把JDK安装包下载到/usr/java/目录，然后进行解压： tar -zxvf jre-7
  • Linux忘记root密码的解决思路 tomcat_oracle linux
    1：使用同版本的linux启动系统，chroot到忘记密码的根分区passwd改密码 　　2：grub启动菜单中加入init=/bin/bash进入系统，不过这时挂载的是只读分区。根据系统的分区情况进一步判断. 　　3: grub启动菜单中加入 single以单用户进入系统. 　　4:用以上方法mount到根分区把/etc/passwd中的root密码去除 　　例如: 　　ro
  • 跨浏览器 HTML5 postMessage 方法以及 message 事件模拟实现 xueyou jsonpjquery框架UIhtml5
    postMessage 是 HTML5 新方法，它可以实现跨域窗口之间通讯。到目前为止，只有 IE8+, Firefox 3, Opera 9, Chrome 3和 Safari 4 支持，而本篇文章主要讲述 postMessage 方法与 message 事件跨浏览器实现。postMessage 方法 JSONP 技术不一样，前者是前端擅长跨域文档数据即时通讯，后者擅长针对跨域服务端数据通讯，p
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他