初闻女人香
初闻女人香

实现图片点击切换、通过classList修改样式、操作表单元素属性、自定义属性

实现图片点击切换

DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Documenttitle>
head>
<style>
    * {
        box-sizing: border-box;
    }

    .box {
        background-color: pink;
        width: 200px;
        height: 150px;
        border: 1px solid black;

    }
    #NameBox{
        font-size: 50px;
        text-align: center;
        line-height: 150px;
        color: azure;
    }
style>

<body>
    <div class="box" id="NameBox">div>
    <img src="../img/1.jpeg">


    <script>
        const box = document.querySelector('.box')
        const NameBox = document.getElementById('NameBox');
        box.style.width = '400px'

        function getRandom(N, M) {
            return Math.floor(Math.random() * (M - N + 1)) + N
        }

        const img = document.querySelector('img')//获取元素
        const random = getRandom(1, 6)
        img.src = `../img/${random}.jpeg`


        let num = 1;

        function showMessage() {
            num++;
            if (num % 5 === 0) {
                img.src = `../img/3.jpeg`
                NameBox.textContent = '图片3';
            } else if (num % 2 === 0) {
                img.src = `../img/2.jpeg`
                NameBox.textContent = '图片2';
            } else {
                img.src = `../img/1.jpeg`
                NameBox.textContent = '图片1';
            }
            console.log(num);
            // img.src = `../img/${num}.jpeg`

            

        }
        img.addEventListener('click', showMessage)//img
    script>
body>

html>

通过classList修改样式

实现图片点击切换、通过classList修改样式、操作表单元素属性、自定义属性_第1张图片

DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Documenttitle>
head>
<style>
    .box{
        width: 200px;
        height: 200px;
        color: #333;
    }
    .active{
        color: red;
        background-color: pink;
    }
style>
<body>
    <div class="box">文字div>
    <script>
        //通过classList添加
        //获取元素
        const box = document.querySelector('.box')
        //修改样式 
        //追加类 add() 类名不加点 并且是字符串
        box.classList.add('active')
        //删除类 remove() 类名不加点 并且是字符串
        box.classList.remove('box')
        //切换类 toggle() 有就删掉，没有就加上
        box.classList.toggle('active')

    script>
body>
html>

实现图片点击切换、通过classList修改样式、操作表单元素属性、自定义属性_第2张图片

操作表单元素属性

实现图片点击切换、通过classList修改样式、操作表单元素属性、自定义属性_第3张图片
实现图片点击切换、通过classList修改样式、操作表单元素属性、自定义属性_第4张图片
实现图片点击切换、通过classList修改样式、操作表单元素属性、自定义属性_第5张图片
实现图片点击切换、通过classList修改样式、操作表单元素属性、自定义属性_第6张图片

自定义属性

实现图片点击切换、通过classList修改样式、操作表单元素属性、自定义属性_第7张图片

实现图片点击切换、通过classList修改样式、操作表单元素属性、自定义属性_第8张图片

实现图片点击切换、通过classList修改样式、操作表单元素属性、自定义属性_第9张图片
实现图片点击切换、通过classList修改样式、操作表单元素属性、自定义属性_第10张图片
输出结果为
实现图片点击切换、通过classList修改样式、操作表单元素属性、自定义属性_第11张图片
实现图片点击切换、通过classList修改样式、操作表单元素属性、自定义属性_第12张图片
实现图片点击切换、通过classList修改样式、操作表单元素属性、自定义属性_第13张图片

