wangjian223344
wangjian223344

jquerymobile-6 inset list和list divider 添加数字气泡 缩略图和icon list提交搜索过滤

今天介绍一下inset list和list diveder。在上篇文章中介绍了list，但是那个list是最基本，并不是太美观。我们可以使用jquerymobile的data-inset属性让其变得美观一下。代码如下：

[html] view plain copy
  1. <!DOCTYPE html>  
  2. <html>  
  3. <head>  
  4. <title>Inset List Example</title>  
  5. <meta name="viewport" content="width=device-width, initial-scale=1">  
  6. <link rel="stylesheet" href="http://code.jquery.com/mobile/latest/jquery.mobile.min.css" />  
  7. <script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>  
  8. <script src="http://code.jquery.com/mobile/latest/jquery.mobile.min.js"></script>  
  9. </head>  
  10.   
  11. <body>  
  12.   
  13. <div data-role="page">  
  14.   
  15.     <div data-role="header">  
  16.         <h1>My Header</h1>  
  17.     </div>  
  18.       
  19.     <div data-role="content">  
  20.         <ul data-role="listview" data-inset="true"><!--这里使用的data-inset属性-->  
  21.         <li>1</li>  
  22.         <li>2</li>  
  23.         <li>3</li>  
  24.         <li>4</li>  
  25.         </ul>  
  26.     </div>  
  27.   
  28.     <div data-role="footer">  
  29.         <h4>My Footer</h4>  
  30.     </div>  
  31.           
  32. </div>  
  33.   
  34. </body>  
  35. </html>  

jquerymobile-6 inset list和list divider 添加数字气泡 缩略图和icon list提交搜索过滤_第1张图片

这样就看起来好看一点了。有时候我们需要在一个很长的列表中添加一行用于区分的数据，这时候我们就可以使用data-role="list-divider"，添加到其中的某一个li上，这样就能实现区分的效果。一个例子代码如下：

[html] view plain copy
  1. <!DOCTYPE html>  
  2. <html>  
  3. <head>  
  4. <title>List Divider Example</title>  
  5. <meta name="viewport" content="width=device-width, initial-scale=1">  
  6. <link rel="stylesheet" href="http://code.jquery.com/mobile/latest/jquery.mobile.min.css" />  
  7. <script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>  
  8. <script src="http://code.jquery.com/mobile/latest/jquery.mobile.min.js"></script>  
  9. </head>  
  10.   
  11. <body>  
  12.   
  13. <div data-role="page">  
  14.   
  15.     <div data-role="header">  
  16.         <h1>My Header</h1>  
  17.     </div>  
  18.       
  19.     <div data-role="content">  
  20.         <ul data-role="listview" data-inset="true">  
  21.         <li data-role="list-divider">A</li>  
  22.         <li>A-1</li>  
  23.         <li>A-2</li>  
  24.         <li>A-3</li>  
  25.         <li data-role="list-divider">B</li>  
  26.         <li>b-1</li>  
  27.         </ul>  
  28.     </div>  
  29.   
  30.     <div data-role="footer">  
  31.         <h4>My Footer</h4>  
  32.     </div>  
  33.           
  34. </div>  
  35.   
  36. </body>  
  37. </html>  

效果图如下：jquerymobile-6 inset list和list divider 添加数字气泡 缩略图和icon list提交搜索过滤_第2张图片


在项目中，我们一般使用list显示一个列表，如果这个列表还有子项的时候，有时候我们需要在上面加上子项的数目，这时候我们就可以使用jquerymobile提供的CSS类中的ui-li-count类实现这样的效果。一段例子代码如下：

[html] view plain copy
  1. <!DOCTYPE html>  
  2. <html>  
  3. <head>  
  4. <title>Count Bubble Example</title>  
  5. <meta name="viewport" content="width=device-width, initial-scale=1">  
  6. <link rel="stylesheet" href="http://code.jquery.com/mobile/latest/jquery.mobile.min.css" />  
  7. <script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>  
  8. <script src="http://code.jquery.com/mobile/latest/jquery.mobile.min.js"></script>  
  9. </head>  
  10.   
  11. <body>  
  12.   
  13. <div data-role="page">  
  14.   
  15.     <div data-role="header">  
  16.         <h1>My Header</h1>  
  17.     </div>  
  18.       
  19.     <div data-role="content">  
  20.         <ul data-role="listview" data-inset="true">  
  21.         <li data-role="list-divider">Cookies Eaten</li>  
  22.         <li>A <span class="ui-li-count">9</span></li>  
  23.         <li>B <span class="ui-li-count">4</span></li>  
  24.         <li>C <span class="ui-li-count">13</span></li>  
  25.         <li>D <span class="ui-li-count">8</span></li>  
  26.         </ul>  
  27.     </div>  
  28.   
  29.     <div data-role="footer">  
  30.         <h4>My Footer</h4>  
  31.     </div>  
  32.           
  33. </div>  
  34.   
  35. </body>  
  36. </html>  

我们只要添加一个span并且给起添加ui-li-count类就可以实现了。效果如下：

jquerymobile-6 inset list和list divider 添加数字气泡 缩略图和icon list提交搜索过滤_第3张图片


