web前端笔记
我的IP在路上
技术要感想,代码要敢写,细节要敢专,没什么不可能!
展开
-
JS操作数组(转载)
javascript数组操作大全,数组方法总汇shift:删除原数组第一项,并返回删除元素的值;如果数组为空则返回undefined var a = [1,2,3,4,5]; var b = a.shift(); //a:[2,3,4,5] b:1unshift:将参数添加到原数组开头,并返回数组的长度 var a = [1,2,3,4,5]; var b = a.unshift(-2,转载 2015-05-09 12:30:30 · 350 阅读 · 0 评论 -
获取class函数的封装
<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title></head><script> window.onload=function(){ var oUl1=document.getElementById("ul1"); var arr=[];原创 2015-05-05 12:49:13 · 563 阅读 · 0 评论 -
关于事件冒泡
事件冒泡:当一个元素接受到事件的时候,会把他接收到的事件传播给他的父级,一直到顶层的window。 下面看例子: 例一:<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title></head><body><input type="button" value="hah"></b原创 2015-05-05 12:53:57 · 402 阅读 · 0 评论 -
有关键盘事件
onkeydown : 当键盘按键按下的时候触发 onkeyup : 当键盘按键抬起的时候触发event.keyCode : 数字类型 键盘按键的值 键值 ctrlKey,shiftKey,altKey :布尔值,当一个事件发生的时候,如果ctrl || shift || alt 是按下的状态,返回true,否则返回false例一:<!DOCTYPE HTML><html><head><m原创 2015-05-05 20:04:46 · 418 阅读 · 0 评论 -
阻止浏览器默认行为
事件默认行为:当一个事件发生的时候浏览器自己会默认做的事情 怎么阻止? 当前这个行为是什么事件触发的,然后在这个事件的处理函数中使用return false; 例一:自定义右键菜单<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title></head><style> d原创 2015-05-05 20:05:59 · 632 阅读 · 0 评论 -
拖拽原理-问题-解决办法
拖拽原理,拖拽问题,解决拖拽问题的兼容性原创 2015-05-05 20:10:47 · 492 阅读 · 0 评论 -
CSS在IE6下的一些BUG和兼容性问题及解决办法
兼容性一直是前端的一大问题,也是让前端工程师很头痛的事情,在浏览器中,各厂商都有一套属于自己的标准和方法,从某种程度上看,是否能很好的处理兼容性问题,体现着一个前端工程师的水平,下面看一下CSS在IE6下的一些问题和解决的办法,虽然IE6基本已经被淘汰?,但仍然不能忽视,像hao123,腾讯这些网站,仍然兼容到IE6,以下是从各方面收集的解决办法,若有不当或者有更好的解决办法,欢迎交流 (^-^)。原创 2015-05-25 00:08:48 · 2154 阅读 · 0 评论 -
link和@import的区别
今天看到一公司的web笔试题,其中有一题是说说link和@import的区别。 页面中使用CSS的方式主要有3种:行内添加定义style属性值,页面头部内嵌调用和外面链接调用,其中外面引用有两种:link和@import。外部引用CSS两种方式link和@import的方式分别是: XML/HTML代码 代码代码如下:<link rel="stylesheet" rev="stylesheet"原创 2015-06-15 19:55:31 · 485 阅读 · 0 评论 -
元素的创建,插入,替换和删除
1.创建元素:document.createElement(标签名称) 2.插入元素:父级.appendChild(要添加的元素) 方法 追加子元素 3.在目标元素之前插入元素:父级.insertBefore(新的元素,被插入的元素) 方法 在指定元素前面插入一个新元素 在ie下如果第二个参数的节点不存在,会报错 在其他标准浏览器下如果第二个参数的节点不存在,则会以appendChild的形原创 2015-05-05 12:47:13 · 563 阅读 · 0 评论 -
事件绑定的第二种形式
<!DOCTYPE HTML><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><title>无标题文档</title><script>//给一个对象绑定一个事件处理函数的第一种形式//obj.onclick = fn;function fn1() { alert(th原创 2015-05-05 12:55:13 · 497 阅读 · 0 评论 -
offsetLeft,offsetTop,offsetWidth,offsetHeight的使用
元素.offsetLeft[Top]:只读属性,当前元素到定位父级的距离(偏移值),也可以理解成到当前元素的offsetParent的距离。1.如果当前元素和父级都没有定位情况:‘ 例一:<!DOCTYPE HTML><html><head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8">原创 2015-05-04 20:05:33 · 476 阅读 · 0 评论 -
JS字符串和数组操作方法(转载)
一、字符串的创建创建一个字符串有几种方法。最简单的是用引号将一组字符包含起来,可以将其赋值给一个字符串变量。var myStr = "Hello, String!";可以用双引号或单引号将字符串包含,但要注意,作为界定字符串的一对引号必须是相同的,不能混用。像var myString = “Fluffy is a pretty cat.’; 这样的声明就是非法的。允许使用两种引号,使得某些操作变得简转载 2015-05-09 10:06:44 · 1011 阅读 · 0 评论 -
parentNode和offsetParent的使用
parentNode和offsetParent的使用原创 2015-04-30 08:46:14 · 3334 阅读 · 0 评论 -
firstChild,lastChild,NextSibling,previousSibling的使用
firstChild,lastChild,NextSibling,previousSibling的使用原创 2015-04-28 20:12:16 · 1526 阅读 · 0 评论 -
childNodes,children和noteType
childNodes,children和noteType的使用原创 2015-04-28 19:24:37 · 752 阅读 · 0 评论 -
javascript中字符串常用操作总结、JS字符串操作大全
字符串的操作在js中非常频繁,也非常重要。以往看完书之后都能记得非常清楚,但稍微隔一段时间不用,便会忘得差不多,记性不好是硬伤啊。。。今天就对字符串的一些常用操作做个整理,一者加深印象,二者方便今后温习查阅。 String对象属性 (1) length属性 length算是字符串中非常常用的一个属性了,它的功能是获取字符串的长度。当然需要注意的是js中的中文每个汉字也只代表一个字符,这里可能跟转载 2015-05-11 19:38:48 · 508 阅读 · 0 评论 -
JS中的日期(Date)对象
Date 对象方法FF: Firefox, IE: Internet Explorer方法 描述 FF IE Date() 返回当日的日期和时间。 1 3 getDate() 从 Date 对象返回一个月中的某一天 (1 ~ 31)。 1 3 getDay() 从 Date 对象返回一周中的某一天 (0 ~ 6)。 1 3 getMonth() 从 D转载 2015-05-12 11:21:26 · 451 阅读 · 0 评论 -
BOM的属性和方法
BOM : Browser Object Model 浏览器对象模型。 其实我们经常写的window对象就是浏览器的一个对象,下面通过一些例子了解BOM常见的属性和方法。 1.窗口的打开(open())和关闭(close()): 这两个方法有兼容性的问题,在不同的浏览器下表现不同 例一:<!DOCTYPE HTML><html><head><meta http-equiv="Conte原创 2015-05-05 12:52:01 · 863 阅读 · 0 评论 -
在线图片裁剪,关于使用cropperjs踩过的坑
最近在做一个项目,其中包括了一个图片在线裁剪功能,于是找到了cropperjs,cropperjs的裁剪功能丰富,满足了各种需求,预览链接:cropperjs预览裁剪图片的两种思路: 1.在前端裁剪,通过html5的HTMLCanvasElement.toBlob方法,把裁剪后的图片通过表单方式用ajax提交给后台,或者使用HTMLCanvasElement.toDataURL 把图片转换为bas原创 2017-06-01 15:20:11 · 44821 阅读 · 24 评论