JAVASCRIPT
闻大师
记录自己学习前端的历程
展开
-
javaScript闭包
//函数记住并访问其所在的词法作用域,叫做闭包现象,而此时函数对作用域的引用叫做闭包。<script > var data = []; for(var k = 0; k < 3; k++){ //for循环不是在一个函数中,所以k是全局变量,在for循环结束的时候k=3; (function(k){ da...翻译 2017-11-28 11:37:01 · 182 阅读 · 0 评论 -
获取地址栏的search
https://s.taobao.com/search?name=list&age=23;<script> function getSearch(){ var args=[]; var str=location.search.length>0?location.search.substring(1):""; var arrs=str.split翻译 2017-11-28 11:51:39 · 363 阅读 · 0 评论 -
JS对象的深浅拷贝
深浅拷贝是针对不同类型的数据进行对应的操作。存储在栈中的数据,如String,Boolean,Number等类型数据使用浅拷贝即可,像object,array这种存储在堆中的数据,使用浅拷贝仅仅拷贝的是存储在栈中的地址名,并没有在堆中开辟新的内存,指向的还是同一个对象。//浅拷贝适用于非引用类型的(字符数值等)拷贝 var obj1={ age:15,原创 2018-01-11 10:54:05 · 224 阅读 · 0 评论 -
vue学习之路(1)——搭建vue脚手架(vue-cli)
准备的环境和工具 1. 首先安装node.js,官网:https://nodejs.org/en/ win+r 输入cmd 打开 命令行 输入 **node -v** 出现相应的版本号,则说明安装成功。此时已经自带npm(包管理工具) 2. 安装淘宝镜像(cnpm),打开命令行工具,输入:**npm install -g cnpm --registry= https://registry转载 2018-01-02 11:42:47 · 876 阅读 · 0 评论 -
vue.js使用select切换图片
div id="app"> div class="pic"> img :src=imgsrc> div>第1张第2张第3张 option无法添加事件--> select v-model="selected" @change="changeimg(parseInt(selected))"> option value="1">第一张o原创 2018-01-04 17:56:49 · 2768 阅读 · 0 评论 -
vue 组件之间的通信(父子、非父子)
//子组件向父组件传递数据<div id="app"> <test-child receive-child="标题"></test-child></div> - 在子组件test-child使用 props 声明: props:['receiveChild'] 然后父组件就可以向trans里传递数据,动态数据需加冒号 :recei...原创 2018-01-09 17:48:19 · 219 阅读 · 0 评论 -
for循环中的let 和 var
for(var i=0;i<5;i++){ setTimeout(function(){ console.log(i); },0) }// 结果 5 5 5 5 5for(let i=0;i<5;i++){ setTimeout(function(){ console.lo...翻译 2018-03-07 17:15:38 · 5211 阅读 · 3 评论 -
词法作用域和动态作用域
//JS环境是词法作用域,函数在声明时,其所处的位置已经决定了作用域,无论这个函数在哪里被调用,都不会改变。 var a = 6; function foo() { console.log( a ); } function bar() { var a = 3; foo(); } bar() /...原创 2018-03-08 11:34:48 · 125 阅读 · 0 评论 -
面向对象编程的几种常见设计模式
<script>//前言:由同一个构造函数创造出来的多个对象,会有不同的地址,所以不会是相等的。//单例模式:确保某个类(构造函数)只有一个实例,且自行实例化并向整个系统提供这个实例。 function Bar(){ if(!Bar.inst){ //判断是不是已经存在这个实例 Bar.inst = { name转载 2018-03-15 11:43:51 · 1315 阅读 · 0 评论 -
vue-cli 引用axios
1.先在项目中使用命令行工具下载axios : npm install axios --save//有时候不成功,使用 npm install axios --save -dev 就成功了,我也不知道什么区别2.然后在 main.js中引入:import axios from 'axios';Vue.prototype.$ajax=axios; //这里的写法和别的插件不一样,不是...原创 2018-01-05 14:14:33 · 264 阅读 · 0 评论 -
一道题,用以下代码输出“好好学习,天天向上”
<script>var Ltest=function(i){ this.get=function(success,error){ return[function(){ var obj = { name:"天天向上" ...原创 2018-03-13 17:11:56 · 4240 阅读 · 0 评论 -
移动端开发相关
//自适应(function(doc, win) { var docEle = doc.documentElement; var fn = function() { var width = docEle.clientWidth; docEle.style.fontSize = 100 * (width / 750) + "px"; //假设设计图...转载 2017-12-05 16:51:26 · 292 阅读 · 0 评论 -
过滤字母,只能输入数字的设置
<form method="get"> <textarea rows="10" cols="30" style="ime-mode:disabled"></textarea> <!--style="ime-mode:disabled"禁止输入法(谷歌不支持)--></form><script> window.onload=function(){ va原创 2017-12-01 09:54:40 · 306 阅读 · 0 评论 -
阻止/设置表单提交
<form id="fm" name="thef" method="get"> <!--不设置action默认提交到当前页面--> <input type="text"/> <input id="sub" type="submit" value="submit"> </form><script type="text/javascript">原创 2017-11-29 16:45:20 · 189 阅读 · 0 评论 -
JavaScript创建文本节点
<div id="text"></div><script> window.onload=function(){ var textcon=document.getElementById("text"); var text1=document.createTextNode("你好"); //一个节点 var text2=document.creat原创 2017-11-08 23:15:58 · 1173 阅读 · 0 评论 -
Node节点类型的判断。
<div id="div1">我是html,重点看js</div>window.onload=function(){ var div=getElementById("div1"); //判断div节点类型 if(div.nodeType==1){ alert("我是元素节点") } if(div.childNodes[0].nodeType==原创 2017-11-08 21:37:33 · 2380 阅读 · 0 评论 -
JavaScript获取css属性的兼容写法
//注意:IE8以下不支持querySelector也不支持getElementsByClassNamevar imgbox=document.querySelector("#box"); function getStyle(elem,attr){ if(window.getComputedStyle){ //W3C原创 2017-11-09 11:16:10 · 251 阅读 · 0 评论 -
javaScript获取或者设置css属性
//设置或者获取css属性function css(elem,attr,val){ if(arguments.length==2){ //arguments是实参的个数,length是形参的个数 return getStyle(elem,attr); //getStyle见上篇文章 }else if(arguments.length==3){原创 2017-11-09 11:19:51 · 252 阅读 · 0 评论 -
使用scrollIntoView()进行内容定位
<p id="txt">假设此段落需滚动才能看见</p>window.onload=function(){ document.getElementById("txt").scrollIntoView(); //此方法会让页面一进来就能看见txt段落,即一开始就定位到此段落}原创 2017-11-09 21:43:47 · 3231 阅读 · 0 评论 -
innerHTML和innerText
<div id=study> <span>学习好累</span></div>//js代码var study=document.querySelector("#study"); //IE8+支持此方法study.innerHTML="<b>睡觉吧</b>" //结果:**睡觉吧**study.innerText="<b>睡觉吧</b>" //结果:<b>睡觉吧</b>//原创 2017-11-09 22:24:15 · 162 阅读 · 0 评论 -
javaScript行内样式的获取及注意事项
<div id="txt" style="color:red;font-size:100px;float:left"><div><script> window.onload=function(){ var test=document.querySelect("#txt"); //获取字体,需用驼峰式写法 test.style.fontSize原创 2017-11-13 22:51:54 · 770 阅读 · 0 评论 -
事件对象(二)
W3C方法,mouseover事件和mouseout事件通过relatedTarget获取鼠标从哪个元素移入到当前元素,或移到哪个元素,IE中是通过fromElement和toElement获取(需要判断一下事件)。 e.type 判断是什么事件 e.target判断调用事件的对象(IE中用srcElement) 获取event兼容写法: e=e||window.event翻译 2017-11-27 23:10:50 · 178 阅读 · 0 评论 -
javascript的三种事件模型
*内联模型,写在标签里,事件作为标签的属性存在,例:*<button onclick="alert('hello')">点击</button>*脚本模型:*<button>点击</button><script>window.onload=function(){ var btn=document.getElementByTagName('button'); btn.onclic原创 2017-11-21 21:16:58 · 712 阅读 · 0 评论 -
获取DOM元素尺寸及鼠标位置
clientX,clientY,获取鼠标在可视区域中的坐标(和页面长度无关); screenX,screenY,获取鼠标相对于电脑屏幕左边和上边的坐标;原创 2017-11-21 23:16:31 · 635 阅读 · 0 评论 -
事件对象
当触发某个事件时,会产生一个事件对象,这个对象包含所有与事件有关的信息,一般称作event对象,是浏览器通过函数把这个对象作为参数传进来的。普通函数中不存在事件对象!“对于mouseup和mousedown事件,其event对象中存在一个button属性,表示按下或释放的是哪个键(左键/中间/右键),比如:document.onmousedown=function(e){ e=e||win原创 2017-11-21 22:55:28 · 188 阅读 · 0 评论 -
this 的指向
<script type="text/javascript"> var color="红色"; var myobj={ color:"蓝色" } function showColor(){ alert(this.color) //this 指向调用它的那个对象 }原创 2018-03-20 09:26:52 · 195 阅读 · 0 评论