dilei8887
dilei8887

原生html、js手写 radio与checkbox 美化

原生html、js手写 radio与checkbox   美化

html

DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>demotitle>
    <style>
        ul{
      width:100%;text-align: center;}
        li{
      
            display: inline-block;
            vertical-align: middle;
            width:30%;
            position: relative;
            border:1px solid #ccc;
        }
        li:div:first-child{
      
            height:300px;
        }
        button{
      
            margin:10px;
            width:100px;
        }
        label.sim-check{
      
            display: inline-block;
            vertical-align: middle;
            margin:2px 4px;
        }
        label.sim-check input{
      
            width:0;height:0;
            opacity: 0;
            margin:0;padding:0;
            border:0;outline: none;
        }
        label.sim-check em{
      
            display: inline-block;
            vertical-align: middle;
            width:13px;
            height:13px;
            background: url(check.png) no-repeat;
        }
        label.sim-check em.c{
      
            background-position: 0 -14px;
        }
        label.sim-check em.r{
      
            background-position: -28px -14px;
        }
        label.sim-check span{
      
            margin-left:6px;
        }
    style>
head>
<body>
    <ul>
        <li>
            <div id="radio">div>
        li>
        <li style="margin:0 12px;">
            <div id="check">div>
        li>
    ul>
    <div id="test" style="height:200px;">div>
    <script>
        /**
         * obj:初始化参数
         * type:checkbox|radio
         * data:初始数据
         * id:表单容器
         * */
         function initCheck(obj){
            var el=document.getElementById(obj.id);//容器对象
            var createHtml=function(type,data){
                var t=type=="radio";
                var _str=''
                   +''+type+'" name="sim-input" value="'+data+'">'
                    +''+(t?"r":"c")+'" style="background-position-x: '+(t?-28:0)+'px;background-position-y: -14px;">'
                    +''+data+''
                +'';
                return _str;
            }
            for(var i=0,str=[];i<obj.data.length;i++){
                str.push(createHtml(obj.type,obj.data[i]));
            }
            el.innerHTML=str.join('');
            var check_obj={
                el:el,
                type:obj.type,
                el_html:str,
                value:function(){
                    var input=this.el.getElementsByTagName('input');
                    for(var i=0,res=[];i<input.length;i++){
                        if(input[i].checked){
                            res.push(input[i].value)
                        }
                    }
                    return res;
                },
                add:function(index,data){
                    //appendChild()
                    var html=this.el.innerHTML;
                    var _arr=html.split('');
                    var new_html=createHtml(this.type,data)
                    new_html=new_html.replace('','');
                    _arr.splice(index,0,new_html);
                    this.el.innerHTML=_arr.join('');
                },
                del:function(index){
                    //removeChild()
                    var label=this.el.getElementsByTagName('label');
                    this.el.removeChild(label[index]);
                },
                dis:function(index){
                    var label=this.el.getElementsByTagName('label');
                    var em=label[index].getElementsByTagName('em');
                    var class_name=label[index].className;
                    if(class_name.indexOf('dis')==-1){
                        label[index].className=class_name+' dis';
                        em[0].style.backgroundPositionY='0px';
                    }else{
                        label[index].className=class_name.replace('dis','');
                        em[0].style.backgroundPositionY='-14px';
                    }
                }
            }//保存操作对象用于返回
            el.addEventListener('change',function(e){
                var _el=e.target;
                var _el_p=_el.parentNode;
                if(_el_p.className.indexOf('dis')!==-1){
      return false;}
                var _el_em=_el_p.getElementsByTagName('em');
                if(_el_em[0].className.indexOf('c')>=0){
                    var x=parseFloat(_el_em[0].style.backgroundPositionX);
                    if(_el.checked){
                        _el_em[0].style.backgroundPositionX=(x-14)+"px"
                    }else{
                        _el_em[0].style.backgroundPositionX=(x+14)+"px"
                    }
                }else{
                    var _el_aem=_el_p.parentNode.getElementsByTagName('em');
                    var _el_ps=_el_p.parentNode.getElementsByTagName('label');
                    for(var i=0;i<_el_ps.length;i++){
                        if(_el_ps[i].className.indexOf('dis')<0){
                            if(_el_aem[i]==_el_em[0]){
                                _el_aem[i].style.backgroundPositionX="-42px"
                            }else{
                                _el_aem[i].style.backgroundPositionX="-28px"
                            }
                        }
                    }
                } 
            });
            return check_obj;
         }