有时候我们需要在list中的每一项上添加上缩略图，这时候我们就可以直接插入一个img标签，jquerymobile会为我们自动渲染成带缩略图的。下面看一个例子代码：

[html] view plain copy
  1. <!DOCTYPE html>  
  2. <html>  
  3. <head>  
  4. <title>Thumbnail Example</title>  
  5. <meta name="viewport" content="width=device-width, initial-scale=1">  
  6. <link rel="stylesheet" href="http://code.jquery.com/mobile/latest/jquery.mobile.min.css" />  
  7. <script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>  
  8. <script src="http://code.jquery.com/mobile/latest/jquery.mobile.min.js"></script>  
  9. </head>  
  10.   
  11. <body>  
  12.   
  13. <div data-role="page">  
  14.   
  15.     <div data-role="header">  
  16.         <h1>My Header</h1>  
  17.     </div>  
  18.       
  19.     <div data-role="content">  
  20.         <ul data-role="listview" data-inset="true">  
  21.         <li><img src="ray.png"> Raymond Camden</li><!--这行没有使用A标签所以后面不会有一个小箭头，其他的都有-->  
  22.         <li><a href="scott.html"><img src="scott.png"> Scott Stroz</a></li>  
  23.         <li><a href="todd.html"><img src="todd.png"> Todd Sharp</a></li>  
  24.         <li><a href="dave.html"><img src="dave.png"> Dave Ferguson</a></li>  
  25.         </ul>  
  26.     </div>  
  27.   
  28.     <div data-role="footer">  
  29.         <h4>My Footer</h4>  
  30.     </div>  
  31.           
  32. </div>  
  33.   
  34. </body>  
  35. </html>  

效果如下：

jquerymobile-6 inset list和list divider 添加数字气泡 缩略图和icon list提交搜索过滤_第4张图片

第一项没有小箭头在代码中注释中有解释。

看到这个总是感觉这几个人的头像有点大了，我们只需要比较小的就可以了。这时候可以使用jquerymobile提供的一个CSS类ui-li-icon，在每个img标签中添加上这个类就可以了。修改后代码如下：

[html] view plain copy
  1. <!DOCTYPE html>  
  2. <html>  
  3. <head>  
  4. <title>Thumbnail Example</title>  
  5. <meta name="viewport" content="width=device-width, initial-scale=1">  
  6. <link rel="stylesheet" href="http://code.jquery.com/mobile/latest/jquery.mobile.min.css" />  
  7. <script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>  
  8. <script src="http://code.jquery.com/mobile/latest/jquery.mobile.min.js"></script>  
  9. </head>  
  10.   
  11. <body>  
  12.   
  13. <div data-role="page">  
  14.   
  15.     <div data-role="header">  
  16.         <h1>My Header</h1>  
  17.     </div>  
  18.       
  19.     <div data-role="content">  
  20.         <ul data-role="listview" data-inset="true">  
  21.         <li><img src="ray_small.png" class="ui-li-icon"> Raymond Camden</li>  
  22.         <li><a href="scott.html"><img src="scott_small.png" class="ui-li-icon"> Scott Stroz</a></li>  
  23.         <li><a href="todd.html"><img src="todd_small.png" class="ui-li-icon"> Todd Sharp</a></li>  
  24.         <li><a href="dave.html"><img src="dave_small.png" class="ui-li-icon"> Dave Ferguson</a></li>  
  25.         </ul>  
  26.     </div>  
  27.   
  28.     <div data-role="footer">  
  29.         <h4>My Footer</h4>  
  30.     </div>  
  31.           
  32. </div>  
  33.   
  34. </body>  
  35. </html>  

效果如下：jquerymobile-6 inset list和list divider 添加数字气泡 缩略图和icon list提交搜索过滤_第5张图片


在开发的时候如果list过长的话，在其中查找特定的一项是比较麻烦的，jquerymobile为我们直接提供了搜索的功能。我们就可以直接使用其功能查找我们想要的结果。为了实现这个功能我们只需要在ul中添加data-filter="true"，这样jquerymobile就会自动添加一个过滤的搜索框，并且实现搜索功能了。下面给出一个例子代码：

[html] view plain copy
  1. <!DOCTYPE html>  
  2. <html>  
  3. <head>  
  4. <title>List Divider Example</title>  
  5. <meta name="viewport" content="width=device-width, initial-scale=1">  
  6. <link rel="stylesheet" href="http://code.jquery.com/mobile/latest/jquery.mobile.min.css" />  
  7. <script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>  
  8. <script src="http://code.jquery.com/mobile/latest/jquery.mobile.min.js"></script>  
  9. </head>  
  10.   
  11. <body>  
  12.   
  13. <div data-role="page">  
  14.   
  15.     <div data-role="header">  
  16.         <h1>My Header</h1>  
  17.     </div>  
  18.       
  19.     <div data-role="content">  
  20.         <ul data-role="listview" data-inset="true" data-filter="true" data-filter-placeholder="Something">  
  21.         <li><a href="ray.html">Raymond Camden</a></li>  
  22.         <li><a href="scott.html">Scott Stroz</a></li>  
  23.         <li><a href="todd.html">Todd Sharp</a></li>  
  24.         <li><a href="dave.html">Dave Ferguson</a></li>  
  25.         <!-- following links all share the same url to keep things simple -->  
  26.         <li><a href="dave.html">Jeanne Camden</a></li>  
  27.         <li><a href="dave.html">Alexson Boudreaux</a></li>  
  28.         <li><a href="dave.html">Ben Forta</a></li>  
  29.         <li><a href="dave.html">Rachel Luxemburg</a></li>  
  30.         <li><a href="dave.html">Lynn Camden</a></li>  
  31.         <li><a href="dave.html">Noah Camden</a></li>  
  32.         <li><a href="dave.html">Jacob Camden</a></li>  
  33.         <li><a href="dave.html">Luke Skywalker</a></li>  
  34.         <li><a href="dave.html">Anakin Skywalker</a></li>  
  35.         <li><a href="dave.html">Moonpie Rockhead</a></li>  
  36.         <li><a href="dave.html">Lisa Spacestation</a></li>  
  37.         <li><a href="dave.html">Terrible Ricky</a></li>  
  38.         <li><a href="dave.html">Han Solo</a></li>  
  39.         </ul>  
  40.     </div>  
  41.   
  42.     <div data-role="footer">  
  43.         <h4>My Footer</h4>  
  44.     </div>  
  45.           
  46. </div>  
  47.   
  48. </body>  
  49. </html>  

