什么是rem 说到rem自然就会想到em,我们知道em是相对于父元素的字体大小的单位,那么rem则是相对于根元素也就是元素的字体大小的单位。 2.如何用rem解决移动端适配 ?...通过这张图我们就可以观察到,div的宽度和高度是根据根元素()来决定的,根元素的字体大小为100px,然后给div的宽度和高度设置为2rem、1rem,最后生成的div的宽度为200px、高度为100px...3.通过JavaScript动态设置rem 不同浏览器根标签的默认字体大小不一样,所以需要JavaScript动态设置rem。...方案一: javascript"> window.addEventListener(('orientationchange' in window ?... 方案二: javascript"> !
当div 中的class 有多个classname时,它会同时应用这几个class定义的CSS样式,那么应用时的优先级是怎么样的? 如果有多个样式的话,会采取覆盖的形式执行。...就是如果有定义同一个属性比如background,后面定义的background属性会覆盖前面的background属性,下面是用JavaScript给元素添加多个class的简单实现的一个例子。...} .div3{ font-size:20px; color:blue; } javascript... } [4]在[3]的基础上我们就可以进行判断性给元素添加样式了 var odiv=document.getElementById('div1'); ...给元素添加多个class的简单实现 https://www.jb51.net/article/88901.htm
seaborn提供了一个快速展示数据库中列元素分布和相互关系的函数,即pairplot函数,该函数会自动选取数据框中值为数字的列元素,通过方阵的形式展现其分布和关系,其中对角线用于展示各个列元素的分布情况...函数自动选了数据框中的3列元素进行可视化,对角线上,以直方图的形式展示每列元素的分布,而关于对角线堆成的上,下半角则用于可视化两列之间的关系,默认的可视化形式是散点图,该函数常用的参数有以下几个 ###...# 1. corner 上下三角矩阵区域的元素实际上是重复的,通过corner参数,可以控制只显示图形的一半,避免重复,用法如下 >>> sns.pairplot(df, corner=True) >>...#### 3、 x_vars和y_vars 默认情况下,程序会对数据框中所有的数值列进行可视化,通过x_vars和y_vars可以用列名称来指定我们需要可视化的列,用法如下 >>> sns.pairplot...通过pairpplot函数,可以同时展示数据框中的多个数值型列元素的关系,在快速探究一组数据的分布时,非常的好用。
separator 字符串 分隔符字符或字符串用来划定id allowClear 布尔 此选项只指定占位符 multiple 布尔 Select2是否允许选择多个值 openOnEnter 打开下拉如果设置为...允许创建通过查询选择不可用 功能。 有用的用户可以创建动态的选择时,如“标签”usecase。...createSearchChoicePosition 函数/字符串 定义的位置插入元素 initSelection 函数 调用Select2创建允许用户初始化选择的值 select2附加到元素 tokenizer...tags 数组/函数 将Select2放入“标签'mode,用户可以添加新的选择和预先存在的标签是通过提供 这个选项的属性是一个 数组 或者一个 函数 返回一个 数组的 对象 或 字符串 。...默认情况下这个功能转义的html实体,以防止javascript注入。 selectOnBlur 布尔 设置为 真正的 如果你想要Select2选择当前高亮选项时模糊。
/plugins/select2/css/select2.min.css"> 8 javascript" src="../...../plugins/select2/js/select2.js"> 2、先将弹出框做出来,你可以模拟数据或者从后台将数据查询出来,进行操作。 1 数据,我是从后台查询出来的,放到select选择框里面的,你可以根据自己的需求来做哦。 ? 3、初始化select2。...4、模拟的使用select2插件进行下拉框来进行自动补全。...="1"的元素 27 function findByName(){ 28 //初始化select2 29 var areaObj = $("#area").select2
jQuery由美国人John Resig创建,至今已吸引了来自世界各地的众多 javascript高手加入其team。...它是轻量级的js库(压缩后只有21k) ,这是其它的js库所不及的,它兼容CSS3,还兼容各种浏览器 jQuery是一个快速的,简洁的javaScript库,使用户能更方便地处理HTMLdocuments...jQuery 对象就是通过jQuery包装DOM对象后产生的对象,jQuery 对象是 jQuery 独有的....,但不包含xx prev() //上一个标签元素 prevAll() //上一个标签所有元素 preUntil('#xx') // 直到找着上一个元素id为xx的标签或者class,但不包含...xx parent() //父级标签元素 parents() //父级往上的所有标签元素 parentUntil() //// 直到找着父级id为xx的标签或者class,但不包含xx
Array(1)} mousedown: [{…}] mouseout: [{…}] __proto__: Object getEventListeners() 方法可以获取到 dom 元素的监听...可以看到当前 dom 节点的监听就是 mousedown 和 mouseout。 取消勾选 Ancestors All 可以排除当前元素所有祖先元素的监听。...反过来如果想通过代码获取某个元素所有祖先元素的监听可以遍历它的所有上级节点再依次获取所有 dom 节点的监听。
下拉框在前端设计中是一个很常用的列表控件。独立的下拉框要实现起来并不难。但是,有时候我们会遇到两个甚至多个下拉框需要联动的问题,这时候,页面的实现就不是一个简单的交互了。...因此,实现联动需要解决的问题关键在于,页面不刷新的情况下,能够根据上一个下拉框的值,获取下一个下拉框的列表数据,并更新到列表。...解决这个问题的关键方法分两步: 第一步:使用Ajax,页面不刷新,获取下一个下拉框的列表数据。 第二步:使用JQery,将Ajax获取的列表数据更新到指定的下拉框。...案例:页面上有Select1和Select2,需求是Select2的列表数据依赖于Select1选中的值。...#Select2”).empty(); //先定义默认选项 ("").val("0").text("请选择...").appendTo( //再将Ajax拿到的数据更新到
pycharm是一个很好的IDE,它还有一个功能直接通过这个IDE连接数据库,然后对数据库进行相关的操作,这样我们可以不用navicat for mysql这样的可视化工具了。...输入账号密码数据库名,如果Test Connection按钮不能用的话,应该是Driver没有下载,在页面下方会有Download按钮,单击后直接下载就行 单击ok即可。...这样我们就能在pycharm中看到我们数据库中的相关表和记录了 数据进行操作
在进行python研发的时候,pycharm是一个很好的IDE,今天又发现了一个比较好的功能,就是可以直接通过这个IDE连接数据库,然后对数据库进行相关的操作,这样我们可以不适用navicat for...下面来说一下怎么通过pycharm来设置吧。...,基本上我们使用的都能够支持) 选择好我们需要添加的数据库之后,就可以填写相关数据库的配置了。...当我们对表格的内容进行修改之后,需要提交之后才能提交到数据库(绿色的是提交修改到数据库按钮,右侧的是Revert恢复到修改之前)。...以上就是通过pycharm的database直接操作数据库的步骤啦。
2、Select2控件的实际使用代码分析 1)基础界面代码及操作 使用select2控件,一般是在常规的select控件上,设置一下即可(设置它的class为select2)。...$(document).ready(function() { $(".js-example-basic-single").select2(); }); 一般情况下,如果允许复选多个项目,那么设置 multiple...select> 2)异步数据绑定操作 一般情况下,我们的select控件的数据,是从数据库里面动态加载的,因此一般是通过Ajax方式获取数据并进行绑定即可。...); 多个列表项目数据的绑定。...我们从案例里面可以看到,Select2支持多项值的选择,它们保存后会以逗号分开,如果我们需要在编辑的时候显示存储的多个记录,那么需要把字符串转换为数组列表才能进行正确绑定,如下所示。
1.1、标签中使用on事件属性 1.2、通过JS给标签设置 on 事件属性 1.3、通过JS调用方法的方式 2、jQuery 事件绑定 3、练习 十、jQuery 常用 DOM 操作的方法 1、append...$() 找不到元素不一样: 通过 jQuery 方法获取的页面元素,都是 jQuery 对象。...3:设置 id 为 username 元素的 value 属性值为"叩丁狼教育" p> 问题 4:对比 h1 元素的内容和纯文本的区别...说明:这个标签是直接选择 HTML 代码中 class=”myClass” 的元素或元素组(因为在同一 HTML 页面 中 class 是可以存在多个同样值的元素)。...传统的事件绑定 1.1、标签中使用on事件属性 button> 1.2、通过JS给标签设置 on 事件属性 btn.onCliick = function
结构如下,该元素下包含两个 text 文本,我们只想提取第一个文本内容。 常规的 innertext、textContent 和 outerText 方法只能提取到全部的文本。...可以通过 childNodes[索引] 来指定 text 文本来进行提取。 当然,childNodes[索引] 返回的是对象,再加个 nodeValue 就能返回文本了。
有时在使用select2插件时会遇到这种需求:一次性选择一些数据,然后根据这些数据自动选择相关项,我也遇到了这种需求并实现,这里简单讲讲我的做法: 1.首先我修改了select2的源码,增加了一个方法paste...enable", "disable", "readonly", "positionDropdown", "data", "search","highlight"], 2.捕获paste事件,然后把粘贴板的数据经过处理后传给自定义的...paste方法,在paste方法中完成数据项的选择 //由于select2重载了select元素,真正操作都是操作的select2插件创建的元素,笔者定义的select2元素id为multiple-import-orgId...,s2id_multiple-import-orgId则是select2插件创建的select元素id $("#s2id_multiple-import-orgId").on('paste',function...$(selId).select2('paste',items,selId); //selId为select2插件id }); 通过上面代码,相信都已经明白了其中的原理
通过简单的设置,可以让mysql数据库备份自动化.减少维护的工作量!...一、对于Windows主机 ============== 假想环境: MySQL 安装位置:C:MySQL 论坛数据库名称为:bbs MySQL root 密码:123456 数据库备份目的地:D:db_backup...(例如:每天凌晨5点执行back_db.bat) 二、对于Linux主机 =========== 假想环境: MySQL 安装位置:/usr/local/mysq 论坛数据库名称为:bbs MySQL...root 密码:123456 数据库备份目的地:/var/db_backup/ #!...crontab-e#编辑你的任务 crontab-r#删除用户的crontab的内容 实例讲解二: 系统cron设定:/etc/crontab 通过 /etc/crontab 文件,可以设定系统定期执行的任务
为了方便资源管理和提升工作效率,常用的js和css文件的加载应该放在一个统一文件里面完成,也方便后续的资源维护。所以我用js写了以下方法,存放在“sourceController.js”文件内。.../libs/My97DatePicker/WdatePicker.js", // select2 "cselect2": "javascript/libs/select2/css/select2....min.css", "select2min": "javascript/libs/select2/js/select2.min.js", "select2Func": "javascript.../libs/select2/js/select2Func.js", // validator "cvalidator": "javascript/libs/validation/css/..."javascript/libs/layer/layer.js" }; 在需要引入的页面只需要在加入如下代码就可以一下子引入所有的常用资源了。
Javascript 库 Particles.js — 一个用来在 web 中创建炫酷的浮动粒子的库 Three.js — 一个用来在 web 中创建 3d 物体和 3d 空间的库 Fullpage.js...— 快速实现全屏滚动特性 Typed.js — 打字机效果 Waypoints.js — 滚动到某个元素位置时触发一个功能 Highlight.js — web 语法高亮 Chart.js — 使用 JavaScript... — 滚动时展现动画 Scrolline.js — 页面滚动时显示滚动进度 Velocity.js — 快速流畅的 JavaScript 动画 Animate on scroll — 漂亮的页面滚动元素动画...keycode Sortable — 拖拽插件 Flexdatalist — 自动补全 Slideout.js — 移动应用侧滑导航 Jquerymy — 使用 jQuery 实现双向数据绑定 Cleave.js... — 使用固定定位来创建相关元素 Shepherd.js — 为应用创建新手引导 Tooltip — tooltip 提示框 Select2 — Jquery 选择框插件 IziToast — 通知弹窗实现
iTyped 3. tingle.js 用纯 JavaScript 编写的简约易用的模态插件。 官网:https://tingle.robinparisi.com/ ? tingle.js 4....Sticky Sidebar 这些 JavaScript 插件提供了一种方便的方式来创建粘性组件。可用于创建粘性标题及粘性侧边栏。...可在滚动时为页面上的元素设置动画的小型库。 官网:https://michalsnik.github.io/aos/ ?...AOS 7. jump.js Jump.js 是使用纯 JavaScript(ES6)编写的现代、高性能且可自定义的平滑滚动库。...Choices.js Choices.js 是一个轻巧的,可配置的选择框/文本输入插件。与 Select2 和 Selectize 类似,但没有 jQuery 依赖关系。
getDefaultProps()方法被调用一次并缓存起来——在多个类实例之间共享。在组件的任何实例被创建之前,我们(的代码逻辑)不能依赖这里的this.props。...然后通过getInitialState()为组件设置一个初始state值“{count: 0}”。如果运行这段代码你将会看到控制台输出如下结果: ?...image.png 现在我们想要让Counter组件可以设置this.state.count初始值和增加/减少的步长值,但依然提供一个默认值: var Component = React.createClass...现在可以更新DOM元素了,这意味着这个方法是初始化其他需要访问DOM或操作数据的第三方库的最佳时机。 假设我们想要通过API拉取数据来初始化组件。...我们应该直接在计数器组件的componentDidMount()方法拉取数据,但是这让组件看起来有太多逻辑了,更可取的方案是使用容器组件来做: var Container = React.createClass
领取专属 10元无门槛券
手把手带您无忧上云