按钮 | 易学教程

vue cli3---elementUI 按需导入（babel.config.js）

阅读更多关于 vue cli3---elementUI 按需导入（babel.config.js）

在使用vue cli3脚手架时，需要按需导入element-ui 组件，步骤如下： 1. 安装element-ui npm i element-ui -S 2. 按需导入需要安装，babel-plugin-component npm install babel-plugin-component -D 3.官网提供的是，将 .babelrc 修改为： { "presets": [["es2015", { "modules": false }]], "plugins": [ [ "component", { "libraryName": "element-ui", "styleLibraryName": "theme-chalk" } ] ] } 注意：项目中没有.babelrc文件，无需新建.babelrc文件，直接可以在babel.config.js中配置即可，如下： module.exports = { presets: [ '@vue/app', ["@babel/preset-env", { "modules": false }] ], plugins: [ [ "component", { "libraryName": "element-ui", "styleLibraryName": "theme-chalk" } ] ] } 这里需要注意：

使用ivx学习开发通知和全局提示的经验总结

阅读更多关于使用ivx学习开发通知和全局提示的经验总结

今天要给大家分享的经验是关于如何使用ivx创建一个通知的，通知就是悬浮出现在页面角落，显示全局的通知提醒消息，常用于：较为复杂的通知内容；带有交互的通知，给出用户下一步的行动点；系统主动推送。我依然使用官网来给大家进行分析： 1.我们先总体分析一下这个demo的结构：这个demo的结构很简单，只有一个触发事件使用的按钮，和一个作为通知的横幅，横幅组件是一种特殊的定位工具，其可在滚动页面中处于固定位置而不随页面滚动。 2.先创建好满足需求的组件，也就是一个用来触发通告显示按钮，和触发后显示通知的顶部横幅，然后在横幅下创建好自己想要通知的内容就行了，这里这个内容是可以按自己的需求更改的，另外要注意记得预览前先将横幅隐藏，因为刚开始没有触发的时候通告是不显示的。 3.接下里我们看看这个触发通告的按钮的事件因为，我们把通告的内容全部放在弹窗横幅下面的，所以，让通告显示只需要让弹窗横幅显示就行了，这里设置延迟是为了让用户看出变化，这样在弹窗显示的时候再点击的时候会有重新显示的视觉效果，这种设置常适用于登录按钮密码输入错误是发出通知的情况。另外要给大家分享的经验是关于如何使用ivx创建一个全局提示的，全局通告类似于通知，但是信息内容常用于提示用户的操作反馈，且该提示内容会在延迟时间后自动消失，且一般不可与之交互。我依然使用官网来给大家进行分析： 1.我们先总体分析一下这个demo的结构：

Vue2.0 【第四季】第3节实例事件

阅读更多关于 Vue2.0 【第四季】第3节实例事件

目录 Vue2.0 【第四季】第3节实例事件第3节实例事件一、$on 在构造器外部添加事件二、$once执行一次的事件三、$off关闭事件 Vue2.0 【第四季】第3节实例事件第3节实例事件实例事件就是在构造器外部写一个调用构造器内部的方法。这样写的好处是可以通过这种写法在构造器外部调用构造器内部的数据。我们还是写一个点击按钮，持续加1的例子。一、$on 在构造器外部添加事件 app.$on('reduce',function(){ console.log('执行了reduce()'); this.num--; }); $on接收两个参数，第一个参数是调用时的事件名称，第二个参数是一个匿名方法。如果按钮在作用域外部，可以利用$emit来执行。 //外部调用内部事件 function reduce(){ app.$emit('reduce'); } 全部代码： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>example03</title> <script type="text/javascript" src="..

createTextNode() 方法和createTextNode（）方法

阅读更多关于 createTextNode() 方法和createTextNode（）方法

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>菜鸟教程(runoob.com)</title> </head> <body> <p id="demo">单击按钮创建一个标题</p> <button onclick="myFunction()">点我</button> <script> function myFunction(){ var h=document.createElement("H1"); var t=document.createTextNode("Hello World"); h.appendChild(t); document.body.appendChild(h); }; </script> </body> </html> document.createElement() 创建元素节点 document.createAttribute() 创建一个属性节点 document.createTextNode() 创建文本节点来源： https://www.cnblogs.com/hulaoxi/p/7263040.html

getElementById和ByTagName的区别

阅读更多关于 getElementById和ByTagName的区别

原生js中获取元素的方法有很多，那么今天就来重点说一下getElementById和ByTagName的区别： 1、getElementById前面必须是document；而getElementByTagName前面除了是document也可以是其他的元素；先来看一下简单的html代码 1 <ul> 2 <li></li> 3 <li></li> 4 <li></li> 5 </ul> 6 <ol> 7 <li></li> 8 <li></li> 9 <li></li> 10 </ol> 举例说明，就如上面的html，我们若是想要找到ol里的li，那么我们就应该先找到ol，然后找它里面的li，那么js代码获取就应该这么写 1 var Ol=document.getElementById("ol");//就要先把ol上设个id，然后通过id找到它 2 var li=Ol.getElementsByTagName("li");//接下来就找ol里的li 2、getElementById算是一个静态方法，而getElementByTagName是一个动态方法，需注意的是ByTagName找到的元素肯定是一个集合，就算页面只有一个，那么也就说这个集合的长度为1，和数组类似。比如，一个页面里没有任何标签，但是我们想给它动态添加几个button，那么我们就应该先给body添加几个，应该这么写