显示效果如下(由于比较多没有完全显示，导致footer没有显示出来)：

jquerymobile-6 inset list和list divider 添加数字气泡 缩略图和icon list提交搜索过滤_第6张图片

当我们输入了“r”后，footer显示出来了，显示效果如下：

jquerymobile-6 inset list和list divider 添加数字气泡 缩略图和icon list提交搜索过滤_第7张图片

你可能感兴趣的:(jquery,android,html5,mobile,HTML5技术,移动浏览器)

  • android系统selinux中添加新属性property 辉色投像
    1.定位/android/system/sepolicy/private/property_contexts声明属性开头：persist.charge声明属性类型：u:object_r:system_prop:s0图12.定位到android/system/sepolicy/public/domain.te删除neverallow{domain-init}default_prop:property
  • UI学习——cell的复用和自定义cell Magnetic_h ui学习
    目录cell的复用手动（非注册）自动（注册）自定义cellcell的复用在iOS开发中，单元格复用是一种提高表格（UITableView）和集合视图（UICollectionView）滚动性能的技术。当一个UITableViewCell或UICollectionViewCell首次需要显示时，如果没有可复用的单元格，则视图会创建一个新的单元格。一旦这个单元格滚动出屏幕，它就不会被销毁。相反，它被添
  • 学点心理知识，呵护孩子健康 静候花开_7090
    昨天听了华中师范大学教育管理学系副教授张玲老师的《哪里才是学生心理健康的最后庇护所，超越教育与技术的思考》的讲座。今天又重新学习了一遍，收获匪浅。张玲博士也注意到了当今社会上的孩子由于心理问题导致的自残、自杀及伤害他人等恶性事件。她向我们普及了一个重要的命题，她说心理健康的一些基本命题，我们与我们通常的一些教育命题是不同的，她还举了几个例子，让我们明白我们原来以为的健康并非心理学上的健康。比如如果
  • Cell Insight | 单细胞测序技术又一新发现，可用于HIV-1和Mtb共感染个体诊断 尐尐呅
    结核病是艾滋病合并其他疾病中导致患者死亡的主要原因。其中结核病由结核分枝杆菌（Mycobacteriumtuberculosis,Mtb）感染引起，获得性免疫缺陷综合症（艾滋病）由人免疫缺陷病毒（Humanimmunodeficiencyvirustype1,HIV-1）感染引起。国家感染性疾病临床医学研究中心/深圳市第三人民医院张国良团队携手深圳华大生命科学研究院吴靓团队，共同研究得出单细胞测序
  • 店群合一模式下的社区团购新发展——结合链动 2+1 模式、AI 智能名片与 S2B2C 商城小程序源码 说私域 人工智能小程序
    摘要：本文探讨了店群合一的社区团购平台在当今商业环境中的重要性和优势。通过分析店群合一模式如何将互联网社群与线下终端紧密结合，阐述了链动2+1模式、AI智能名片和S2B2C商城小程序源码在这一模式中的应用价值。这些创新元素的结合为社区团购带来了新的机遇，提升了用户信任感、拓展了营销渠道，并实现了线上线下的完美融合。一、引言随着互联网技术的不断发展，社区团购作为一种新兴的商业模式，在满足消费者日常需
  • 腾讯云技术深度探索：构建高效云原生微服务架构 我的运维人生 云原生架构腾讯云运维开发技术共享
    腾讯云技术深度探索：构建高效云原生微服务架构在当今快速发展的技术环境中，云原生技术已成为企业数字化转型的关键驱动力。腾讯云作为行业领先的云服务提供商，不断推出创新的产品和技术，助力企业构建高效、可扩展的云原生微服务架构。本文将深入探讨腾讯云在微服务领域的最新进展，并通过一个实际案例展示如何在腾讯云平台上构建云原生应用。腾讯云微服务架构概览腾讯云微服务架构基于云原生理念，旨在帮助企业快速实现应用的容
  • DIV+CSS+JavaScript技术制作网页（旅游主题网页设计与制作）云南大理 STU学生网页设计 网页设计期末网页作业html静态网页html5期末大作业网页设计web大作业
    ️精彩专栏推荐作者主页:【进入主页—获取更多源码】web前端期末大作业：【HTML5网页期末作业(1000套)】程序员有趣的告白方式：【HTML七夕情人节表白网页制作(110套)】文章目录二、网站介绍三、网站效果▶️1.视频演示2.图片演示四、网站代码HTML结构代码CSS样式代码五、更多源码二、网站介绍网站布局方面：计划采用目前主流的、能兼容各大主流浏览器、显示效果稳定的浮动网页布局结构。网站程
  • 2020-04-12每天三百字之连接与替代 冷眼看潮
    不知道是不是好为人师，有时候还真想和别人分享一下我对某些现象的看法或者解释。人类社会不断发展进步的过程，就是不断连接与替代的过程。人类发现了火并应用火以后，告别了茹毛饮血的野兽般的原始生活（火烧、烹饪替代了生食）人类用石器代替了完全手工，工具的使用使人类进步一大步。类似这样的替代还有很多，随着科技的发展，有更多的原始的事物被替代，代之以更高效、更先进的技术。在近现代，汽车替代了马车，高速公路和铁路
  • 探索OpenAI和LangChain的适配器集成：轻松切换模型提供商 nseejrukjhad langchaineasyui前端python
    #探索OpenAI和LangChain的适配器集成：轻松切换模型提供商##引言在人工智能和自然语言处理的世界中，OpenAI的模型提供了强大的能力。然而，随着技术的发展，许多人开始探索其他模型以满足特定需求。LangChain作为一个强大的工具，集成了多种模型提供商，通过提供适配器，简化了不同模型之间的转换。本篇文章将介绍如何使用LangChain的适配器与OpenAI集成，以便轻松切换模型提供商
  • 使用LLaVa和Ollama实现多模态RAG示例 llzwxh888 python人工智能开发语言
    本文将详细介绍如何使用LLaVa和Ollama实现多模态RAG（检索增强生成），通过提取图像中的结构化数据、生成图像字幕等功能来展示这一技术的强大之处。安装环境首先，您需要安装以下依赖包：!pipinstallllama-index-multi-modal-llms-ollama!pipinstallllama-index-readers-file!pipinstallunstructured!p
  • 关于城市旅游的HTML网页设计——(旅游风景云南 5页)HTML+CSS+JavaScript 二挡起步 web前端期末大作业javascripthtmlcss旅游风景
    ⛵源码获取文末联系✈Web前端开发技术描述网页设计题材，DIV+CSS布局制作,HTML+CSS网页设计期末课程大作业|游景点介绍|旅游风景区|家乡介绍|等网站的设计与制作|HTML期末大学生网页设计作业，Web大学生网页HTML：结构CSS：样式在操作方面上运用了html5和css3，采用了div+css结构、表单、超链接、浮动、绝对定位、相对定位、字体样式、引用视频等基础知识JavaScrip
  • HTML网页设计制作大作业（div+css） 云南我的家乡旅游景点 带文字滚动 二挡起步 web前端期末大作业web设计网页规划与设计htmlcssjavascriptdreamweaver前端
    Web前端开发技术描述网页设计题材，DIV+CSS布局制作,HTML+CSS网页设计期末课程大作业游景点介绍|旅游风景区|家乡介绍|等网站的设计与制作HTML期末大学生网页设计作业HTML：结构CSS：样式在操作方面上运用了html5和css3，采用了div+css结构、表单、超链接、浮动、绝对定位、相对定位、字体样式、引用视频等基础知识JavaScript：做与用户的交互行为文章目录前端学习路线
  • 人工智能时代，程序员如何保持核心竞争力？ jmoych 人工智能
    随着AIGC（如chatgpt、midjourney、claude等）大语言模型接二连三的涌现，AI辅助编程工具日益普及，程序员的工作方式正在发生深刻变革。有人担心AI可能取代部分编程工作，也有人认为AI是提高效率的得力助手。面对这一趋势,程序员应该如何应对?是专注于某个领域深耕细作，还是广泛学习以适应快速变化的技术环境?又或者，我们是否应该将重点转向AI无法轻易替代的软技能？让我们一起探讨程序员
  • CX8836：小体积大功率升降压方案推荐（附Demo设计指南） 诚芯微科技 社交电子
    CX8836是一颗同步四开关单向升降压控制器，在4.5V-40V宽输入电压范围内稳定工作，持续负载电流10A，能够在输入高于或低于输出电压时稳定调节输出电压，可适用于USBPD快充、车载充电器、HUB、汽车启停系统、工业PC电源等多种升降压应用场合，为大功率TYPE-CPD车载充电器提供最优解决方案。提供CX8836Demo测试、CX8836样品申请及CX8836方案开发技术支持。CX8836同升
  • 【华为OD技术面试真题 - 技术面】- python八股文真题题库（4) 算法大师 华为od面试python
    华为OD面试真题精选专栏：华为OD面试真题精选目录:2024华为OD面试手撕代码真题目录以及八股文真题目录文章目录华为OD面试真题精选**1.Python中的`with`**用途和功能自动资源管理示例：文件操作上下文管理协议示例代码工作流程解析优点2.\_\_new\_\_和**\_\_init\_\_**区别__new____init__区别总结3.**切片（Slicing）操作**基本切片语法
  • 【华为OD技术面试真题 - 技术面】-测试八股文真题题库（1） 算法大师 华为od面试python算法前端
    华为OD面试真题精选专栏：华为OD面试真题精选目录:2024华为OD面试手撕代码真题目录以及八股文真题目录文章目录华为OD面试真题精选1.黑盒测试和白盒测试的区别2.假设我们公司现在开发一个类似于微信的软件1.0版本，现在要你测试这个功能：打开聊天窗口，输入文本，限制字数在200字以内。问你怎么提取测试点。功能测试性能测试安全性测试可用性测试跨平台兼容性测试网络环境测试3.接口测试的工具你了解哪些
  • 2019-11-04复盘——飞来山上千寻塔，闻说鸡鸣见日升。 那一叶秋
    1、大盘篇先上老图，看习惯了，也就知道走势了图1上证指数日线图还是那张老图，自己可以在自己的相关软件上画出来，快变盘了。2、个股篇未加仓、未减仓。分析量能的时候，突然发现这么一个东西：“放量突破年线，缩量回调。”合众科技日线图其实，最近的N只个股，在技术分析上，都到了变盘的临界时候。结合这么久的走势，特别是ZJH不断放开IPO的申请，本质上说是融资难度变大，或者说是为企业的融资开创便利。但现在市场
  • 【华为OD技术面试真题精选 - 非技术题】 -HR面，综合面_华为od hr面 一个射手座的程序媛 程序员华为od面试职场和发展
    最后的话最近很多小伙伴找我要Linux学习资料，于是我翻箱倒柜，整理了一些优质资源，涵盖视频、电子书、PPT等共享给大家！资料预览给大家整理的视频资料：给大家整理的电子书资料：如果本文对你有帮助，欢迎点赞、收藏、转发给朋友，让我有持续创作的动力！网上学习资料一大堆，但如果学到的知识不成体系，遇到问题时只是浅尝辄止，不再深入研究，那么很难做到真正的技术提升。需要这份系统化的资料的朋友，可以点击这里获
  • 18、架构-可观测性之聚合度量 大树~~ 架构javapython后端架构
    聚合度量聚合度量是指对系统运行时产生的各种指标数据进行收集、聚合和分析，以了解系统的健康状况和性能表现。聚合度量是可观测性的关键组成部分，通过对度量数据的分析，可以及时发现系统中的异常和瓶颈。以下是对聚合度量各个方面的详细解析，并结合具体的数据案例和技术支撑。指标收集收集系统运行时产生的各种指标数据是聚合度量的基础。常见的指标包括CPU使用率、内存使用率、请求处理时间、请求数、错误率等。以下是指标
  • 教育 用心灵温暖心灵
    @陈春丽长期学习班冯倩。今天一早就听到说高职合并，取消中专教育的教育信息。感觉是虽然知道，再听还是吓一跳。国家重视职业教育为何还要取消中专技术学校的教育？再听高中就要进行技术教育了，一部分人学习好继续努力学习考大学，一部分人在高中就可以进行职业教育接受职业教育了还要中专技术教育学校干什么呢！a有些职业教育学校转型升级快，不是孩子上完给找工作，而是学校帮孩子创业，我觉得是不错的方向！新闻新你得实时更
  • 【华为OD技术面试真题 - 技术面】- python八股文真题题库（1） 算法大师 华为od面试python
    华为OD面试真题精选专栏：华为OD面试真题精选目录:2024华为OD面试手撕代码真题目录以及八股文真题目录文章目录华为OD面试真题精选1.数据预处理流程数据预处理的主要步骤工具和库2.介绍线性回归、逻辑回归模型线性回归（LinearRegression）模型形式：关键点：逻辑回归（LogisticRegression）模型形式：关键点：参数估计与评估：3.python浅拷贝及深拷贝浅拷贝（Shal
  • 数字里的世界17期：2021年全球10大顶级数据中心，中国移动榜首 张三叨
    你知道吗？2016年，全球的数据中心共计用电4160亿千瓦时，比整个英国的发电量还多40％！前言每天，我们都会创造超过250万TB的数据。并且随着物联网（IOT）的不断普及，这一数据将持续增长。如此庞大的数据被存储在被称为“数据中心”的专用设施中。虽然最早的数据中心建于20世纪40年代，但直到1997-2000年的互联网泡沫期间才逐渐成为主流。当前人类的技术，比如人工智能和机器学习，已经将我们推向
  • nosql数据库技术与应用知识点 皆过客，揽星河 NoSQLnosql数据库大数据数据分析数据结构非关系型数据库
    Nosql知识回顾大数据处理流程数据采集(flume、爬虫、传感器)数据存储(本门课程NoSQL所处的阶段)Hdfs、MongoDB、HBase等数据清洗(入仓)Hive等数据处理、分析(Spark、Flink等)数据可视化数据挖掘、机器学习应用(Python、SparkMLlib等)大数据时代存储的挑战(三高)高并发(同一时间很多人访问)高扩展(要求随时根据需求扩展存储)高效率(要求读写速度快)
  • EIO国际确定性的交易（3/10）资管 ， 资金委托安全吗？ 古城鹏哥
    大家可能都知道资金托管，账户是自己开，钱在自己的账户上，密码是由自己掌控，别人提不走你账户的资金，每天可以看下到自己的账户，也可以看到交易流水。现金只能提到自己的银行卡中。账户由技术人员或操作人员，或者是机构团队帮你操作账户，产生盈利和收入，以获得的利润来分配盈利，技术强硬和做的时间久了过硬技术团队，会保证你的资金本金，不会让你的本金亏损的按照一定比例分配收入。所以在这个过程当中一定要看清楚技术的
  • OPENAIGC开发者大赛企业组AI黑马奖 | AIGC数智传媒解决方案 RPA中国 人工智能AIGC传媒
    在第二届拯救者杯OPENAIGC开发者大赛中，涌现出一批技术突出、创意卓越的作品。为了让这些优秀项目被更多人看到，我们特意开设了优秀作品报道专栏，旨在展示其独特之处和开发者的精彩故事。无论您是技术专家还是爱好者，希望能带给您不一样的知识和启发。让我们一起探索AIGC的无限可能，见证科技与创意的完美融合！创未来AI应用赛-企业组AI黑马奖作品名称：AIGC数智传媒解决方案参赛团队：深圳市三象智能技术
  • 【六】阿伟开始搭建Kafka学习环境 能源恒观 中间件学习kafkaspring
    阿伟开始搭建Kafka学习环境概述上一篇文章阿伟学习了Kafka的核心概念，并且把市面上流行的消息中间件特性进行了梳理和对比，方便大家在学习过程中进行对比学习，最后梳理了一些Kafka使用中经常遇到的Kafka难题以及解决思路，经过上一篇的学习我相信大家对Kafka有了初步的认识，本篇将继续学习Kafka。一、安装和配置学习一项技术首先要搭建一套服务，而Kafka的运行主要需要部署jdk、zook
  • 提高教师信息素养，提高道德与法治课教学效益 长白159宋彦红
    提高教师信息素养，提高道德与法治课教学效益随着经济和社会的发展，信息技术已经运用到课堂教学中，为课堂教学展示了一个崭新的天地。的确，信息技术形象、生动、直观性强，能够将课本中的一些抽想的概念直接展示在学生面前，从而调动学生的眼、耳、脑，让他们兴奋起来，变被动学习为主动学习，充分发挥教师的教育引导作用，创造一个可以使学生积极参与的场景。在制作、使用信息技术的实践过程中，本文拟就教师提升信息素养的必要
  • ExpRe[25] bash外的其它shell：zsh和fish tritone ExpRebashlinuxubuntushell
    文章目录zsh基础配置实用特性插件`autojump`语法高亮自动补全fish优点缺点时效性本篇撰写时间为2021.12.15，由于计算机技术日新月异，博客中所有内容都有时效和版本限制，具体做法不一定总行得通，链接可能改动失效，各种软件的用法可能有修改。但是其中透露的思想往往是值得学习的。本篇前置：ExpRe[10]Ubuntu[2]准备神秘软件、备份恢复软件https://www.cnblogs
  • TDengine 签约前晨汽车，解锁智能出行的无限潜力 涛思数据（TDengine） tdengine汽车大数据
    在全球汽车产业转型升级的背景下，智能网联和新能源技术正迅速成为商用车行业的重要发展方向。随着市场对环保和智能化需求的日益增强，企业必须在技术创新和数据管理上不断突破，以满足客户对高效、安全和智能出行的期待。在这一背景下，前晨汽车凭借其在新能源智能商用车领域的前瞻性布局和技术实力，成为行业中的佼佼者。前晨汽车采用整车数据采集和全车数据打通策略，能够实时将数据推送至APP端客户。然而，这导致整体写入和
  • 你可能遗漏的一些C#/.NET/.NET Core知识点 追逐时光者 C#.NETDotNetGuide编程指南c#.net.netcoremicrosoft
    前言在这个快速发展的技术世界中，时常会有一些重要的知识点、信息或细节被忽略或遗漏。《C#/.NET/.NETCore拾遗补漏》专栏我们将探讨一些可能被忽略或遗漏的重要知识点、信息或细节，以帮助大家更全面地了解这些技术栈的特性和发展方向。拾遗补漏GitHub开源地址https://github.com/YSGStudyHards/DotNetGuide/blob/main/docs/DotNet/D
  • sql统计相同项个数并按名次显示 朱辉辉33 javaoracle
    现在有如下这样一个表： A表 ID Name time ------------------------------ 0001 aaa 2006-11-18 0002 ccc 2006-11-18 0003 eee 2006-11-18 0004 aaa 2006-11-18 0005 eee 2006-11-18 0004 aaa 2006-11-18 0002 ccc 20
  • Android+Jquery Mobile学习系列-目录 白糖_ JQuery Mobile
    最近在研究学习基于Android的移动应用开发，准备给家里人做一个应用程序用用。向公司手机移动团队咨询了下，觉得使用Android的WebView上手最快，因为WebView等于是一个内置浏览器，可以基于html页面开发，不用去学习Android自带的七七八八的控件。然后加上Jquery mobile的样式渲染和事件等，就能非常方便的做动态应用了。   从现在起，往后一段时间，我打算
  • 如何给线程池命名 daysinsun 线程池
            在系统运行后，在线程快照里总是看到线程池的名字为pool-xx，这样导致很不好定位，怎么给线程池一个有意义的名字呢。参照ThreadPoolExecutor类的ThreadFactory，自己实现ThreadFactory接口，重写newThread方法即可。参考代码如下：     public class Named
  • IE 中"HTML Parsing Error:Unable to modify the parent container element before the 周凡杨 html解析errorreadyState
      错误： IE 中"HTML Parsing Error:Unable to modify the parent container element before the child element is closed"     现象： 同事之间几个IE 测试情况下，有的报这个错，有的不报。经查询资料后，可归纳以下原因。
  • java上传 g21121 java
    我们在做web项目中通常会遇到上传文件的情况，用struts等框架的会直接用的自带的标签和组件，今天说的是利用servlet来完成上传。 我们这里利用到commons-fileupload组件，相关jar包可以取apache官网下载：http://commons.apache.org/ 下面是servlet的代码： //定义一个磁盘文件工厂 DiskFileItemFactory fact
  • SpringMVC配置学习 510888780 springmvc
    spring MVC配置详解 现在主流的Web MVC框架除了Struts这个主力 外，其次就是Spring MVC了，因此这也是作为一名程序员需要掌握的主流框架，框架选择多了，应对多变的需求和业务时，可实行的方案自然就多了。不过要想灵活运用Spring MVC来应对大多数的Web开发，就必须要掌握它的配置及原理。 　　一、Spring MVC环境搭建：（Spring 2.5.6 + Hi
  • spring mvc-jfreeChart 柱图(1) 布衣凌宇 jfreechart
    第一步：下载jfreeChart包，注意是jfreeChart文件lib目录下的，jcommon-1.0.23.jar和jfreechart-1.0.19.jar两个包即可； 第二步：配置web.xml; web.xml代码如下 <servlet>     <servlet-name>jfreechart</servlet-nam
  • 我的spring学习笔记13-容器扩展点之PropertyPlaceholderConfigurer aijuans Spring3
    PropertyPlaceholderConfigurer是个bean工厂后置处理器的实现，也就是BeanFactoryPostProcessor接口的一个实现。关于BeanFactoryPostProcessor和BeanPostProcessor类似。我会在其他地方介绍。PropertyPlaceholderConfigurer可以将上下文（配置文件）中的属性值放在另一个单独的标准java P
  • java 线程池使用 Runnable&Callable&Future antlove javathreadRunnablecallablefuture
    1. 创建线程池 ExecutorService executorService = Executors.newCachedThreadPool();   2. 执行一次线程，调用Runnable接口实现 Future<?> future = executorService.submit(new DefaultRunnable()); System.out.prin
  • XML语法元素结构的总结 百合不是茶 xml树结构
    1.XML介绍1969年   gml (主要目的是要在不同的机器进行通信的数据规范)1985年   sgml  standard generralized markup language1993年   html(www网)1998年  xml   extensible markup language
  • 改变eclipse编码格式 bijian1013 eclipse编码格式
    1.改变整个工作空间的编码格式         改变整个工作空间的编码格式，这样以后新建的文件也是新设置的编码格式。         Eclipse->window->preferences->General->workspace-
  • javascript中return的设计缺陷 bijian1013 JavaScriptAngularJS
    代码1： <script> var gisService = (function(window) { return { name:function () { alert(1); } }; })(this); gisService.name(); &l
  • 【持久化框架MyBatis3八】Spring集成MyBatis3 bit1129 Mybatis3
    pom.xml配置 Maven的pom中主要包括： MyBatis MyBatis-Spring Spring MySQL-Connector-Java Druid applicationContext.xml配置   <?xml version="1.0" encoding="UTF-8"?> &
  • java web项目启动时自动加载自定义properties文件 bitray javaWeb监听器相对路径
    创建一个类 public class ContextInitListener implements ServletContextListener 使得该类成为一个监听器。用于监听整个容器生命周期的，主要是初始化和销毁的。 类创建后要在web.xml配置文件中增加一个简单的监听器配置，即刚才我们定义的类。 <listener> <des
  • 用nginx区分文件大小做出不同响应 ronin47
    昨晚和前21v的同事聊天，说到我离职后一些技术上的更新。其中有个给某大客户(游戏下载类)的特殊需求设计，因为文件大小差距很大——估计是大版本和补丁的区别——又走的是同一个域名，而squid在响应比较大的文件时，尤其是初次下载的时候，性能比较差，所以拆成两组服务器，squid服务于较小的文件，通过pull方式从peer层获取，nginx服务于较大的文件，通过push方式由peer层分发同步。外部发布
  • java-67-扑克牌的顺子.从扑克牌中随机抽5张牌，判断是不是一个顺子，即这5张牌是不是连续的.2-10为数字本身，A为1，J为11，Q为12，K为13，而大 bylijinnan java
    package com.ljn.base; import java.util.Arrays; import java.util.Random; public class ContinuousPoker { /** * Q67 扑克牌的顺子 从扑克牌中随机抽5张牌，判断是不是一个顺子，即这5张牌是不是连续的。 * 2-10为数字本身，A为1，J为1
  • 翟鸿燊老师语录 ccii 翟鸿燊
    一、国学应用智慧TAT之亮剑精神A 1. 角色就是人格     就像你一回家的时候，你一进屋里面，你已经是儿子，是姑娘啦，给老爸老妈倒怀水吧，你还觉得你是老总呢？还拿派呢？就像今天一样，你们往这儿一坐，你们之间是什么，同学，是朋友。     还有下属最忌讳的就是领导向他询问情况的时候，什么我不知道，我不清楚，该你知道的你凭什么不知道
  • [光速与宇宙]进行光速飞行的一些问题 comsci 问题
         在人类整体进入宇宙时代，即将开展深空宇宙探索之前，我有几个猜想想告诉大家     仅仅是猜想。。。未经官方证实      1：要在宇宙中进行光速飞行，必须首先获得宇宙中的航行通行证，而这个航行通行证并不是我们平常认为的那种带钢印的证书，是什么呢？ 下面我来告诉
  • oracle undo解析 cwqcwqmax9 oracle
    oracle undo解析2012-09-24 09:02:01     我来说两句       作者：虫师收藏    我要投稿 Undo是干嘛用的？         &nb
  • java中各种集合的详细介绍 dashuaifu java集合
    一，java中各种集合的关系图 Collection       接口的接口     对象的集合  ├ List           子接口   &n
  • 卸载windows服务的方法 dcj3sjt126com windowsservice
    卸载Windows服务的方法 在Windows中，有一类程序称为服务，在操作系统内核加载完成后就开始加载。这里程序往往运行在操作系统的底层，因此资源占用比较大、执行效率比较高，比较有代表性的就是杀毒软件。但是一旦因为特殊原因不能正确卸载这些程序了，其加载在Windows内的服务就不容易删除了。即便是删除注册表中的相 应项目，虽然不启动了，但是系统中仍然存在此项服务，只是没有加载而已。如果安装其他
  • Warning: The Copy Bundle Resources build phase contains this target's Info.plist dcj3sjt126com iosxcode
        http://developer.apple.com/iphone/library/qa/qa2009/qa1649.html Excerpt: You are getting this warning because you probably added your Info.plist file to your Copy Bundle
  • 2014之C++学习笔记（一） Etwo C++EtwoEtwoiterator迭代器
            已经有很长一段时间没有写博客了，可能大家已经淡忘了Etwo这个人的存在，这一年多以来，本人从事了AS的相关开发工作，但最近一段时间，AS在天朝的没落，相信有很多码农也都清楚，现在的页游基本上达到饱和，手机上的游戏基本被unity3D与cocos占据，AS基本没有容身之处。so。。。最近我并不打算直接转型
  • js跨越获取数据问题记录 haifengwuch jsonpjsonAjax
    js的跨越问题，普通的ajax无法获取服务器返回的值。   第一种解决方案，通过getson，后台配合方式，实现。 Java后台代码： protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { String ca
  • 蓝色jQuery导航条 ini JavaScripthtmljqueryWebhtml5
    效果体验：http://keleyi.com/keleyi/phtml/jqtexiao/39.htmHTML文件代码： <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>jQuery鼠标悬停上下滑动导航条 - 柯乐义<
  • linux部署jdk,tomcat,mysql kerryg jdktomcatlinuxmysql
    1、安装java环境jdk:     一般系统都会默认自带的JDK,但是不太好用，都会卸载了，然后重新安装。    1.1）、卸载：      （rpm -qa :查询已经安装哪些软件包；        rmp -q 软件包：查询指定包是否已
  • DOMContentLoaded VS onload VS onreadystatechange mutongwu jqueryjs
    1. DOMContentLoaded 在页面html、script、style加载完毕即可触发，无需等待所有资源（image/iframe）加载完毕。（IE9+） 2. onload是最早支持的事件，要求所有资源加载完毕触发。 3. onreadystatechange 开始在IE引入，后来其它浏览器也有一定的实现。涉及以下 document , applet, embed, fra
  • sql批量插入数据 qifeifei 批量插入
    hi，   自己在做工程的时候，遇到批量插入数据的数据修复场景。我的思路是在插入前准备一个临时表，临时表的整理就看当时的选择条件了，临时表就是要插入的数据集，最后再批量插入到数据库中。    WITH tempT AS ( SELECT item_id AS combo_id, item_id, now() AS create_date FROM a
  • log4j打印日志文件 如何实现相对路径到 项目工程下 thinkfreer Weblog4j应用服务器日志
    最近为了实现统计一个网站的访问量，记录用户的登录信息，以方便站长实时了解自己网站的访问情况，选择了Apache 的log4j,但是在选择相对路径那块 卡主了，X度了好多方法(其实大多都是一样的内用，还一个字都不差的)，都没有能解决问题，无奈搞了2天终于解决了，与大家分享一下 需求： 用户登录该网站时，把用户的登录名,ip,时间。统计到一个txt文档里，以方便其他系统调用此txt。项目名
  • linux下mysql-5.6.23.tar.gz安装与配置 笑我痴狂 mysqllinuxunix
    1.卸载系统默认的mysql [root@localhost ~]# rpm -qa | grep mysql mysql-libs-5.1.66-2.el6_3.x86_64 mysql-devel-5.1.66-2.el6_3.x86_64 mysql-5.1.66-2.el6_3.x86_64 [root@localhost ~]# rpm -e mysql-libs-5.1
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他