你可能感兴趣的:(前端)

  • JavaScript 树形菜单总结 Auscy microsoft
    树形菜单是前端开发中常见的交互组件，用于展示具有层级关系的数据（如文件目录、分类列表、组织架构等）。以下从核心概念、实现方式、常见功能及优化方向等方面进行总结。一、核心概念层级结构：数据以父子嵌套形式存在，如{id:1,children:[{id:2}]}。节点：树形结构的基本单元，包含自身信息及子节点（若有）。展开/折叠：子节点的显示与隐藏切换，是树形菜单的核心交互。递归渲染：因数据层级不固定，
  • 前端项目架构设计要领
    1.架构设计的核心目标在设计前端项目架构时，核心目标是模块化、可维护、可扩展、可测试，以及开发效率的最大化。这些目标可以通过以下几个方面来实现：组件化：将UI功能封装为可复用的组件。模块化：将业务逻辑分解为独立的模块或服务。自动化构建与部署：实现自动化构建、测试和部署流程，减少人为操作的错误。代码规范化与检查：确保团队协作时，代码风格和质量一致。2.项目目录结构设计一个清晰合理的目录结构对大型项目
  • 【前端】jQuery数组合并去重方法总结
    在jQuery中合并多个数组并去重，推荐使用原生JavaScript的Set对象（高效简单）或$.unique()（仅适用于DOM元素，不适用于普通数组）。以下是完整解决方案：方法1：使用ES6Set（推荐）//定义多个数组constarr1=[1,2,3];constarr2=[2,3,4];constarr3=[3,4,5];//合并数组并用Set去重constmergedArray=[...
  • Vue3+Vite+TS+Axios整合详细教程 老马聊技术 VueViteTSvue.js
    1.Vite简介Vite是新一代的前端构建工具，在尤雨溪开发Vue3.0的时候诞生。类似于Webpack+Webpack-dev-server。其主要利用浏览器ESM特性导入组织代码，在服务器端按需编译返回，完全跳过了打包这个概念，服务器随起随用。生产中利用Rollup作为打包工具，号称下一代的前端构建工具。vite是一种新型的前端构建工具，能够显著的提升前端开发者的体验。它主要有俩部分组成：一个
  • 前端 NPM 包的依赖可视化分析工具推荐 前端视界 前端艺匠馆前端npmarcgisai
    前端NPM包的依赖可视化分析工具推荐关键词：NPM、依赖管理、可视化分析、前端工程、包管理、依赖冲突、性能优化摘要：本文将深入探讨前端开发中NPM包依赖可视化分析的重要性，介绍5款主流工具的使用方法和特点，并通过实际案例展示如何利用这些工具优化项目依赖结构、解决版本冲突问题以及提升构建性能。文章将帮助开发者更好地理解和掌控项目依赖关系，提高开发效率和项目可维护性。背景介绍目的和范围本文旨在为前端开
  • 数字孪生技术为UI前端注入新活力：实现产品设计的沉浸式体验 ui设计前端开发老司机 ui
    hello宝子们...我们是艾斯视觉擅长ui设计、前端开发、数字孪生、大数据、三维建模、三维动画10年+经验!希望我的分享能帮助到您!如需帮助可以评论关注私信我们一起探讨!致敬感谢感恩!一、引言：从“平面交互”到“沉浸体验”的UI革命当用户在电商APP中翻看3D家具模型却无法感知其与自家客厅的匹配度，当设计师在2D屏幕上绘制汽车内饰却难以预判实际乘坐体验——传统UI设计的“平面化、静态化、割裂感”
  • Java三年经验程序员技术栈全景指南：从前端到架构，对标阿里美团全栈要求 可曾去过倒悬山 java前端架构
    Java三年经验程序员技术栈全景指南：从前端到架构，对标阿里美团全栈要求三年经验是Java程序员的分水岭，技术栈深度决定你成为“业务码农”还是“架构师候选人”。本文整合阿里、美团、滴滴等大厂招聘要求，为你绘制可落地的进阶路线。一、Java核心：从语法糖到JVM底层三年经验与初级的核心差异在于系统级理解，大厂面试常考以下能力：JVM与性能调优内存模型（堆外内存、元空间）、GC算法（G1/ZGC适用场
  • 《Java前端开发全栈指南：从Servlet到现代框架实战》
    前言在当今Web开发领域，Java依然是后端开发的主力语言，而随着前后端分离架构的普及，Java开发者也需要掌握前端技术栈。本文将全面介绍JavaWeb前端开发的核心技术，包括传统Servlet/JSP体系、现代前端框架集成方案，以及全栈开发的最佳实践。通过本文，您将了解如何构建现代化的JavaWeb应用前端界面。一、JavaWeb前端技术演进1.1传统技术栈Servlet：JavaWeb基础，处
  • Vue3组件库实战: 打造高复用UI系统 武昌库里写JAVA 面试题汇总与解析课程设计springbootvue.jslayui毕业设计
    Vue3组件库实战:打造高复用UI系统介绍什么是Vue3组件库在前端开发中，UI组件库是非常重要的一部分。Vue3组件库是基于Vue.js3.x版本开发的一套可用于构建Web应用的UI组件集合，可以帮助开发者快速搭建页面并保证页面的一致性和美观性。目标关键词：Vue3组件库设计与构建设计原则组件库的设计需要遵循一定的原则，比如易用性、可维护性、扩展性等。在设计阶段需要考虑到不同场景的使用，并且保证
  • Flutter基础（前端教程⑥-按钮切换） aaiier Flutterflutter前端状态模式
    1.假设你已有的两个表单组件（示例）//手机号注册表单（示例）classPhoneRegisterFormextendsStatelessWidget{@overrideWidgetbuild(BuildContextcontext){returnColumn(children:[TextField(decoration:InputDecoration(labelText:'手机号')),Text
  • 为Layui Table组件添加前端搜索功能 caifox菜狐狸 JavaScript学习之旅：从新手到专家前端layuijavascripttable前端搜索表格搜索前端框架
    在现代Web开发中，数据展示和交互功能是构建高效、用户友好界面的关键要素之一。Layui作为一款广受欢迎的前端UI框架，以其简洁的代码、丰富的组件和强大的功能，为开发者提供了极大的便利。其中，Layui的Table组件更是以其强大的数据展示能力和灵活的配置选项，成为了许多项目中不可或缺的部分。然而，在实际应用中，仅仅展示数据往往是不够的。用户通常需要根据自己的需求快速查找特定信息，这就需要为表格添
  • Vue.js 过渡 & 动画 lsx202406 开发语言
    Vue.js过渡&动画引言在Web开发中，过渡与动画是提升用户体验的关键元素。Vue.js作为一款流行的前端框架，提供了强大的过渡与动画功能，使得开发者能够轻松实现丰富的交互效果。本文将深入探讨Vue.js中的过渡与动画，包括其原理、应用场景以及实现方法。一、Vue.js过渡原理Vue.js过渡是利用CSS3的transition属性实现的。当Vue.js侦测到数据变化时，会自动触发过渡效果。过渡
  • GPT实操——利用GPT创建一个应用 狗木马 深度学习gpt-3gpt
    功能描述信息查询：用户可以询问各种问题，如天气、新闻、股票等，机器人会返回相关信息。任务执行：用户可以要求机器人执行一些简单的任务，如设置提醒、发送邮件等。情感支持：机器人可以与用户进行情感交流，提供安慰和支持。个性化设置：用户可以自定义机器人的回复风格和偏好。技术栈前端：React.js后端：Node.js+Express数据库：MongoDB自然语言处理：OpenAIGPT-3API其他工具：
  • 前端面试题总结——JS篇 又又呢 前端javascript开发语言
    一、说说JavaScript中的数据类型？存储上有什么差别？1、数据类型基本类型number：数值类型十进制：letintNum=55八进制（零开头）：letnum1=070十六进制（0x开头）：lethexNum1=0xANaN：特殊数值，意为“不是数值”string：字符串类型boolean：布尔值，true或falseundefined：表示未定义null：空值symbol：是原始值，且符号
  • 前端面试题——5.AjAX的缺点？ 浅端 前端面试题前端面试题
    ①传统的web交互是：用户一个网页动作，就会发送一个http请求到服务器，服务器处理完该请求再返回一个完整的HTML页面，客户端再重新加载，这样极大地浪费了带宽。②AJAX的出现解决了这个问题，它只会向服务器请求用户所需要的数据，并在客户端采用JavaScript处理返回的数据，操作DOM更新页面。③AJXA优点：无刷新更新页面异步服务器通信前端后端负载均衡④AJAX缺点：干掉了Back和Hist
  • 2023高薪前端面试题（二、前端核心——Ajax）
    原生AjaxAjax简介Ajax全程为AsynchronousJavaScript+XML，就是异步的JS和XML通过AJAX可以在浏览器中向服务器发送异步请求，最大的优势是：无刷新获取数据，实现局部刷新Ajax是一种用于创建快速动态网页的技术AJAX不是新的编程语言，而是一种将现有的标准组合在一起使用的新方式Ajax的应用场景页面上拉加载更多数据列表数据无刷新分页表单项离开焦点数据验证搜索框提示
  • 前端面试题——手写实现 ajax 阿水爱踢中锋 ajaxjs前端
    凡是和后台有过数据交互的小伙伴肯定都接触过ajax.我们可以通过ajax来实现页面的无刷新请求数据，这样就能在保证良好用户体验的同时，将更多的内容展示给用户ajax在我们的开发工作中已经司空见惯，几乎所有我们频繁使用的库和框架都提供了经过完善封装后的ajax方法，如jQuery、zepto、angular等等，这使得我们的数据请求变得异常简洁明了但是这也带来了很明显的缺陷，就是我们知道如何去使用封
  • uniapp 如何封装实现任意页面都能使用的全局弹窗 代码简单说 2025开发必备(限时特惠)uni-appvue.jsjavascriptuniapp全局弹窗uniapp弹窗组件
    【实战干货】uniapp如何封装实现任意页面都能使用的全局弹窗标签：uniapp弹窗组件全局弹窗Vue动态渲染跨页面弹窗✨前端老司机亲授，uniapp无法在所有页面中直接用自定义弹窗？别急，一招动态挂载vue实例，优雅解决！背景故事：一个被“弹窗”搞崩溃的早晨作为一名前端开发工程师，有一天我在给uniapp项目加IM消息功能，需求是：不论当前用户在哪个页面，只要有消息来，就要立即弹出提示窗口。听起
  • 【前端】接口日志追踪 毕业茄 前端
    1.问题描述场景：前端提交数据后，接口回调再次添加参数，但页面跳转/刷新导致之前的console.log数据丢失。影响：无法追踪完整的请求流程，调试困难。2.环境信息项目说明浏览器GoogleChrome120+开发者工具ChromeDevTools技术栈前端：Vue/React/其他接口类型RESTfulAPI/GraphQL3.解决方案3.1保留控制台日志（推荐）步骤：打开Chrome开发者工
  • 【前端】异步任务风控验证与轮询机制技术方案（通用笔记版）
    一、背景场景在某类生成任务中，例如用户点击“执行任务”按钮后触发一个较耗时的后端操作（如生成报告、渲染图像、转码视频等），由于其调用了模型、渲染服务或需要较长处理时间，为了防止接口被频繁恶意调用，系统需要加入风控验证机制。此外，因任务处理为异步，前端无法立即获得最终结果，因此需通过轮询方式定期查询任务状态，等待任务完成后展示结果。二、整体流程说明1.用户点击“执行任务”按钮：前端调用风控接口/ap
  • uniapp对接unipush 1.0 ios/android 车轮滚滚__ uni-appiosandroid
    配置注意需要打包自定义基座之后在手机上运行自定义基座才可以！官方有文档可以根据文档来我这里用的是1.0为什么没有2.0因为2.0要用uinicloud注意每次打包之后cid都会变cid用户的标识iduniapp通过这个id可以把消息推送给指定人前端代码前端要做的很简单直接放到app.vue中onLaunch钩子中即可麻烦的在后端和个推的对接onPushMessage(that){//#ifdefA
  • 在html中加入网址,网页超链接怎么做，添加超链接网址的的详细步骤 一只爪子 在html中加入网址
    此系列教程主要讲解HTML从基础到精通。自己能够设计一个完整的前端网页项目。程序员写代码在HTML中添加图片其实很简单，就是添加一个img的标签。图片标签的语法一般有src、alt、width、height四种属性就够用了。效果：图片的显示效果图片路径的写法src表示的是图片的路径，这里面的值应该怎么写呢？(1)html文件和图片在相同一个文件夹下。HTML文件和图片文件在相同的目录下，可以直接书
  • uniapp项目如何优雅处理Token失效自动重试 token无感刷新 代码简单说 2025开发必备(限时特惠)uni-appuniapptoken重试uniapptoken获取token无感刷新uniapp自动刷新token前端登录状态管理token自动刷新
    uniapp项目如何优雅处理Token失效自动重试token无感刷新标签：uniapp｜前端登录状态管理｜Token自动刷新｜前端重试队列作为一名前端开发，我在重构公司旧项目时，踩到了一个大家经常遇到的坑：Token失效后请求失败，用户体验极差。而更糟糕的是，在一个页面里多个请求同时发出，全部失败并跳转登录，场面就像是“弹窗地狱”。我决定把这个问题解决到底，封装出一个可复用、稳定、自动重试的请求模
  • 前端每周清单第 16 期：JavaScript 模块化现状；Node V8 与V6 真实性能对比
    前端每周清单第16期：JavaScript模块化现状；NodeV8与V6真实性能对比；Nuxt.jsSSR与权限验证指南为InfoQ中文站特供稿件，首发地址为这里；如需转载，请与InfoQ中文站联系。从属于笔者的Web前端入门与工程实践的前端每周清单系列系列；部分文章需要自备梯子。前端每周清单第16期：JavaScript模块化现状；NodeV8与V6真实性能对比；Nuxt.jsSSR与权限验证指
  • 【译】2018 前端性能优化清单 —— 第一部分 qq_36320160 前端前端
    原文地址：Front-EndPerformanceChecklist2018-Part1原文作者：VitalyFriedman译文出自：掘金翻译计划本文永久链接：https://github.com/xitu/gold-miner/blob/master/TODO/front-end-performance-checklist-2018-1.md译者：tvChan校对者：mysterytonyry
  • 如何做到无感刷新token?
    如何做到无感刷新token?前言后端刷新Token方案--自动刷新token前端刷新Token方案--token续约疑问及思考前言解决方案：自动刷新tokentoken续约思路如果Token即将过期，你在验证用户权限的同时，为用户生成一个新的Token并返回给客户端，客户端需要更新本地存储的Token，还可以做定时任务来刷新Token，可以不生成新的Token，在快过期的时候，直接给Token增加
  • uniapp登录成功后跳回原有页面+无感刷新token 黑匣子~ uniappuni-apptoken
    uniapp登录成功后跳回原有页面引言在C端的页面场景中，我们经常会有几种情况到登录页：区分需要登录和不用登录的页面，点击需要登录才能查看的页面已经登录但是超时，用户凭证失效等原因以上情况可以细分为两种，一种是从未登录过的，需要第一次去登录，还一种是已经登录了，但是cookie失效了，需要重新获取用户凭证，这样的话后端会将两个状态码区分，那我们前端需要根据不同的状态码进行相应的处理。第一次登录时当
  • 前端开发常见问题
    技术文章大纲性能优化问题页面加载速度慢的常见原因及解决方案渲染阻塞资源的处理方法图片与媒体文件优化策略懒加载与代码分割的实现方式浏览器兼容性问题不同浏览器对CSS特性的支持差异JavaScriptAPI的兼容性处理方案Polyfill的使用场景与实现方法自动化测试工具在兼容性测试中的应用响应式设计挑战移动端与桌面端布局适配问题媒体查询的最佳实践方案视口单位与相对单位的正确使用高DPI屏幕的图像处理
  • 反射+注解实现数据库Map转换成实体Map工具类 皮卡丘比比比
    实现场景因为原始的需求是从数据库中查询出来的一个实体字段比如一个Useruser=newUser（）的实体类，有userName，userId两个字段。然后我返回一个list给前端，Listlist现在需求变化，我需要添加一个额外的字段，比如userCompany，就没有办法使用刚才那个返回对象的方法现在直接从数据库中多表查询一个Map如下("user_name","curry"),("user_
  • web 系统对接钉钉三方登录完整步骤实战使用示例
    Web系统对接钉钉三方登录完整步骤实战以下是基于OAuth2.0授权码模式的完整对接流程（以扫码登录为例）：一、准备工作注册钉钉开发者账号钉钉开放平台→创建企业内部应用（或第三方应用）记录AppKey和AppSecret配置回调域名（如https://yourdomain.com/callback）授权权限在应用权限中开启成员信息读权限（auth/user）二、前端实现：生成登录二维码window
  • Hadoop(一) 朱辉辉33 hadooplinux
    今天在诺基亚第一天开始培训大数据，因为之前没接触过Linux，所以这次一起学了，任务量还是蛮大的。 首先下载安装了Xshell软件，然后公司给了账号密码连接上了河南郑州那边的服务器，接下来开始按照给的资料学习，全英文的，头也不讲解，说锻炼我们的学习能力，然后就开始跌跌撞撞的自学。这里写部分已经运行成功的代码吧.    在hdfs下，运行hadoop fs -mkdir /u
  • maven An error occurred while filtering resources blackproof maven报错
    转：http://stackoverflow.com/questions/18145774/eclipse-an-error-occurred-while-filtering-resources   maven报错： maven An error occurred while filtering resources   Maven -> Update Proje
  • jdk常用故障排查命令 daysinsun jvm
    linux下常见定位命令： 1、jps      输出Java进程       -q       只输出进程ID的名称，省略主类的名称；       -m      输出进程启动时传递给main函数的参数；     &nb
  • java 位移运算与乘法运算 周凡杨 java位移运算乘法
      对于 JAVA 编程中，适当的采用位移运算，会减少代码的运行时间，提高项目的运行效率。这个可以从一道面试题说起：     问题： 用最有效率的方法算出2 乘以8 等於几?” 答案：2 << 3 由此就引发了我的思考，为什么位移运算会比乘法运算更快呢？其实简单的想想，计算机的内存是用由 0 和 1 组成的二
  • java中的枚举(enmu) g21121 java
    从jdk1.5开始，java增加了enum(枚举)这个类型，但是大家在平时运用中还是比较少用到枚举的，而且很多人和我一样对枚举一知半解，下面就跟大家一起学习下enmu枚举。先看一个最简单的枚举类型，一个返回类型的枚举： public enum ResultType { /** * 成功 */ SUCCESS, /** * 失败 */ FAIL,
  • MQ初级学习 510888780 activemq
    1.下载ActiveMQ 去官方网站下载：http://activemq.apache.org/ 2.运行ActiveMQ 解压缩apache-activemq-5.9.0-bin.zip到C盘，然后双击apache-activemq-5.9.0-\bin\activemq-admin.bat运行ActiveMQ程序。 启动ActiveMQ以后，登陆：http://localhos
  • Spring_Transactional_Propagation 布衣凌宇 springtransactional
    //事务传播属性 @Transactional(propagation=Propagation.REQUIRED)//如果有事务，那么加入事务，没有的话新创建一个 @Transactional(propagation=Propagation.NOT_SUPPORTED)//这个方法不开启事务 @Transactional(propagation=Propagation.REQUIREDS_N
  • 我的spring学习笔记12-idref与ref的区别 aijuans spring
    idref用来将容器内其他bean的id传给<constructor-arg>/<property>元素，同时提供错误验证功能。例如： <bean id ="theTargetBean" class="..." /> <bean id ="theClientBean" class=&quo
  • Jqplot之折线图 antlove jsjqueryWebtimeseriesjqplot
    timeseriesChart.html <script type="text/javascript" src="jslib/jquery.min.js"></script> <script type="text/javascript" src="jslib/excanvas.min.js&
  • JDBC中事务处理应用 百合不是茶 javaJDBC编程事务控制语句
      解释事务的概念; 事务控制是sql语句中的核心之一;事务控制的作用就是保证数据的正常执行与异常之后可以恢复   事务常用命令:             Commit提交         
  • [转]ConcurrentHashMap Collections.synchronizedMap和Hashtable讨论 bijian1013 java多线程线程安全HashMap
    在Java类库中出现的第一个关联的集合类是Hashtable，它是JDK1.0的一部分。 Hashtable提供了一种易于使用的、线程安全的、关联的map功能，这当然也是方便的。然而，线程安全性是凭代价换来的――Hashtable的所有方法都是同步的。此时，无竞争的同步会导致可观的性能代价。Hashtable的后继者HashMap是作为JDK1.2中的集合框架的一部分出现的，它通过提供一个不同步的
  • ng-if与ng-show、ng-hide指令的区别和注意事项 bijian1013 JavaScriptAngularJS
            angularJS中的ng-show、ng-hide、ng-if指令都可以用来控制dom元素的显示或隐藏。ng-show和ng-hide根据所给表达式的值来显示或隐藏HTML元素。当赋值给ng-show指令的值为false时元素会被隐藏，值为true时元素会显示。ng-hide功能类似，使用方式相反。元素的显示或
  • 【持久化框架MyBatis3七】MyBatis3定义typeHandler bit1129 TypeHandler
    什么是typeHandler? typeHandler用于将某个类型的数据映射到表的某一列上，以完成MyBatis列跟某个属性的映射   内置typeHandler MyBatis内置了很多typeHandler，这写typeHandler通过org.apache.ibatis.type.TypeHandlerRegistry进行注册，比如对于日期型数据的typeHandler，
  • 上传下载文件rz,sz命令 bitcarter linux命令rz
    刚开始使用rz上传和sz下载命令： 因为我们是通过secureCRT终端工具进行使用的所以会有上传下载这样的需求： 我遇到的问题： sz下载A文件10M左右，没有问题 但是将这个文件A再传到另一天服务器上时就出现传不上去，甚至出现乱码，死掉现象，具体问题 解决方法： 上传命令改为;rz -ybe 下载命令改为：sz -be filename 如果还是有问题： 那就是文
  • 通过ngx-lua来统计nginx上的虚拟主机性能数据 ronin47 ngx-lua　统计 解禁ip
    介绍 以前我们为nginx做统计,都是通过对日志的分析来完成.比较麻烦,现在基于ngx_lua插件,开发了实时统计站点状态的脚本,解放生产力.项目主页: https://github.com/skyeydemon/ngx-lua-stats 功能 支持分不同虚拟主机统计, 同一个虚拟主机下可以分不同的location统计. 可以统计与query-times request-time
  • java-68-把数组排成最小的数。一个正整数数组，将它们连接起来排成一个数，输出能排出的所有数字中最小的。例如输入数组{32, 321}，则输出32132 bylijinnan java
    import java.util.Arrays; import java.util.Comparator; public class MinNumFromIntArray { /** * Q68输入一个正整数数组，将它们连接起来排成一个数，输出能排出的所有数字中最小的一个。 * 例如输入数组{32, 321}，则输出这两个能排成的最小数字32132。请给出解决问题
  • Oracle基本操作 ccii Oracle SQL总结Oracle SQL语法Oracle基本操作Oracle SQL
    一、表操作 1. 常用数据类型 NUMBER(p,s)：可变长度的数字。p表示整数加小数的最大位数，s为最大小数位数。支持最大精度为38位 NVARCHAR2(size)：变长字符串，最大长度为4000字节（以字符数为单位） VARCHAR2(size)：变长字符串，最大长度为4000字节（以字节数为单位） CHAR(size)：定长字符串，最大长度为2000字节，最小为1字节，默认
  • [强人工智能]实现强人工智能的路线图 comsci 人工智能
        1：创建一个用于记录拓扑网络连接的矩阵数据表      2:自动构造或者人工复制一个包含10万个连接(1000*1000)的流程图      3：将这个流程图导入到矩阵数据表中      4：在矩阵的每个有意义的节点中嵌入一段简单的
  • 给Tomcat，Apache配置gzip压缩(HTTP压缩)功能 cwqcwqmax9 apache
    背景： HTTP 压缩可以大大提高浏览网站的速度，它的原理是，在客户端请求网页后，从服务器端将网页文件压缩，再下载到客户端，由客户端的浏览器负责解压缩并浏览。相对于普通的浏览过程HTML ,CSS,Javascript , Text ，它可以节省40%左右的流量。更为重要的是，它可以对动态生成的，包括CGI、PHP , JSP , ASP , Servlet,SHTML等输出的网页也能进行压缩，
  • SpringMVC and Struts2 dashuaifu struts2springMVC
    SpringMVC VS Struts2 1: spring3开发效率高于struts 2: spring3 mvc可以认为已经100%零配置 3: struts2是类级别的拦截， 一个类对应一个request上下文， springmvc是方法级别的拦截，一个方法对应一个request上下文，而方法同时又跟一个url对应 所以说从架构本身上 spring3 mvc就容易实现r
  • windows常用命令行命令 dcj3sjt126com windowscmdcommand
    在windows系统中，点击开始－运行，可以直接输入命令行，快速打开一些原本需要多次点击图标才能打开的界面，如常用的输入cmd打开dos命令行，输入taskmgr打开任务管理器。此处列出了网上搜集到的一些常用命令。winver 检查windows版本 wmimgmt.msc 打开windows管理体系结构(wmi) wupdmgr windows更新程序 wscrip
  • 再看知名应用背后的第三方开源项目 dcj3sjt126com ios
    知名应用程序的设计和技术一直都是开发者需要学习的，同样这些应用所使用的开源框架也是不可忽视的一部分。此前《 iOS第三方开源库的吐槽和备忘》中作者ibireme列举了国内多款知名应用所使用的开源框架，并对其中一些框架进行了分析，同样国外开发者 @iOSCowboy也在博客中给我们列出了国外多款知名应用使用的开源框架。另外txx's blog中详细介绍了 Facebook Paper使用的第三
  • Objective-c单例模式的正确写法 jsntghf 单例iosiPhone
    一般情况下，可能我们写的单例模式是这样的： #import <Foundation/Foundation.h> @interface Downloader : NSObject + (instancetype)sharedDownloader; @end #import "Downloader.h" @implementation
  • jquery easyui datagrid 加载成功，选中某一行 hae jqueryeasyuidatagrid数据加载
    1.首先你需要设置datagrid的onLoadSuccess $( '#dg' ).datagrid({onLoadSuccess :  function (data){      $( '#dg' ).datagrid( 'selectRow' ,3); }});   2.onL
  • jQuery用户数字打分评价效果 ini JavaScripthtmljqueryWebcss
    效果体验：http://hovertree.com/texiao/jquery/5.htmHTML文件代码： <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>jQuery用户数字打分评分代码 - HoverTree</
  • mybatis的paramType kerryg DAOsql
    MyBatis传多个参数： 1、采用#{0},#{1}获得参数：    Dao层函数方法：     public User selectUser(String name,String area); 对应的Mapper.xml    <select id="selectUser" result
  • centos 7安装mysql5.5 MrLee23 centos
    首先centos7 已经不支持mysql，因为收费了你懂得，所以内部集成了mariadb，而安装mysql的话会和mariadb的文件冲突，所以需要先卸载掉mariadb，以下为卸载mariadb，安装mysql的步骤。   #列出所有被安装的rpm package rpm -qa | grep mariadb   #卸载 rpm -e mariadb-libs-5.
  • 利用thrift来实现消息群发 qifeifei thrift
               Thrift项目一般用来做内部项目接偶用的，还有能跨不同语言的功能，非常方便，一般前端系统和后台server线上都是3个节点，然后前端通过获取client来访问后台server，那么如果是多太server，就是有一个负载均衡的方法，然后最后访问其中一个节点。那么换个思路，能不能发送给所有节点的server呢，如果能就
  • 实现一个sizeof获取Java对象大小 teasp javaHotSpot内存对象大小sizeof
       由于Java的设计者不想让程序员管理和了解内存的使用，我们想要知道一个对象在内存中的大小变得比较困难了。本文提供了可以获取对象的大小的方法，但是由于各个虚拟机在内存使用上可能存在不同，因此该方法不能在各虚拟机上都适用，而是仅在hotspot 32位虚拟机上，或者其它内存管理方式与hotspot 32位虚拟机相同的虚拟机上 适用。     
  • SVN错误及处理 xiangqian0505 SVN提交文件时服务器强行关闭
    在SVN服务控制台打开资源库“SVN无法读取current” ---摘自网络 写道 SVN无法读取current修复方法 Can't read file : End of file found 文件：repository/db/txn_current、repository/db/current   其中current记录当前最新版本号，txn_current记录版本库中版本
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他