bee_two_one
bee_two_one

CSS雪碧图制作emoji表情包

效果图：
CSS雪碧图制作emoji表情包_第1张图片

原理：利用雪碧图，来实现emoji表情包，减少图片请求数。
表情包转换为文字 & 文字转换为表情包 维护两个对象来实现。

缺点：表情包大小由雪碧图中表情包大小控制，不能更改。

htm代码


<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>emotitle>
    <link rel="stylesheet" href="emoji.css">
    <style>
        ul,li {
            padding: 0;
            margin: 0;
            list-style: none;
        }
        #emo_container {
            width: 280px;
            display: flex;
            flex-wrap: wrap;
        }
        #emo_container li {
            width: 70px;
            height: 70px;
            margin-bottom: 10px;
            cursor: pointer;
            position: relative;
        }
        #emo_container li span {
            display: none;
            position: absolute;
            width: 100%;
            bottom: -10px;
            font-size: 12px;
            text-align: center;
        }
        #emo_container li:hover span {
            display: block;
        }
        #emo_input {
            margin-top: 50px;
        }
        .emo-span {
            display: inline-block;
            width: 70px;
            height: 70px;
            vertical-align: middle;
        }
        .show {
            min-height: 200px;
            margin-top: 100px;
            border: 1px solid;
        }
    style>
head>
<body>
    <ul id="emo_container">ul>
    <input type="text" id="emo_input"/>
    <button id="send_msg">sendbutton>
    <div class="show">div>
body>
<script src="jquery-2.1.4.js">script>
<script>
    $(function(){
        let li_html = "";
        let input = "";
        let input_dom = $("#emo_input")[0];
        let emotions = {
            "1":"[微笑]",
            "2":"[撇嘴]",
            "3":"[色]",
            "4":"[发呆]",
            "5":"[得意]",
            "6":"[流泪]",
            "7":"[害羞]",
            "8":"[闭嘴]"
        };
        let emo_index = {
            "[微笑]":"1",
            "[撇嘴]":"2",
            "[色]":"3",
            "[发呆]":"4",
            "[得意]":"5",
            "[流泪]":"6",
            "[害羞]":"7",
            "[闭嘴]":"8"
        };
        //渲染表情包
        Object.keys(emotions).map(function (value,index) {
            li_html += `
  • class="bg-${value}" data-emo="${value}">
                            <span>${emotions[value]}span>
                        li>`;
        });
        $("#emo_container").html(li_html);

        //预览输入的文字
        $("#emo_container").on("click","li",function () {
            let emo = $(this).data("emo");
            input = $("#emo_input").val();
            insert(emotions[emo]);
            //确保插入表情后光标在末尾
            input_dom.focus();
        });

        //界面展示输入的内容
        $("#send_msg").click(function () {
            input = $("#emo_input").val();
            let emo_input = renderEmo(input);
            $(".show").append(`<div>${emo_input}div>`);
            $("#emo_input").val("");
        });

        //表情文字替换为表情图片
        function renderEmo(text) {
            let pattern = /\[[\u4e00-\u9fa5]+\]/g;
            return text.replace(pattern,function (match) {
                return `<span class="emo-span bg-${emo_index[match]}">span>`
            })
        }

        //文字中间插入表情
        function insert(str) {
            var value = input_dom.value;
            if(typeof document.selection != "undefined")
            {
                document.selection.createRange().text = str;
            }
            else
            {
                return input_dom.value = value.substr(0,input_dom.selectionStart)+str+value.substring(input_dom.selectionStart,value.length);
            }
        }

    })
