前端JS
web-K
从零开始
展开
-
JS中在无内容的父元素中每次在这之前插入元素
方法:父元素.insertBefore(a,b);//在父元素中把子元素a插入到子元素b前面当b = null;时父元素.insertBefore(a,null);<==>父元素.appendChild(a);即在父元素中插入子元素a。解决原理:父元素.insertBefore(a,父元素.children[0]); // 在...原创 2018-11-09 17:51:40 · 1083 阅读 · 0 评论 -
js数组API
创建一个数组:?12345678// 字面量方式:// 这个方法也是我们最常用的,在初始化数组的时候 相当方便var a = [3, 11, 8]; // [3,11,8];// 构造器:// 实际上 new Array === Array,加不加new 一点影响都没有。var a = Array(); // []var a = Array(3); // [unde...转载 2019-03-16 10:44:25 · 1003 阅读 · 0 评论 -
JS中文档碎片的理解和使用
文章原地址:https://www.cnblogs.com/suihang/p/9491359.html1、我们要明白当js操作dom时发生了什么? 每次对dom的操作都会触发"重排"(重新渲染界面,发生重绘或回流),这严重影响到能耗,一般通常采取的做法是尽可能的减少 dom操作来减少"重排" 2、什么是文档碎片? document.createDocumentFr...转载 2019-03-06 11:35:37 · 592 阅读 · 0 评论 -
JS如何让button控件单机后不能获得焦点
问题在页面中设置了一个button按钮,单机后浏览器默认将焦点加在该按钮上,此时我们比如按下空格键,就会再一次触发该按钮我们该如何解决呢?方法1//获取该元素const button = document.querySelector('button');button.onclick = function(e){ e = e || window.event; e.prev...原创 2019-01-12 11:20:02 · 2021 阅读 · 0 评论 -
React-1.实现HelloWorld
初始化npm init 简单配置一下package.json;安装依赖npm install react react-dom babel-standalone -Sreact 核心库react-dom 提供与DOM相关的功能babel-standalone 将JSX语法转为JS语法编写一个helloworld.html文件<!DOCTYPE html>&...原创 2018-12-06 00:23:28 · 170 阅读 · 0 评论 -
webpack 打包ES6语法中的扩展运算符
使用的是4X版本的webpack安装babel-preset-stage-3原创 2018-12-03 15:13:49 · 2461 阅读 · 0 评论 -
阻止默认事件和事件冒泡
阻止默认事件常用兼容方法:function(e){ e = e || window.event; e.preventDefault?e.preventDefault():e.returnValue=false;}阻止事件冒泡function(e){ e = e || window.event; e.stopPropagation?e.stopPropagation():e.ca...原创 2018-12-01 00:29:57 · 296 阅读 · 0 评论 -
事件对象坐标属性
client 以可视区域的左上角为参考page 以文档页面左上角为参考screen鼠标离电脑屏幕的坐标offset 以元素的左上角为参考原创 2018-12-01 00:02:59 · 271 阅读 · 0 评论 -
JS盒模型属性(client,scroll,offset家族)
client家族clientWidth:获取对象的内容可视区域的宽度,即clientWidth=width+左右padding,不包括滚动条。clientHeight:获取对象的内容可视区域的高度,即clientHeight=height+上下padding,不包括滚动条。注:与内容是否溢出无关兼容问题怪异模式与标准模式下获取clientWidth的方法不一样//求浏览器视...原创 2018-11-30 22:07:05 · 231 阅读 · 0 评论 -
坑:first-child和:first-of-type的区别(:first-child选择无效)
使用:first-child发现选择不起效,网上查了发现自己对:first-child和:first-of-type区别的认识不到。:first-child 匹配父元素的第一个子元素E。 列表项一 列表项二 列表项三 列表项四在上述代码中,如果我们要设置第一个li的样式,那么代码应该写成li:first-child{sRules},而不是ul:first-child{sRule...转载 2018-12-04 20:57:17 · 639 阅读 · 0 评论 -
js字符串方法
原文地址:https://www.cnblogs.com/hcxy/p/7376648.htmlcharAt() 返回指定位置的字符。str.charAt(index)index 为必须参数,类型为number(0到str.length-1之间,否则该方法返回 空串)另外:str.charAt()即不带参数和str.charAt(NaN)均返回字符串的第一个字符2. ...转载 2019-03-16 12:57:12 · 229 阅读 · 0 评论