![](https://img-blog.csdnimg.cn/20201014180756925.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
web
阮太太
这个作者很懒,什么都没留下…
展开
-
ES6中的entries
//1.输入的一个对象,返回的是以对象的属性名和属性值组成的二维数组 var obj = { foo: "mm", baz: 324 }; console.log(Object.entries(obj)) //[["foo","mm"],["baz",324]];// 2.如果原对象的属性名是一个Symbol值,该属性会被忽略console.log(Object.entri...原创 2019-11-13 20:40:28 · 1183 阅读 · 0 评论 -
作用域插槽
在使用插槽时,若是想通过插槽,可以把税对象中data的数据展示到页面中,一直借用插槽的作用域--------------------------Vue.component('mycomponents', { data() { return { user: { name: "我是slot中绑定上去的" } ...原创 2019-11-08 16:30:08 · 150 阅读 · 0 评论 -
vue之插槽
什么是插槽:插槽就相当于占位置,帮指定的和插槽的name设置的一样的v-slot的元素占一个位置,可以放自己想放入的东西在Vue实例中定义局部的组件,然后slot使用标签来定义一个插槽 <slot name = b></slot>中的name相当于是这个slot的身份证在html的代码中也是通过这个name名来找到他的对应的插槽new Vue({ ...原创 2019-11-08 16:14:54 · 158 阅读 · 0 评论 -
定义指令
html代码部分:> <div id="app">> <input type="text" v-model="content" v-slice:11.number="content">> {{ content }}> </div>JavaScript代码部分:// 定义指令的时候不需要...原创 2019-11-08 16:06:21 · 228 阅读 · 0 评论 -
Vue基础指令
html部分:<div id="app"> <!-- 插值表达式 --> <!-- {{ --> <!-- 这里面写表达式 --> <!-- }} --> {{"hello world"}} {{"hello" +" world"}} {{ {a:1,b:2} }} <...原创 2019-11-08 16:01:27 · 98 阅读 · 0 评论 -
箭头函数
// 用法: // function show (argument) { // console.log("242燃烧弹") // } // 同等于: let show = () => { console.log("242燃烧弹") } // 箭头函数的特点: // 1.箭头函数不会有创建自己的this,所以箭头函...原创 2019-10-18 11:34:26 · 142 阅读 · 0 评论 -
ES6新增方法
1. Object.is(),比较两个参数是否完全相等,作用和“===”一样let arr = [1, 2, 3, 4];let arr1 = [1, 2, 3, 4];let ae = "1";let as = "1";console.log(Object.is(arr, arr1)) //false,数组不是基本数据类型,他们的地址不一样console.log(Object.is(...原创 2019-10-18 11:24:56 · 175 阅读 · 0 评论 -
ES6之前的4种继承方法
<script type="text/javascript">// 1.使用call()或则apply()方法达到继承效果// 汽车例子:// 使用call()方法达到继承效果:需要把实参按照形参的个数传进去 function Wheel(wheelSize,style){ this.wheelSize = wheelSize; this.style = st...原创 2019-10-18 11:09:46 · 810 阅读 · 0 评论 -
ES6中的keys()方法详解
<script type="text/javascript">// 1.传入对象,返回的是属性名var obj = { 'a': 123, "b": 456 };console.log(Object.keys(obj)) //["a","b"]var obj1 = { 100: "a", 2: "b", 23: "c" };console.log(Object.keys(o...原创 2019-10-15 20:30:23 · 2546 阅读 · 0 评论 -
实现二级菜单的伸缩功能的两种方法
要求1、点击一级菜单,如果当前二级菜单是打开状态则二级菜单收起,小图标变成+如果当前二级菜单是关闭状态则展开二级菜单,小图标变成- 并且收起其他的二级菜单2、页面中的二级菜单最多只能有一个是展开状态方法一: <html><head><title>1. 实现伸缩二级菜单</title><meta charset="utf-8" ...原创 2019-08-21 16:21:34 · 1739 阅读 · 0 评论 -
ES5中新添加的有关数组的API
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>ES5中新添加的API</title> <script type="text/javascript"> // 1.判断类API // (1.)every(...原创 2019-08-12 19:21:00 · 128 阅读 · 0 评论 -
判断一个数的类型
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>原型链</title></head><body> <pre> 原型本身也是个对象,因此原型对象也有原型 对象就有__proto__ ...原创 2019-08-12 19:24:26 · 200 阅读 · 0 评论 -
当拖拽元素时遇到的各种问题,以及解决方法
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>设置整个页面的元素都能拖动</title> <style type="text/css"> #box1 { width: 100px; height: 100...原创 2019-08-27 19:57:14 · 1606 阅读 · 0 评论 -
两级联动实现的三种方法
方法一:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <script type="text/javascript"> window.onload = function(){...原创 2019-08-21 16:18:50 · 2291 阅读 · 0 评论 -
修改属性值
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>修改属性</title></head><body> <a href="http://www.bailiban.com" id="aLink" cla...原创 2019-08-21 16:13:15 · 560 阅读 · 0 评论 -
不同的情况下读取当前元素的样式
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> #btn1{ background-color: burlywood; } #box1{...原创 2019-08-21 16:11:59 · 73 阅读 · 0 评论 -
函数没有返回值调用
var x = 1, y = z = 0;function add(n) { n = n+1;}y = add(x);function add(n) { n = n + 3;}z = add(x); console.log(x);//1 console.log(y);//undefind console.log(z);//undefined 原因:后面的a...原创 2019-08-21 16:09:50 · 3391 阅读 · 0 评论 -
有关关联数组便利的常识问题
Object.prototype.bar = 1;var foo = {moo : 2};for(var i in foo){console.log(i);}输出结果:moo bar因为在便利关联数组的时候,会把它原型上的元素也遍历到原创 2019-08-21 16:04:18 · 80 阅读 · 0 评论 -
有关字符串API中的substring
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title></head><body> <script type="text/javascript"> var a...原创 2019-08-21 16:02:17 · 157 阅读 · 0 评论 -
关于字符串API replace的巧用
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title></title></head><body> <script type="text/javascript"> var str = " 取自...原创 2019-08-21 15:59:46 · 271 阅读 · 0 评论 -
js中有关重载函数arguments
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>重载</title></head><body> <pre> 什么是重载? 相同函数名,不同参数列表的多个函数 在调用时,可以根据传...原创 2019-08-12 20:07:35 · 115 阅读 · 0 评论 -
BOM
BOM-浏览器对象模型-BOM可以让我们通过JS来操作浏览器-在BOM 中为我们提供了一组对象,用来完成对浏览器的操作-BOM对象:Window-代表的是整个浏览器的窗口,同时window也是网页中的全局对象Navigator-代表当前浏览器的信息,通过该对象,可以来识别不同的浏览器Location-代表当前浏览器的地址栏信息,通过location可以获取地址栏信息,或则操作浏...原创 2019-08-26 20:52:10 · 86 阅读 · 0 评论 -
输入一个日期,判断是星期几
> <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8">> <title>Document</title> </head> <body> <button> onclick="weekDay()"&g...原创 2019-07-25 11:39:14 · 1338 阅读 · 0 评论 -
向服务器发送文件
html代码部分:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title></head><body> <form method="post" action="files-...原创 2019-10-09 10:40:32 · 522 阅读 · 0 评论 -
ES6中新加的数组API
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <p>123</p> <p>1...原创 2019-09-19 08:39:24 · 314 阅读 · 0 评论 -
svg中的path
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <style type="text/css"> body{ text-align: center; }...原创 2019-09-17 20:54:04 · 218 阅读 · 0 评论 -
SVG中的结构化、分组和引用元素
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <style> svg{background-color:white;} ...原创 2019-09-17 20:36:16 · 384 阅读 · 0 评论 -
单次匀速改变单个元素的单个属性的封装函数.js
//elem是需要修改的元素,target是修改的元素需要达到的目标,change_style是需要修改的元素的属性 function move(elem, target, change_style) { //每一次开始的时候都清除上一次的定时器 clearInterval(elem.timer); elem.timer = setInterval(function()...原创 2019-09-12 09:53:55 · 101 阅读 · 0 评论 -
ES6中新添加的字符串API
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript"> //数组API: const s = "Hello world!"; // ...原创 2019-09-12 09:53:03 · 218 阅读 · 0 评论 -
canvas时针
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> #my_canves { display: block; margin: auto; ...原创 2019-09-12 09:52:15 · 157 阅读 · 0 评论 -
BOM中的location以及了解href的组成
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <script type="text/javascript"> /* Location对象中分装了了浏览器中地址栏的信息 ...原创 2019-08-26 20:53:57 · 323 阅读 · 0 评论 -
BOM中的navigation,以及辨别浏览器的类型
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title></head><body> <script type="text/javascript"> // Navig...原创 2019-08-26 20:53:06 · 610 阅读 · 0 评论 -
有关一个对象在修改时影不影响原型的问题
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <script type="text/javascript"> function Student(sn,sa){ ...原创 2019-08-21 15:56:15 · 125 阅读 · 0 评论 -
自己编写一个API(就是在原型中添加一个函数)
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <script type="text/javascript"> //原型一般用来解决浏览器的兼容问题,如果一个新的API,新版...原创 2019-08-21 15:53:44 · 487 阅读 · 0 评论 -
bind,apply,cell的区别以及用法
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <script type="text/javascript"> // bind()方法会给予一个现有的函数,把这个函数复制,再...原创 2019-08-21 15:50:55 · 1423 阅读 · 0 评论 -
关于位运算符
练习console.log((10 & 1) === 0);//用来判断一个数是奇数还是偶数console.log((7 & 1) === 0);resolt = num1 | num1;console.log(resolt);//|按位转换成二进制,然后按位做与的比较,比较以后var num1 = 5;//—二进制:101var num2 = 3;/...原创 2019-07-22 19:18:47 · 84 阅读 · 0 评论 -
逻辑运算题
<head> <meta charset="utf-8" /> <title></title> <script type="text/javascript"> //1.为抵抗洪水,展示连续作战89小时,编程计算共多少天零多少小时? //var time=prompt("请输入时间",""); //var day=p...原创 2019-07-21 13:47:34 · 1343 阅读 · 0 评论 -
写出一个函数,查找出输入的字符串中,连续出现最多的字符,讲这个字符和它出现的次数输出
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title></head><body> <script type="text/javascript"> //写出一...原创 2019-08-02 17:37:10 · 794 阅读 · 0 评论 -
利用Unicode码输出4位不重复的验证码
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title></head><body> <script type="text/javascript"> ...原创 2019-08-02 17:35:57 · 142 阅读 · 0 评论 -
超市收银问题
<head> <meta charset="UTF-8"> <title></title></head><body> <p id="comm"></p> <script type="text/javascript"> var hosh = []; hosh["青菜...原创 2019-08-02 17:33:50 · 282 阅读 · 0 评论