script>
html>

    • CSS代码

    .bg-1 {
    width: 66px; height: 66px;
    background: url('emoji.png') -10px -10px;
}
.bg-2 {
    width: 66px; height: 66px;
    background: url('emoji.png') -96px -10px;
}
.bg-3 {
    width: 66px; height: 66px;
    background: url('emoji.png') -10px -96px;
}
.bg-4 {
    width: 66px; height: 66px;
    background: url('emoji.png') -96px -96px;
}
.bg-5 {
    width: 66px; height: 66px;
    background: url('emoji.png') -182px -10px;
}
.bg-6 {
    width: 66px; height: 66px;
    background: url('emoji.png') -182px -96px;
}
.bg-7 {
    width: 66px; height: 66px;
    background: url('emoji.png') -10px -182px;
}
.bg-8 {
    width: 66px; height: 66px;
    background: url('emoji.png') -96px -182px;
}

    你可能感兴趣的:(css技巧)

    • 响应式设计已死？流体布局才是未来！ 前端javascript
      ReactHook深入浅出CSS技巧与案例详解vue2与vue3技巧合集VueUse源码解读在当今的Web设计领域，挑战从未如此巨大。各种屏幕尺寸和分辨率的智能设备层出不穷，要让网站在所有设备上保持一致的用户体验，难度可想而知。但别担心，流体布局（FluidLayout）正是为了解决这一问题而生。它不仅适用于超大屏幕，同样也能完美适配小型移动设备，真正做到自适应！接下来，我们深入了解流体布局的原理
    • 深度掌握 ReactJS 高级概念：前端开发者必备 前端javascript
      ReactHook深入浅出CSS技巧与案例详解vue2与vue3技巧合集VueUse源码解读这篇文章汇总了ReactJS中值得深入研究的高级概念。读完后，不仅在前端面试中能更胸有成竹，还能自行开发一个类似ReactJS的UI库。目录Rendering的含义与过程Re-rendering发生的机制及原因VirtualDOM的原理Reconciliation算法的运行方式ReactJS的性能优化方案1
    • Claude 3.7 全解析：AI 代码助手的巅峰之作？
      ReactHook深入浅出CSS技巧与案例详解vue2与vue3技巧合集VueUse源码解读最近AI领域的新模型层出不穷，Claude3.7的发布无疑是最受瞩目的事件之一。从Claude3.5的成功，到如今对抗OpenAIO3Mini和DeepSeekR1的挑战，这款新一代AI是否真的能超越前辈，成为最强的AI代码助手？在深入研究和亲身体验后，这篇文章将完整解析Claude3.7的新特性、性能表现
    • Claude 3.7 全解析：AI 代码助手的巅峰之作？
      ReactHook深入浅出CSS技巧与案例详解vue2与vue3技巧合集VueUse源码解读最近AI领域的新模型层出不穷，Claude3.7的发布无疑是最受瞩目的事件之一。从Claude3.5的成功，到如今对抗OpenAIO3Mini和DeepSeekR1的挑战，这款新一代AI是否真的能超越前辈，成为最强的AI代码助手？在深入研究和亲身体验后，这篇文章将完整解析Claude3.7的新特性、性能表现
    • Manus：颠覆 AI 代理的新时代
      ReactHook深入浅出CSS技巧与案例详解vue2与vue3技巧合集VueUse源码解读Manus，这款突破性的AI代理，近期在科技界掀起了巨大波澜。它由中国AI初创公司Monica开发，并于2025年3月初正式亮相。在联合创始人兼首席科学家Yichao“Peak”Ji的演示视频中，Manus展现了其强大的自动化执行能力。这个AI代理的名字来源于拉丁语“Manus”，意为“手”，寓意它能充当用
    • 忘掉 DeepSeek：Qwen 2.5 VL 与 Qwen Max 来了
      ReactHook深入浅出CSS技巧与案例详解vue2与vue3技巧合集VueUse源码解读Qwen系列又推出了两款令人瞩目的新模型：Qwen2.5VL和Qwen2.5Max。如果还停留在“DeepSeek是最强”那一档，就可能要重新考虑一下，因为这两款模型的实力相当惊艳。什么是Qwen2.5VL？先从Qwen2.5VL说起。它不仅能看图识物，还能理解视频、文本，具备执行电脑操作（agentic）
    • 忘掉 DeepSeek：Qwen 2.5 VL 与 Qwen Max 来了
      ReactHook深入浅出CSS技巧与案例详解vue2与vue3技巧合集VueUse源码解读Qwen系列又推出了两款令人瞩目的新模型：Qwen2.5VL和Qwen2.5Max。如果还停留在“DeepSeek是最强”那一档，就可能要重新考虑一下，因为这两款模型的实力相当惊艳。什么是Qwen2.5VL？先从Qwen2.5VL说起。它不仅能看图识物，还能理解视频、文本，具备执行电脑操作（agentic）
    • 本地运行 DeepSeek-R1 的成本究竟多高？ 前端javascript
      ReactHook深入浅出CSS技巧与案例详解vue2与vue3技巧合集VueUse源码解读本地运行DeepSeek-R1的成本究竟多高？DeepSeek让人们对大规模生成式模型的追求更进一步，甚至有人想在本地跑下规模高达671B参数的版本。但要在家里开这种“巨无霸”，可不是闹着玩的：光是推理就对硬件提出了非常高的要求。这篇文章将大致拆解一下，如果真想在个人电脑上运行DeepSeek-R1，可能需
    • 本地运行 DeepSeek-R1 的成本究竟多高？ 前端javascript
      ReactHook深入浅出CSS技巧与案例详解vue2与vue3技巧合集VueUse源码解读本地运行DeepSeek-R1的成本究竟多高？DeepSeek让人们对大规模生成式模型的追求更进一步，甚至有人想在本地跑下规模高达671B参数的版本。但要在家里开这种“巨无霸”，可不是闹着玩的：光是推理就对硬件提出了非常高的要求。这篇文章将大致拆解一下，如果真想在个人电脑上运行DeepSeek-R1，可能需
    • 构建 Next.js 应用时的安全保障与风险防范措施 前端javascript
      ReactHook深入浅出CSS技巧与案例详解vue2与vue3技巧合集VueUse源码解读在Web应用开发过程中，确保应用的安全性至关重要，这不仅能保护用户数据，还能防止应用本身遭受各种安全攻击。Next.js作为一款备受欢迎的React框架，内置了许多安全功能和推荐做法，但开发者仍需清楚地了解潜在的安全隐患，并采取合适的防范策略。一、Next.js安全问题概述尽管Next.js为构建安全应用提
    • 少数人知道的 10 个神奇 CSS 选择器 前端javascript
      ReactHook深入浅出CSS技巧与案例详解vue2与vue3技巧合集VueUse源码解读在Web开发中，CSS扮演着至关重要的角色，但很多开发者并没有真正发掘它的全部潜力！大多数人熟悉ID选择器、类选择器或元素选择器，甚至伪元素的使用也很常见。然而，你知道CSS其实还有许多不为人知的强大选择器吗？今天，就带你揭秘一些鲜有人知但却非常实用的CSS选择器，让你在样式控制上更上一层楼！1.属性选择器
    • 2025 年 Vue 的下一步是什么？
      ReactHook深入浅出CSS技巧与案例详解vue2与vue3技巧合集VueUse源码解读随着我们迈入2025年，掌握Vue生态系统的最新动态已经不仅仅是跟上时代步伐，更是获取竞争优势的关键。深入了解最新特性、性能提升和开发流程的优化，将帮助你打造更高效的Vue应用，同时也能应对未来工具API的变化。本文将重点解读几款Vue生态内的重要工具的新版本动态，包括Nuxtv4、Vitev6、Vites
    • React Native 列表组件：FlashList、FlatList 及更多 前端javascript
      CSS技巧与案例详解vue2与vue3技巧合集VueUse源码解读在移动开发中，高效展示数据列表至关重要。作为ReactNative开发者，我们可以使用多种强大的工具来完成这一任务。无论是ScrollView、SectionList还是FlatList，ReactNative都提供了一系列用于数据展示的组件。然而，随着数据集的增长和性能需求的提高，我们需要更优化的解决方案。这时，Shopify推出
    • React Native 列表组件：FlashList、FlatList 及更多 前端javascript
      CSS技巧与案例详解vue2与vue3技巧合集VueUse源码解读在移动开发中，高效展示数据列表至关重要。作为ReactNative开发者，我们可以使用多种强大的工具来完成这一任务。无论是ScrollView、SectionList还是FlatList，ReactNative都提供了一系列用于数据展示的组件。然而，随着数据集的增长和性能需求的提高，我们需要更优化的解决方案。这时，Shopify推出
    • DeepSeek-R1全面超越OpenAI o1：开源大模型训练范式革新 前端javascript
      CSS技巧与案例详解vue2与vue3技巧合集VueUse源码解读人工智能在过去十年中的发展令人惊叹。其中，2017年Google发布的“AttentionIsAllYouNeed”论文奠定了神经网络架构的重要基础，推动了大规模语言模型（LLM）的突破。OpenAI早期专注于强化学习（RL），但在Transformer结构问世后，迅速调整方向，借助Google的开源研究开发出强大的LLM。然而，尽
    • DeepSeek R1 简易指南：架构、培训、本地部署和硬件要求 前端javascript
      CSS技巧与案例详解vue2与vue3技巧合集VueUse源码解读DeepSeek团队近期发布的DeepSeek-R1技术论文展示了其在增强大语言模型推理能力方面的创新实践。该研究突破性地采用强化学习（ReinforcementLearning）作为核心训练范式，在不依赖大规模监督微调的前提下显著提升了模型的复杂问题求解能力。技术架构深度解析模型体系：DeepSeek-R1系列包含两大核心成员：D
    • 什么是 Next.js 中的代码分割？如何提升性能？ javascript前端
      CSS技巧与案例详解vue2与vue3技巧合集VueUse源码解读什么是Next.js中的代码拆分？它如何提升性能？代码拆分是现代Web开发中一个重要的性能优化技术，特别是在Next.js应用中。代码拆分的核心思想是将应用的代码分解成更小、更易管理的部分，并在需要时动态加载这些部分。通过减少应用的初始加载时间，这一技术显著提升了性能和用户体验。在本文中，我们将深入探讨代码拆分的概念、它在Next.
    • 不要再这样编写 async/await 前端javascript
      CSS技巧与案例详解vue2与vue3技巧合集VueUse源码解读最开始接触async/await时，很多人都会发出“终于有这个功能了！”的感叹。它的语法清晰、可读性强，用起来直观又顺手。然而，用得越久，就会发现一些常见的“坑”时常在各种项目里出现：有些是代码审查时发现的，有些是和同事讨论时暴露的问题。这些都说明异步编程本质上并不简单。下文就结合实际经验，列出了一些常见的异步陷阱，以及更高级的用法
    • Next.js 高级缓存策略分析
      CSS技巧与案例详解vue2与vue3技巧合集VueUse源码解读在Next.js中，缓存机制往往是被诟病最多的特性之一。许多开发者对其工作方式并不满意。虽然缓存对提升React应用的性能至关重要，但如果对其原理不够理解，很容易导致棘手的错误。例如，页面在客户端显示陈旧数据的问题可能让你在调试时痛苦不堪。对Next.js缓存机制缺乏深入理解，就会让你不断遭遇意料之外的行为和Bug，每次都在不必要的
    • React Native 0.77 发布：更强的样式支持与性能优化 前端javascript
      CSS技巧与案例详解vue2与vue3技巧合集VueUse源码解读ReactNative0.77正式发布！此次版本带来了多项重要改进，包括样式功能的增强、Android平台的性能优化以及项目模板的升级。这一版本的核心目标是提升开发效率，同时确保在不同平台上的兼容性。接下来，我们来看看这次更新中的亮点内容。主要更新内容✨全新CSS特性支持：新增对display:contents、boxSizing、
    • Tailwind CSS—骨架屏生成器 前端javascript
      CSS技巧与案例详解vue2与vue3技巧合集VueUse源码解读使用TailwindCSS快速创建现代化的骨架屏，只需要这个简单的工具。我一直在寻找方法，让我的网站更加引人入胜和用户友好。其中最简单而又最有效的方法之一，就是加入骨架加载器——那些灰色的、闪烁的方框，在内容加载时显示。它们帮助用户获得更流畅的体验，让他们觉得网站加载速度比实际快。这些骨架加载器是一个不错的补充，但从零开始设计它们却
    • Monorepo设置：新手指南
      CSS技巧与案例详解vue2与vue3技巧合集VueUse源码解读Monorepo是一种项目代码管理方法，指在单个代码仓库中管理多个项目，有助于简化代码共享、版本控制、构建和部署的复杂性，并提供更好的可重用性和协作性。简单理解：所有项目都在一个代码仓库中，但这并不意味着所有代码都组织在一个文件夹中️。事实上，一个好的Monorepo与单体代码库恰恰相反；它应该结构良好且模块化。发展历程单体时期单一
    • 告别CSS margin 和 padding 简写,拥抱更优雅的解决方案
      CSS技巧与案例详解vue2与vue3技巧合集VueUse源码解读在前端开发中,CSS的外边距(margin)和内边距(padding)是使用频率极高的属性。多年来,开发者们习惯使用它们的简写形式,例如:margin:10px20px15px5px;padding:5px10px;这种简写方式看似简洁,实则暗藏玄机。随着项目规模的扩大和设计需求的频繁变更,这种简写方式逐渐显露出其局限性。首先,我们
    • 使用 Next 14 + NextAuth 4 + Strapi v4进行 Google 和凭据提供商身份验证的完整指南(02) javascript前端
      CSS技巧与案例详解vue2与vue3技巧合集VueUse源码解读NextAuthv4介绍NextAuth是一个开源的身份验证解决方案，适用于全栈（Next）应用程序。它支持不同的登录方式，如OAuth提供商（如Google、GitHub等）、凭据（经典的邮箱+密码）以及邮箱登录（通过用户点击的"魔法链接"）。它还提供不同的数据库适配器，可以直接将登录信息存入特定的数据库（如MongoDB）或与O
    • 使用 Next 14 + NextAuth 4 + Strapi v4进行 Google 和凭据提供商身份验证的完整指南(01) 前端javascript
      CSS技巧与案例详解vue2与vue3技巧合集VueUse源码解读最近开始研究Strapi，这是一个无头CMS。由于它仅提供后端，前端部分包括身份验证流程需要你自己构建。显然，你不会想自己构建这些，而是使用市场上的某个身份验证库。我早已计划使用NextAuth，所以这是一个完美的机会来实现它。因此，我们的设置是Next+Strapi+NextAuth。作为NextAuth的新手，首先需要一些基础教
    • 只有 2% 的开发人员知道的 7 种神奇 JavaScript 数组方法
      CSS技巧与案例详解vue2与vue3技巧合集VueUse源码解读很多人使用JavaScript数组时，最多就是for循环、map()或者filter()等常见方法，但其实数组还有不少“隐藏招数”。这篇文章介绍的7个方法，也许会让你眼前一亮。1.copyWithin()想象一下：取走一片披萨，然后又把它塞回披萨盒的另一个角落，这就是copyWithin()的感觉。它会将数组中指定范围的元素复制到同
    • 如何只使用 CSS 实现网站的暗黑模式切换
      CSS技巧与案例详解vue2与vue3技巧合集VueUse源码解读想让你的网站从“明亮清新”切换到“暗黑酷炫”，而不依赖任何JavaScript？没问题！仅用CSS就能完成这个任务，根据用户设备的系统设置动态切换主题。本教程将教你如何实现一个可以随系统设置自动切换明暗模式的网站，完全抛弃JavaScript。第一步：基础HTML页面结构首先，我们需要一个简单的HTML页面来进行实践，为后续的样式处
    • 5分钟内理解 .prototype 链 | 2024
      CSS技巧与案例详解vue2与vue3技巧合集VueUse源码解读在JavaScript的世界里,原型(prototype)系统是一个常被讨论但不易掌握的概念。作为JavaScript继承模型的基石,理解原型对于构建大型应用或进行对象操作至关重要。让我们一起探索这个迷人的话题,揭开原型系统的神秘面纱。什么是原型?在JavaScript中,每个对象都有一个内部属性[[Prototype]]。这个属性
    • 只有 1% 的开发人员能在 60 秒内找到代码中的错误
      CSS技巧与案例详解vue2与vue3技巧合集VueUse源码解读下面这段简单的JavaScript代码里藏着一个不起眼但足以让人抓狂的错误：functiongetResult(a,b){return{result:a+b};}console.log(getResult(2,3));//结果真的是5吗？表面看上去，这只是一个“把两个数相加，然后返回对象”的函数，可实际运行后却并非预期的{resul
    • 《CSS 揭秘》案例dome kingrome2009 css3动画css揭秘
      本书是一本注重实践的教程，作者为我们揭示了47个鲜为人知的CSS技巧，主要内容包括背景与边框、形状、视觉效果、字体排印、用户体验、结构与布局、过渡与动画等。本书将带领读者循序渐进地探寻更优雅的解决方案，攻克每天都会遇到的各种网页样式难题。史上最全的实例建议不要买书因为电子版的更适合我们下载链接css揭秘pdfdomeDocument*{margin:0;padding:0;}body{backgr
    • jvm调优总结（从基本概念 到 深度优化） oloz javajvmjdk虚拟机应用服务器
      JVM参数详解：http://www.cnblogs.com/redcreen/archive/2011/05/04/2037057.html   Java虚拟机中，数据类型可以分为两类：基本类型和引用类型。基本类型的变量保存原始值，即：他代表的值就是数值本身；而引用类型的变量保存引用值。“引用值”代表了某个对象的引用，而不是对象本身，对象本身存放在这个引用值所表示的地址的位置。
    • 【Scala十六】Scala核心十：柯里化函数 bit1129 scala
      本篇文章重点说明什么是函数柯里化，这个语法现象的背后动机是什么，有什么样的应用场景，以及与部分应用函数(Partial Applied Function)之间的联系   1. 什么是柯里化函数 A way to write functions with multiple parameter lists. For instance def f(x: Int)(y: Int) is a
    • HashMap dalan_123 java
      HashMap在java中对很多人来说都是熟的；基于hash表的map接口的非同步实现。允许使用null和null键；同时不能保证元素的顺序；也就是从来都不保证其中的元素的顺序恒久不变。 1、数据结构     在java中，最基本的数据结构无外乎：数组 和 引用（指针），所有的数据结构都可以用这两个来构造，HashMap也不例外，归根到底HashMap就是一个链表散列的数据
    • Java Swing如何实时刷新JTextArea，以显示刚才加append的内容 周凡杨 java更新swingJTextArea
      在代码中执行完textArea.append("message")后，如果你想让这个更新立刻显示在界面上而不是等swing的主线程返回后刷新，我们一般会在该语句后调用textArea.invalidate()和textArea.repaint()。 问题是这个方法并不能有任何效果，textArea的内容没有任何变化，这或许是swing的一个bug，有一个笨拙的办法可以实现
    • servlet或struts的Action处理ajax请求 g21121 servlet
      其实处理ajax的请求非常简单，直接看代码就行了： //如果用的是struts //HttpServletResponse response = ServletActionContext.getResponse(); // 设置输出为文字流 response.setContentType("text/plain"); // 设置字符集 res
    • FineReport的公式编辑框的语法简介 老A不折腾 finereport公式总结
      FINEREPORT用到公式的地方非常多，单元格（以=开头的便被解析为公式），条件显示，数据字典，报表填报属性值定义，图表标题，轴定义，页眉页脚，甚至单元格的其他属性中的鼠标悬浮提示内容都可以写公式。 简单的说下自己感觉的公式要注意的几个地方：   1.if语句语法刚接触感觉比较奇怪，if(条件式子,值1,值2)，if可以嵌套，if(条件式子1，值1，if(条件式子2，值2，值3)
    • linux mysql 数据库乱码的解决办法 墙头上一根草 linuxmysql数据库乱码
      linux 上mysql数据库区分大小写的配置 lower_case_table_names=1 1-不区分大小写 0-区分大小写   修改/etc/my.cnf 具体的修改内容如下:   [client] default-character-set=utf8   [mysqld] datadir=/var/lib/mysql socket=/va
    • 我的spring学习笔记6-ApplicationContext实例化的参数兼容思想 aijuans Spring 3
      ApplicationContext能读取多个Bean定义文件，方法是： ApplicationContext appContext = new ClassPathXmlApplicationContext（ new String[]｛“bean-config1.xml”，“bean-config2.xml”，“bean-config3.xml”，“bean-config4.xml
    • mysql 基准测试之sysbench annan211 基准测试mysql基准测试MySQL测试sysbench
      1 执行如下命令，安装sysbench-0.5： tar xzvf sysbench-0.5.tar.gz  cd sysbench-0.5  chmod +x autogen.sh  ./autogen.sh  ./configure --with-mysql --with-mysql-includes=/usr/local/mysql
    • sql的复杂查询使用案列与技巧 百合不是茶 oraclesql函数数据分页合并查询
        本片博客使用的数据库表是oracle中的scott用户表;          -------------------  自然连接查询           查询 smith 的上司(两种方法) &
    • 深入学习Thread类 bijian1013 javathread多线程java多线程
      一．             线程的名字 下面来看一下Thread类的name属性，它的类型是String。它其实就是线程的名字。在Thread类中，有String getName()和void setName(String)两个方法用来设置和获取这个属性的值。 同时，Thr
    • JSON串转换成Map以及如何转换到对应的数据类型 bijian1013 javafastjsonnet.sf.json
              在实际开发中，难免会碰到JSON串转换成Map的情况，下面来看看这方面的实例。另外，由于fastjson只支持JDK1.5及以上版本，因此在JDK1.4的项目中可以采用net.sf.json来处理。 一.fastjson实例 JsonUtil.java package com.study; impor
    • 【RPC框架HttpInvoker一】HttpInvoker：Spring自带RPC框架 bit1129 spring
      HttpInvoker是Spring原生的RPC调用框架，HttpInvoker同Burlap和Hessian一样，提供了一致的服务Exporter以及客户端的服务代理工厂Bean，这篇文章主要是复制粘贴了Hessian与Spring集成一文，【RPC框架Hessian四】Hessian与Spring集成   在 【RPC框架Hessian二】Hessian 对象序列化和反序列化一文中
    • 【Mahout二】基于Mahout CBayes算法的20newsgroup的脚本分析 bit1129 Mahout
      #!/bin/bash # # Licensed to the Apache Software Foundation (ASF) under one or more # contributor license agreements. See the NOTICE file distributed with # this work for additional information re
    • nginx三种获取用户真实ip的方法 ronin47
      随着nginx的迅速崛起，越来越多公司将apache更换成nginx. 同时也越来越多人使用nginx作为负载均衡, 并且代理前面可能还加上了CDN加速，但是随之也遇到一个问题：nginx如何获取用户的真实IP地址,如果后端是apache,请跳转到<apache获取用户真实IP地址>，如果是后端真实服务器是nginx，那么继续往下看。 实例环境： 用户IP 120.22.11.11
    • java-判断二叉树是不是平衡 bylijinnan java
      参考了 http://zhedahht.blog.163.com/blog/static/25411174201142733927831/ 但是用java来实现有一个问题。 由于Java无法像C那样“传递参数的地址，函数返回时能得到参数的值”，唯有新建一个辅助类：AuxClass import ljn.help.*; public class BalancedBTree {
    • BeanUtils.copyProperties VS PropertyUtils.copyProperties 诸葛不亮 PropertyUtilsBeanUtils
       BeanUtils.copyProperties VS  PropertyUtils.copyProperties  作为两个bean属性copy的工具类，他们被广泛使用，同时也很容易误用，给人造成困然；比如：昨天发现同事在使用BeanUtils.copyProperties copy有integer类型属性的bean时，没有考虑到会将null转换为0，而后面的业
    • [金融与信息安全]最简单的数据结构最安全 comsci 数据结构
            现在最流行的数据库的数据存储文件都具有复杂的文件头格式，用操作系统的记事本软件是无法正常浏览的，这样的情况会有什么问题呢？        从信息安全的角度来看，如果我们数据库系统仅仅把这种格式的数据文件做异地备份，如果相同版本的所有数据库管理系统都同时被攻击，那么
    • vi区段删除 Cwind linuxvi区段删除
      区段删除是编辑和分析一些冗长的配置文件或日志文件时比较常用的操作。简记下vi区段删除要点备忘。   vi概述    引文中并未将末行模式单独列为一种模式。单不单列并不重要，能区分命令模式与末行模式即可。   vi区段删除步骤： 1. 在末行模式下使用:set nu显示行号 非必须，随光标移动vi右下角也会显示行号，能够正确找到并记录删除开始行
    • 清除tomcat缓存的方法总结 dashuaifu tomcat缓存
      用tomcat容器，大家可能会发现这样的问题，修改jsp文件后，但用IE打开 依然是以前的Jsp的页面。 出现这种现象的原因主要是tomcat缓存的原因。 解决办法如下: 在jsp文件头加上 <meta http-equiv="Expires" content="0"> <meta http-equiv="kiben&qu
    • 不要盲目的在项目中使用LESS CSS dcj3sjt126com Webless
      　如果你还不知道LESS CSS是什么东西，可以看一下这篇文章，是我一朋友写给新人看的《CSS——LESS》 　　不可否认，LESS CSS是个强大的工具，它弥补了css没有变量、无法运算等一些“先天缺陷”，但它似乎给我一种错觉，就是为了功能而实现功能。 　　比如它的引用功能 ? .rounded_corners{     
    • [入门]更上一层楼 dcj3sjt126com PHPyii2
      更上一层楼 通篇阅读完整个“入门”部分，你就完成了一个完整 Yii 应用的创建。在此过程中你学到了如何实现一些常用功能，例如通过 HTML 表单从用户那获取数据，从数据库中获取数据并以分页形式显示。你还学到了如何通过 Gii 去自动生成代码。使用 Gii 生成代码把 Web 开发中多数繁杂的过程转化为仅仅填写几个表单就行。 本章将介绍一些有助于更好使用 Yii 的资源：
    • Apache HttpClient使用详解 eksliang httpclienthttp协议
      Http协议的重要性相信不用我多说了，HttpClient相比传统JDK自带的URLConnection，增加了易用性和灵活性（具体区别，日后我们再讨论），它不仅是客户端发送Http请求变得容易，而且也方便了开发人员测试接口（基于Http协议的），即提高了开发的效率，也方便提高代码的健壮性。因此熟练掌握HttpClient是很重要的必修内容，掌握HttpClient后，相信对于Http协议的了解会
    • zxing二维码扫描功能 gundumw100 androidzxing
      经常要用到二维码扫描功能 现给出示例代码 import com.google.zxing.WriterException; import com.zxing.activity.CaptureActivity; import com.zxing.encoding.EncodingHandler; import android.app.Activity; import an
    • 纯HTML+CSS带说明的黄色导航菜单 ini htmlWebhtml5csshovertree
      HoverTree带说明的CSS菜单:纯HTML+CSS结构链接带说明的黄色导航   在线体验效果：http://hovertree.com/texiao/css/1.htm代码如下,保存到HTML文件可以看到效果：   <!DOCTYPE html > <html > <head> <title>HoverTree
    • fastjson初始化对性能的影响 kane_xie fastjson序列化
      之前在项目中序列化是用thrift，性能一般，而且需要用编译器生成新的类，在序列化和反序列化的时候感觉很繁琐，因此想转到json阵营。对比了jackson，gson等框架之后，决定用fastjson，为什么呢，因为看名字感觉很快。。。   网上的说法：   fastjson 是一个性能很好的 Java 语言实现的 JSON 解析器和生成器，来自阿里巴巴的工程师开发。
    • 基于Mybatis封装的增删改查实现通用自动化sql mengqingyu DAO
      1.基于map或javaBean的增删改查可实现不写dao接口和实现类以及xml，有效的提高开发速度。 2.支持自定义注解包括主键生成、列重复验证、列名、表名等 3.支持批量插入、批量更新、批量删除 <bean id="dynamicSqlSessionTemplate" class="com.mqy.mybatis.support.Dynamic
    • js控制input输入框的方法封装(数字，中文，字母，浮点数等) qifeifei javascript js
      在项目开发的时候，经常有一些输入框，控制输入的格式，而不是等输入好了再去检查格式，格式错了就报错，体验不好。 /** 数字，中文，字母,浮点数(+/-/.) 类型输入限制，只要在input标签上加上 jInput="number,chinese,alphabet,floating" 备注：floating属性只能单独用*/     funct
    • java 计时器应用 tangqi609567707 javatimer
      mport java.util.TimerTask;   import java.util.Calendar;   public class MyTask extends TimerTask {        private static final int
    • erlang输出调用栈信息 wudixiaotie erlang
      在erlang otp的开发中，如果调用第三方的应用，会有有些错误会不打印栈信息，因为有可能第三方应用会catch然后输出自己的错误信息，所以对排查bug有很大的阻碍，这样就要求我们自己打印调用的栈信息。用这个函数：erlang:process_display (self (), backtrace).需要注意这个函数只会输出到标准错误输出。 也可以用这个函数：erlang:get_s
    按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他