前端基础之jQuery入门 01

阅读更多关于前端基础之jQuery入门 01

jQuery介绍 jQuery是一个轻量级的、兼容多浏览器的JavaScript库。 jQuery使用户能够更方便地处理HTML Document、Events、实现动画效果、方便地进行Ajax交互，能够极大地简化JavaScript编程。它的宗旨就是："Write less, do more." 优势一款轻量级的JS框架。jQuery核心js文件才几十kb，不会影响页面加载速度。丰富的DOM选择器,jQuery的选择器用起来很方便，比如要找到某个DOM对象的相邻元素，JS可能要写好几行代码，而jQuery一行代码就搞定了，再比如要将一个表格的隔行变色，jQuery也是一行代码搞定。链式表达式。jQuery的链式操作可以把多个操作写在一行代码里，更加简洁。事件、样式、动画支持。jQuery还简化了js操作css的代码，并且代码的可读性也比js要强。 Ajax操作支持。jQuery简化了AJAX操作，后端只需返回一个JSON格式的字符串就能完成与前端的通信。跨浏览器兼容。jQuery基本兼容了现在主流的浏览器，不用再为浏览器的兼容问题而伤透脑筋。插件扩展开发。jQuery有着丰富的第三方的插件，例如：树形菜单、日期控件、图片切换插件、弹出窗口等等基本前端页面上的组件都有对应插件，并且用jQuery插件做出来的效果很炫，并且可以根据自己需要去改写和封装插件，简单实用。4

AspNetPager分页控件--使用方法 2

阅读更多关于 AspNetPager分页控件--使用方法 2

二、三等代替。 /// </remarks> [Browsable(true), Category("导航按钮"), DefaultValue(false), Description("是否将页索引数值按钮用中文数字一、二、三等代替")] public bool ChinesePageIndex { get { object obj=ViewState["ChinesePageIndex"]; return (obj==null)?false:(bool)obj; } set { ViewState["ChinesePageIndex"]=value; } } /// <summary> /// 获取或设置页索引数值导航按钮上文字的显示格式。 /// </summary> /// <value> /// 字符串，指定页索引数值按钮上文字的显示格式，默认值为<see cref="String.Empty"/>，即未设置该属性。</value> /// <remarks> /// 使用NumericButtonTextFormatString属性指定页索引数值按钮的显示格式，如未设置该值时索引按钮文本将会是：1 2 3 ...，设置该值将改变索引按钮文本的显示格式， /// 如将该值设为“[{0}]”则索引文本会显示为：[1] [2] [3] ...，将该值设为“-{0}-

jQuery学习(三)——选择器总结

阅读更多关于 jQuery学习(三)——选择器总结

1、基本选择器 id选择器：$(“#id名称”); 元素选择器：$(“元素名称”); 类选择器：$(“.类名”); 通配符：* 多个选择器共用(并集) 案例代码： 1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="UTF-8"> 5 <title>基本选择器</title> 6 <link rel="stylesheet" href="../../css/style.css" /> 7 <script type="text/javascript" src="../../js/jquery-1.8.3.js" ></script> 8 <script> 9 $(function(){ 10 $("#btn1").click(function(){ 11 $("#one").css("background-color","pink"); 12 }); 13 14 $("#btn2").click(function(){ 15 $(".mini").css("background-color","pink"); 16 }); 17 18 $("#btn3").click(function(){ 19 $("div").css("background-color","pink"); 20 }); 21 22 $("#btn4")

WEB打印大全

阅读更多关于 WEB打印大全

1、控制"纵打"、横打”和“页面的边距。（1）<script defer> function SetPrintSettings() { 　// -- advanced features 　factory.printing.SetMarginMeasure(2) // measure margins in inches 　factory.SetPageRange(false, 1, 3) // need pages from 1 to 3 　factory.printing.printer = "HP DeskJet 870C" 　factory.printing.copies = 2 　factory.printing.collate = true 　factory.printing.paperSize = "A4" 　factory.printing.paperSource = "Manual feed" 　// -- basic features 　factory.printing.header = "This is MeadCo" 　factory.printing.footer = "Advanced Printing by ScriptX" 　factory.printing.portrait = false 　factory.printing.leftMargin

jQuery 效果 – 动画

阅读更多关于 jQuery 效果 – 动画

在使用jQuery动画时，你可能想要实现更加丰富的效果，那么你可以通过使用 jQuery animate() 方法自定义动画来达到目的，具体的使用方法如下文所述。 jQuery animate() 方法允许您创建自定义的动画。 jQuery 注：实例运行过一次后，需刷新页面方可再次运行实例。 jQuery 动画 - animate() 方法 jQuery animate() 方法用于创建自定义动画。语法： $( selector ).animate({ params } ,speed,callback ); 必需的 params 参数定义形成动画的 CSS 属性。可选的 speed 参数规定效果的时长。它可以取以下值："slow"、"fast" 或毫秒。可选的 callback 参数是动画完成后所执行的函数名称。下面的例子演示 animate() 方法的简单应用。它把 <div> 元素往右边移动了 250 像素：实例 $("button").click(function(){ $("div").animate({left:'250px'}); }); 尝试一下 » 默认情况下，所有 HTML 元素都有一个静态位置，且无法移动。如需对位置进行操作，要记得首先把元素的 CSS position 属性设置为 relative、fixed 或 absolute！注意：在

订阅按钮