script>
<script>
    var radio=initCheck({
        type:'radio',
        id:'radio',
        data:['男','女','其他','保密']
    });
    console.log(radio)
script>
<script>
    var check=initCheck({
        type:'checkbox',
        id:'check',
        data:['运动','听音乐','游戏','旅游','看书']
    });
script>
body>
html>

图片资源/check.png：

 

转载于:https://www.cnblogs.com/pengfei25/p/11114083.html

你可能感兴趣的:(原生html、js手写 radio与checkbox 美化)

  • 如何使用小红书矩阵系统：提升内容管理与发布的指南
    小红书作为一个集社区分享与电商功能于一体的平台，吸引了大量的用户和创作者。随着内容创作和账号管理的复杂性增加，小红书矩阵系统成为了一个强大的工具，帮助用户提高效率和扩大影响力。本文将详细介绍如何使用小红书矩阵系统，以优化您的内容管理和发布策略。小红书矩阵系统简介小红书矩阵系统是一个集成解决方案，旨在帮助用户高效地管理多个账号、创作内容、安排发布计划，并通过智能工具提升用户体验。它通常包含以下核心功
  • AWS成本监控告警系统完整解析 ivwdcwso 运维与云原生awspythonCost云成本运维开发
    完整代码展示#!/usr/bin/python3importboto3,json,requestsimportpandasaspdfromdatetimeimportdatetime,timedelta#创建CostExplorer客户端client=boto3.client('ce')
  • 116、掌握Docker Compose与Kubernetes：Rust应用部署实操 多多的编程笔记 Rust之Web开发dockerkubernetesrust
    Rust部署与运维：掌握使用DockerCompose、Kubernetes等工具进行应用部署和管理1.引言Rust是一种注重性能、安全和并发的系统编程语言。近年来，随着云计算和微服务架构的普及，如何将Rust应用部署到生产环境中，成为越来越多开发者关注的问题。本文将介绍如何使用DockerCompose和Kubernetes等工具进行Rust应用的部署和管理。2.DockerCompose简介D
  • 英伟达终为 CUDA 添加原生 Python 支持，他有什么目的？ 朱卫军 AI python开发语言
    CUDA原来只支持C/C++/Fortran，在2025的CES上宣布支持原生Python其实是不得已而为之，一方面现在Python的AI开发者数量过于庞大，达到数千万级别，而CUDA仅几百万，CUDA想扩大自己的用户圈子，只能拉Python入伙。另一方面，Python生态的计算库实在太强大，比如numpy，几乎垄断了数组计算，还有像scipy、keras等，已经成为机器学习的主流工具，CUDA必
  • 海外社媒营销：实现多账号矩阵与精准触达
    在全球社交媒体用户突破50亿的当下，TikTok、Instagram、Facebook等平台已成为品牌触达海外消费者的核心战场。然而，随着平台风控升级与用户需求分化，海外社媒营销正面临两大核心挑战：多账号矩阵运营易被封禁（TikTok单月封禁超200万账号）、内容触达缺乏精准度（全球用户语言/文化/兴趣差异超300种）。亚矩阵云手机通过虚拟化环境隔离、AI行为模拟引擎、动态内容适配系统三大核心技术
  • Python 领域 vllm 安装与环境配置全攻略 Python编程之道 Python编程之道python开发语言ai
    Python领域vllm安装与环境配置全攻略关键词：Python、vllm、安装、环境配置、深度学习摘要：本文围绕Python领域中vllm的安装与环境配置展开，全面且深入地介绍了vllm的相关知识。首先阐述了背景信息，包括目的范围、预期读者、文档结构和术语表。接着详细讲解了vllm的核心概念与联系，分析其核心算法原理并给出具体操作步骤，还引入了相关数学模型和公式进行说明。通过项目实战，提供代码实
  • Python 爬虫实战：爬取网易公开课（课程列表解析 + 视频资源批量下载） Python核芯 Python爬虫实战项目python爬虫音视频网易
    一、引言在数字化学习蓬勃发展的当下，网易公开课作为优质在线教育平台，汇聚了海量精品课程，涵盖科技、文化、艺术等多元领域，为求知者提供了便捷的学习渠道。然而，面对丰富的内容，手动逐一浏览、下载课程视频既耗时又低效，尤其对于想要系统学习特定领域知识的用户而言，亟需更高效的解决方案。Python爬虫技术凭借其强大的自动化数据获取能力，可轻松应对这一挑战，实现网易公开课课程列表的精准解析与视频资源的批量下
  • 80亿美元押注Agent！全球第一CRM收购Informatica
    昨晚，全球第一CRM平台Salesforce在官网宣布，以80亿美元全资收购企业级AI驱动云数据管理领导者Informatica。根据收购协议条款，Informatica的A股和B-1类普通股持有者将每股获得25美元现金。本次收购将增强Salesforce的数据基础，这对部署强大且负责任的AIAgent至关重要。Informatica丰富的数据目录、数据集成、治理、质量与隐私保护、元数据管理和主数
  • Bongo-Cat-Crew:用Python打造动态音乐猫 元楼
    本文还有配套的精品资源，点击获取简介：在这个项目中，我们创建了一个将音乐、游戏和编程结合的创新体验，允许玩家通过动态猫声分类与节奏游戏OSU!互动。Python的使用使得音乐节奏识别、猫声分类逻辑和游戏接口交互成为可能。项目的核心包含了音乐节奏分析、游戏模式识别和猫声动画实现等技术要点，旨在为玩家提供独特的交互乐趣。1.Python在项目中的应用和角色1.1Python在IT行业中的普及Pytho
  • MSP430F247TPMR szrileyH TI低功耗低频振荡器内部频率高达16MHz32KHz晶振
    描述德州仪器（TI）MSP430系列超低功耗微控制器包含几个器件，这些器件特有针对多种应用的不同外设集。这种架构与5种低功耗模式相组合，专为在便携式测量应用中延长电池使用寿命而优化。该器件具有一个强大的16位RISCCPU，16位寄存器和有助于获得最大编码效率的常数发生器。数控振荡器（DCO）可在不到1μs的时间里从低功耗模式唤醒至运行模式。MSP430F23x/24x（1）/2410系列微控制器
  • 微信小程序开发全解析：流程、交互、框架对比与避坑实战 北辰alk 微信小程序微信小程序交互小程序
    文章目录一、微信小程序开发全景认知1.1技术架构解析1.2开发模式选择二、原生开发全流程详解2.1环境搭建2.2项目结构规范2.3核心API实战三、主流框架开发实践3.1Taro（React技术栈）3.1.1项目初始化3.1.2跨平台编译3.2Uni-app（Vue技术栈）3.2.1条件编译示例四、原生开发vs框架开发深度对比4.1开发效率对比4.2性能对比（数据实测）4.3跨平台能力4.4调试复
  • 基于python的api扫描器系统的设计与实现
    博主介绍：✌在职Java研发工程师、专注于程序设计、源码分享、技术交流、专注于Java技术领域和毕业设计✌温馨提示：文末有CSDN平台官方提供的老师Wechat/QQ名片:)Java精品实战案例《700套》2025最新毕业设计选题推荐：最热的500个选题o(￣▽￣)ｄ介绍在当今数字化社会，网络安全问题日益突出，为了有效识别和防范网络威胁，开发一款全面的Web应用渗透测试系统至关重要。本研究基于Py
  • AGI面临突破需要清除这两朵乌云：解码智能鸿沟的终极密码
    1.物理学史的镜鉴：科学革命的预兆1900年英国物理学家开尔文勋爵宣称"物理学大厦已告完成"，却未料及那两朵"光速悖论"与"紫外灾难"的乌云，最终催生了相对论与量子力学。这段历史在AI领域重现：当算力呈指数级增长，模型参数突破万亿级，我们依然无法教会AI"水杯会掉落"的常识。这种历史重演揭示着深刻规律——任何科学体系的突破往往始于对既有范式的质疑。正如爱因斯坦推翻绝对时空观，当前AI研究需要重新审
  • 语义分割模型的轻量化与准确率提升研究 pk_xz123456 仿真模型深度学习算法transformer深度学习人工智能算法数据结构
    语义分割模型的轻量化与准确率提升研究1.引言语义分割是计算机视觉领域的核心任务之一，它要求模型为图像中的每个像素分配一个类别标签。随着深度学习的发展，语义分割模型在多个领域得到了广泛应用，如自动驾驶、医学影像分析、遥感图像解译等。然而，现有的语义分割模型往往面临两个主要挑战：模型复杂度高导致难以部署在资源受限的设备上，以及准确率仍有提升空间以满足实际应用需求。本文将从模型轻量化和准确率提升两个角度
  • 基于小样本的高光谱图像分类任务：CMFSL方法及Python实现 pk_xz123456 仿真模型算法深度学习分类python人工智能深度学习机器学习
    基于小样本的高光谱图像分类任务：CMFSL方法及Python实现1.引言高光谱图像分类是遥感图像处理领域的重要研究方向，它在农业监测、环境评估、军事侦察等领域有着广泛的应用。与传统RGB图像不同，高光谱图像包含数百个连续的光谱波段，能够提供丰富的光谱信息。然而，高光谱图像分类面临着维度灾难、样本获取困难等挑战，特别是在小样本条件下，传统分类方法往往表现不佳。针对这一问题，本文介绍一种基于小样本的高
  • ubuntu创建、删除虚拟环境 screenCui ubuntulinux
    your_name是自己起的环境名字创建虚拟环境首先通过xshell等工具与服务器建立链接。然后进行以下两步：激活condasource~/.bashrc2.创建虚拟环境condacreate-nyour_namepython=3.7退出以及删除虚拟环境退出虚拟环境condadeactivate删除虚拟环境condaremove-nyour_name--all
  • python序列化任意结构到dict YoungHong1992 python开发语言
    defserialize(obj:Any)->Any:"""因为Param没有序列化的接口，无法直接转为dict或json，因此编写该函数,把Param转为dict"""ifisinstance(obj,np.ndarray):returnobj.tolist()#将numpy.ndarray转换为列表elifisinstance(obj,(int,float,str,bool)):#基本数据类型
  • 微软智能语音平台赋能理想汽车：创新驱动，引领智能出行新体验
    在新能源汽车与智能网联技术蓬勃发展的今天，汽车行业的创新已不再局限于动力系统与车身设计，智能化、人性化的交互体验正成为新的竞争焦点。作为中国造车新势力的佼佼者，理想汽车凭借其首款量产车型理想ONE，不仅在市场上取得了辉煌成绩，更通过与微软工业级智能语音平台的深度合作，重新定义了车载语音交互的标准，为全球汽车行业树立了智能化转型的典范。理想ONE：以家庭为核心，打造智能出行新标杆理想ONE作为理想汽
  • AI 的出现，是否能替代 IT 从业者？ 敲代码的苦13 人工智能
    在科技浪潮奔涌向前的时代，AI正以惊人的速度渗透进各个领域，IT行业首当其冲。当AI编写代码的效率不断提升，当智能算法能够快速完成系统故障诊断，当自动化工具可以处理大量数据运维工作，IT从业者们不禁心生疑虑：AI真的会成为“职业终结者”，将自己从岗位上彻底替代吗？这场关于AI与IT从业者未来的讨论，充满了争议与悬念，也关乎着无数人的职业命运。一、AI在IT领域的应用现状编程开发中的AIAI在编程开
  • 如何将 iPhone 同步到Mac？ Coolmuster iPhoneiOS苹果手机iphonemacosios
    想要将iPhone同步到Mac吗？Mac和iPhone是功能强大的Apple设备，允许用户存储文件。但只有当它们结合在一起时，你才能体验到苹果生态系统凝聚力的力量。你可以通过多种方式将iPhone连接到Mac，以实现无缝文件共享。阅读本指南，了解如何将iPhone与Mac同步并无缝共享文件。第1部分.如何通过专业工具将iPhone同步到Mac将iPhone同步到Mac最佳方法是使用专业软件Cool
  • 【C语言】学习过程教训与经验杂谈：思想准备、知识回顾（五）
    个人主页：艾莉丝努力练剑❄专栏传送门：《C语言》、《数据结构与算法》、C语言刷题12天IO强训、LeetCode代码强化刷题学习方向：C/C++方向⭐️人生格言：为天地立心，为生民立命，为往圣继绝学，为万世开太平前言：我们在学习过程中会碰到很多很多问题，本系列文章不会博主不会额外再创建一个新的专栏来收录，因为这一系列文章创作的初心主要是针对回顾知识点（遵循遗忘曲线并且根据自身的实际情况可以做出一些
  • Python爬虫实战：爬取百度学术摘要信息全流程详解与代码示例 Python爬虫项目 2025年爬虫实战项目python爬虫开发语言scrapy学习dubbo百度
    1.前言随着学术资源数字化的普及，百度学术成为学者们常用的论文搜索平台。获取大量论文摘要信息对于文献综述、知识图谱构建等研究极为重要。本文将系统讲解如何利用Python编写爬虫，批量抓取百度学术上的论文摘要。我们将结合最新Python爬虫技术，涵盖基础同步爬虫、异步爬虫、多线程，全面实战演示。2.项目背景与目标百度学术支持通过关键词搜索论文，展示论文标题、作者、期刊、摘要等信息。目标是：根据关键词
  • 如何在 Android Framework层面控制高通（Qualcomm）芯片的 CPU 和 GPU。 YoungHong1992 android高通芯片CPUGPU
    如何在AndroidFramework层面控制高通（Qualcomm）芯片的CPU和GPU。参考：https://blog.csdn.net/YoungHong1992/article/details/117047839?utm_source%20=%20uc_fansmsg作为一名Framework开发者，您拥有系统级的权限，可以直接与底层硬件接口交互。但这通常不被推荐，因为现代Android系
  • iOS 性能测试工具全流程：主流工具实战对比与适用场景 2501_91600747 httpudphttpswebsocket网络安全tcp/ip
    在iOS开发中，性能优化往往被安排到开发后期，甚至上线前才临时补救。但性能瓶颈通常是架构设计、资源加载、动画机制等多方面共同作用的结果，仅凭肉眼感知和log输出，难以精准定位。一套合适的性能测试工具组合，不仅能帮助开发者在早期识别潜在问题，还能在迭代阶段快速验证改动效果。本文从实战角度出发，汇总市面上主流的iOS性能测试工具，分析它们各自适用的场景与边界，为开发者构建适合自身项目的调试方案提供参考
  • iPhone 抓包工具有哪些？多工具对比分析优缺点 2501_91591841 httpudphttpswebsocket网络安全网络协议tcp/ip
    iOS平台一向以安全性著称，这也使得对其进行网络调试和抓包变得异常困难。相比安卓，iPhone抓包难点主要在以下几点：系统限制代理设置的灵活性无法自由安装根证书抓包常涉及HTTPS解密与双向认证破解普通用户设备无root或越狱权限因此，选择一款合适的iPhone抓包工具成为开发和测试流程中至关重要的一环。本文整理了当前主流的iOS抓包工具，分别从功能范围、使用难度、兼容性和适用场景进行横向对比，希
  • Linux 磁盘管理、文件系统、VLM和配额：从基础到实战指南 燕841 linux运维服务器
    在Linux系统运维中，磁盘管理是保障系统稳定运行的核心环节。无论是服务器扩容、新硬盘挂载，还是灵活调整存储空间，都离不开对磁盘分区、文件系统和逻辑卷的深入理解。本文将从磁盘基础讲起，逐步解析分区策略、文件系统创建、挂载管理及LVM逻辑卷技术，助你轻松驾驭Linux存储管理。一、磁盘基础：机械与固态计算机的存储核心是硬盘，从存储介质上可分为两类：机械硬盘（HDD）：依靠盘片旋转和磁头读写数据，内部
  • 大数据如何助力企业文化“软实力”升级？深挖数据背后的文化密码 Echo_Wish 大数据高阶实战秘籍大数据
    大数据如何助力企业文化“软实力”升级？深挖数据背后的文化密码今天我们聊一个听起来很“软”的话题——企业文化，但从一个不太“软”的角度来看：大数据如何参与企业文化的建设与提升。企业文化往往被看作无形资产，是团队凝聚力、创新力的源泉。但传统“喊口号”式的文化建设常常效果有限。大数据技术的兴起，给我们提供了洞察员工心理、量化文化影响的新思路，让文化建设从“感性”走向“理性”，从“盲目”变得“精准”。一、
  • C++——数据类型与输入输出
    一、基本数据类型（Primitive/Built-inTypes）1.整型（IntegerTypes）类型关键字大小（通常）范围用途短整型short2字节-32,768~32,767节省内存整型int4字节-2³¹~2³¹-1通用整数长整型long4/8字节至少与int相同大整数长长整型longlong8字节-2⁶³~2⁶³-1超大整数无符号整型unsigned同上0~2ⁿ-1（n为位数）非负整数
  • C语言——详解二级指针及其与二维数组的误区、指针定义大全
    C语言中的二级指针（也称为指针的指针）是指一个指针变量，它存储的不是普通的值，而是另一个指针的地址。这意味着你可以通过二级指针来访问和修改另一个指针的值。这种结构在C语言中非常有用，尤其是在处理动态内存分配、数组、链表等复杂数据结构时。指针变量本质上也是一个变量，包含变量类型，变量值，变量地址，变量名四个要点。指针变量与其他变量不同的地方是，指针变量的值是一个地址，我们把指针变量称为指向其保存的地
  • Linux——虚拟机网络配置
    进行虚拟机网络配置是确保虚拟机能够正常访问网络、与宿主机及其他设备进行通信的关键步骤。虚拟机网络配置允许用户根据实际需求选择合适的网络模式，并调整网络参数以满足特定的网络环境要求。虚拟机常见的三种网络模式包括桥接模式、NAT模式和主机模式，每种模式在配置、特点和对网络的影响上都有所不同：一、桥接模式（比较消耗IP地址）配置特点：虚拟机的网络适配器与物理网络适配器直接连接，虚拟机和物理网络中的其他设
  • 设计模式介绍 tntxia 设计模式
    设计模式来源于土木工程师 克里斯托弗 亚历山大（http://en.wikipedia.org/wiki/Christopher_Alexander）的早期作品。他经常发表一些作品，内容是总结他在解决设计问题方面的经验，以及这些知识与城市和建筑模式之间有何关联。有一天，亚历山大突然发现，重复使用这些模式可以让某些设计构造取得我们期望的最佳效果。 亚历山大与萨拉-石川佳纯和穆雷 西乐弗斯坦合作
  • android高级组件使用(一) 百合不是茶 androidRatingBarSpinner
    1、自动完成文本框（AutoCompleteTextView） AutoCompleteTextView从EditText派生出来，实际上也是一个文本编辑框，但它比普通编辑框多一个功能：当用户输入一个字符后，自动完成文本框会显示一个下拉菜单，供用户从中选择，当用户选择某个菜单项之后，AutoCompleteTextView按用户选择自动填写该文本框。 使用AutoCompleteTex
  • [网络与通讯]路由器市场大有潜力可挖掘 comsci 网络
              如果国内的电子厂商和计算机设备厂商觉得手机市场已经有点饱和了,那么可以考虑一下交换机和路由器市场的进入问题.....        这方面的技术和知识,目前处在一个开放型的状态,有利于各类小型电子企业进入  &nbs
  • 自写简单Redis内存统计shell 商人shang Linux shell统计Redis内存
    #!/bin/bash address="192.168.150.128:6666,192.168.150.128:6666" hosts=(${address//,/ }) sfile="staticts.log" for hostitem in ${hosts[@]} do ipport=(${hostitem
  • 单例模式(饿汉 vs懒汉) oloz 单例模式
    package 单例模式; /* * 应用场景:保证在整个应用之中某个对象的实例只有一个 * 单例模式种的《 懒汉模式》 * */ public class Singleton { //01 将构造方法私有化，外界就无法用new Singleton()的方式获得实例 private Singleton(){}; //02 申明类得唯一实例 priva
  • springMvc json支持 杨白白 json springmvc
    1.Spring mvc处理json需要使用jackson的类库，因此需要先引入jackson包 2在spring mvc中解析输入为json格式的数据:使用@RequestBody来设置输入 @RequestMapping("helloJson") public @ResponseBody JsonTest helloJson() {
  • android播放，掃描添加本地音頻文件 小桔子
            最近幾乎沒有什麽事情，繼續鼓搗我的小東西。想在項目中加入一個簡易的音樂播放器功能，就像華為p6桌面上那麼大小的音樂播放器。用過天天動聽或者QQ音樂播放器的人都知道，可已通過本地掃描添加歌曲。不知道他們是怎麼實現的，我覺得應該掃描設備上的所有文件，過濾出音頻文件，每個文件實例化為一個實體，記錄文件名、路徑、歌手、類型、大小等信息。具體算法思想，
  • oracle常用命令 aichenglong oracledba常用命令
    1 创建临时表空间 create temporary tablespace user_temp  tempfile 'D:\oracle\oradata\Oracle9i\user_temp.dbf' size 50m  autoextend on  next 50m maxsize 20480m  extent management local
  • 25个Eclipse插件 AILIKES eclipse插件
    提高代码质量的插件1. FindBugsFindBugs可以帮你找到Java代码中的bug，它使用Lesser GNU Public License的自由软件许可。2. CheckstyleCheckstyle插件可以集成到Eclipse IDE中去，能确保Java代码遵循标准代码样式。3. ECLemmaECLemma是一款拥有Eclipse Public License许可的免费工具，它提供了
  • Spring MVC拦截器+注解方式实现防止表单重复提交 baalwolf spring mvc
    原理：在新建页面中Session保存token随机码，当保存时验证，通过后删除，当再次点击保存时由于服务器端的Session中已经不存在了，所有无法验证通过。   1.新建注解：   ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18
  • 《Javascript高级程序设计(第3版)》闭包理解 bijian1013 JavaScript
    “闭包是指有权访问另一个函数作用域中的变量的函数。”--《Javascript高级程序设计(第3版)》         看以下代码： <script type="text/javascript"> function outer() { var i = 10; return f
  • AngularJS Module类的方法 bijian1013 JavaScriptAngularJSModule
            AngularJS中的Module类负责定义应用如何启动，它还可以通过声明的方式定义应用中的各个片段。我们来看看它是如何实现这些功能的。 一.Main方法在哪里         如果你是从Java或者Python编程语言转过来的，那么你可能很想知道AngularJS里面的main方法在哪里？这个把所
  • [Maven学习笔记七]Maven插件和目标 bit1129 maven插件
    插件(plugin)和目标(goal) Maven，就其本质而言，是一个插件执行框架，Maven的每个目标的执行逻辑都是由插件来完成的，一个插件可以有1个或者几个目标，比如maven-compiler-plugin插件包含compile和testCompile，即maven-compiler-plugin提供了源代码编译和测试源代码编译的两个目标   使用插件和目标使得我们可以干预
  • 【Hadoop八】Yarn的资源调度策略 bit1129 hadoop
    1. Hadoop的三种调度策略 Hadoop提供了3中作业调用的策略， FIFO Scheduler Fair Scheduler Capacity Scheduler 以上三种调度算法，在Hadoop MR1中就引入了，在Yarn中对它们进行了改进和完善.Fair和Capacity Scheduler用于多用户共享的资源调度   2. 多用户资源共享的调度
  • Nginx使用Linux内存加速静态文件访问 ronin47
    Nginx是一个非常出色的静态资源web服务器。如果你嫌它还不够快，可以把放在磁盘中的文件，映射到内存中，减少高并发下的磁盘IO。 先做几个假设。nginx.conf中所配置站点的路径是/home/wwwroot/res，站点所对应文件原始存储路径：/opt/web/res shell脚本非常简单，思路就是拷贝资源文件到内存中，然后在把网站的静态文件链接指向到内存中即可。具体如下：
  • 关于Unity3D中的Shader的知识 brotherlamp unityunity资料unity教程unity视频unity自学
    首先先解释下Unity3D的Shader，Unity里面的Shaders是使用一种叫ShaderLab的语言编写的，它同微软的FX文件或者NVIDIA的CgFX有些类似。传统意义上的vertex shader和pixel shader还是使用标准的Cg/HLSL 编程语言编写的。因此Unity文档里面的Shader，都是指用ShaderLab编写的代码，然后我们来看下Unity3D自带的60多个S
  • CopyOnWriteArrayList vs ArrayList bylijinnan java
    package com.ljn.base; import java.util.ArrayList; import java.util.Iterator; import java.util.List; import java.util.concurrent.CopyOnWriteArrayList; /** * 总述： * 1.ArrayListi不是线程安全的，CopyO
  • 内存中栈和堆的区别 chicony 内存
    1、内存分配方面：     堆：一般由程序员分配释放， 若程序员不释放，程序结束时可能由OS回收 。注意它与数据结构中的堆是两回事，分配方式是类似于链表。可能用到的关键字如下：new、malloc、delete、free等等。     栈：由编译器(Compiler)自动分配释放，存放函数的参数值，局部变量的值等。其操作方式类似于数据结构中
  • 回答一位网友对Scala的提问 chenchao051 scalamap
    本来准备在私信里直接回复了，但是发现不太方便，就简要回答在这里。 问题 写道 对于scala的简洁十分佩服，但又觉得比较晦涩，例如一例，Map("a" -> List(11,111)).flatMap(_._2)，可否说下最后那个函数做了什么，真正在开发的时候也会如此简洁？谢谢    先回答一点，在实际使用中，Scala毫无疑问就是这么简单。
  • mysql 取每组前几条记录 daizj mysql分组最大值最小值每组三条记录
    一、对分组的记录取前N条记录：例如：取每组的前3条最大的记录 1.用子查询： SELECT * FROM tableName a  WHERE 3> (SELECT COUNT(*) FROM  tableName b WHERE b.id=a.id AND b.cnt>a. cnt) ORDER BY a.id,a.account DE
  • HTTP深入浅出 http请求 dcj3sjt126com http
      HTTP(HyperText Transfer Protocol)是一套计算机通过网络进行通信的规则。计算机专家设计出HTTP，使HTTP客户（如Web浏览器）能够从HTTP服务器(Web服务器)请求信息和服务，HTTP目前协议的版本是1.1.HTTP是一种无状态的协议，无状态是指Web浏览器和Web服务器之间不需要建立持久的连接，这意味着当一个客户端向服务器端发出请求，然后We
  • 判断MySQL记录是否存在方法比较 dcj3sjt126com mysql
    把数据写入到数据库的时，常常会碰到先要检测要插入的记录是否存在，然后决定是否要写入。 　　我这里总结了判断记录是否存在的常用方法： 　　sql语句： select   count ( * )  from  tablename; 　　然后读取count(*)的值判断记录是否存在。对于这种方法性能上有些浪费，我们只是想判断记录记录是否存在，没有必要全部都查出来。
  • 对HTML XML的一点认识 e200702084 htmlxml
    感谢http://www.w3school.com.cn提供的资料 HTML 文档中的每个成分都是一个节点。 节点 根据 DOM，HTML 文档中的每个成分都是一个节点。 DOM 是这样规定的： 整个文档是一个文档节点 每个 HTML 标签是一个元素节点 包含在 HTML 元素中的文本是文本节点 每一个 HTML 属性是一个属性节点 注释属于注释节点 Node 层次
  • jquery分页插件 genaiwei jqueryWeb前端分页插件
    //jquery页码控件// 创建一个闭包    (function($) {      // 插件的定义      $.fn.pageTool = function(options) {        var totalPa
  • Mybatis与Ibatis对照入门于学习 Josh_Persistence mybatisibatis区别联系
    一、为什么使用IBatis/Mybatis         对于从事 Java EE 的开发人员来说，iBatis 是一个再熟悉不过的持久层框架了，在 Hibernate、JPA 这样的一站式对象 / 关系映射（O/R Mapping）解决方案盛行之前，iBaits 基本是持久层框架的不二选择。即使在持久层框架层出不穷的今天，iBatis 凭借着易学易用、
  • C中怎样合理决定使用那种整数类型？ 秋风扫落叶 c数据类型
    如果需要大数值(大于32767或小于32767), 使用long 型。 否则, 如果空间很重要 (如有大数组或很多结构), 使用 short 型。 除此之外, 就使用 int 型。 如果严格定义的溢出特征很重要而负值无关紧要, 或者你希望在操作二进制位和字节时避免符号扩展的问题, 请使用对应的无符号类型。 但是, 要注意在表达式中混用有符号和无符号值的情况。    &nbs
  • maven问题 zhb8015 maven问题
      问题1： Eclipse 中 新建maven项目 无法添加src/main/java 问题    eclipse创建maevn web项目，在选择maven_archetype_web原型后，默认只有src/main/resources这个Source Floder。     按照maven目录结构，添加src/main/ja
  • (二)androidpn-server tomcat版源码解析之--push消息处理 spjich javaandrodipn推送
    在 (一)androidpn-server tomcat版源码解析之--项目启动这篇中，已经描述了整个推送服务器的启动过程，并且把握到了消息的入口即XmppIoHandler这个类，今天我将继续往下分析下面的核心代码，主要分为3大块，链接创建，消息的发送，链接关闭。 先贴一段XmppIoHandler的部分代码 /** * Invoked from an I/O proc
  • 用js中的formData类型解决ajax提交表单时文件不能被serialize方法序列化的问题 中华好儿孙 JavaScriptAjaxWeb上传文件FormData
    var formData = new FormData($("#inputFileForm")[0]); $.ajax({ type:'post', url:webRoot+"/electronicContractUrl/webapp/uploadfile", data:formData, async: false, ca
  • mybatis常用jdbcType数据类型 ysj5125094 mybatismapperjdbcType
      MyBatis 通过包含的jdbcType 类型 BIT         FLOAT      CHAR          
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他