- 博客(23)
- 收藏
- 关注
原创 事件委托
事件委托将子元素的事件通过冒泡的形式交由父元素来执行<ul id="parentUl"><li>1</li><li>2</li><li>3</li><li>4</li><li>5</li></ul>JavaScri...
2019-12-24 15:39:36 118
原创 03Jquery 中 offset() 方法
一、语法 1、 返回偏移坐标 $(selector).offset(); top:$(selector).offset().top; left:$(selector).offset().left; 2、设置偏移坐标: $(selector).offset({top:value,left:v...
2019-12-24 15:38:39 221
原创 02jquery获取各种鼠标位置
jquery获取各种鼠标位置获取当前鼠标相对img元素的坐标$('img').mousemove(function(e) {var positionX=e.pageX-$(this).offset().left; //获取当前鼠标相对img的X坐标var positionY=e.pageY-$(this).offset().top; //获取当...
2019-12-24 15:36:58 259
原创 02jQuery事件绑定
jQuery中提供了四种事件监听方式,分别是bind、live、delegate、on,对应的解除监听的函数分别是unbind、die、undelegate、off。在开始看他们之前 一:bind(type,[data],function(eventObject)) bind是使用频率较高的一种,作用就是在选择到的元素上绑定特定事件类型的监听函数,参数的含义...
2019-12-24 15:34:52 148
原创 01JQuery获取元素文档大小、偏移和位置和滚动条位置的方法集合
JQuery获取元素文档大小、偏移和位置和滚动条位置的方法集合//获取浏览器显示区域的高度$(window).height();//获取浏览器显示区域的宽度$(window).width();//获取页面的文档高度$(document.body).height();//获取页面的文档宽度$(document.body).width();...
2019-12-24 15:31:13 111
转载 JavaScript数组方法
常见数组方法join()push()和pop()shift() 和 unshift()sort()reverse()concat()slice()splice()indexOf()和 lastIndexOf() (ES5新增)forEach() (ES5新增)map() (ES5新增)filter() (ES5新增)every() (ES5新增)some() (ES5...
2018-11-12 10:01:50 112
原创 02JavaScript——AJAX、JSON
ajax是指一种在无需重新加载整个网页的情况下,能够更新页面局部内容,是于服务器交换数据并更新部分网页的技术/艺术,是异步的JavaScript和XML,不是新的编程语言,是一种使用现有标准的新方法XMLHttpRequest对象是ajax的核心与基础,所有的主流浏览器均支持,(但是在IE5、6支持ActiveXObject对象)过程 btn.onclick=function...
2018-09-11 20:29:39 166
原创 01JavaScript正则
正则表达式规则表达式(英语:Regular Expression,简写为regex、regexp或RE),它是计算机科学的一个概念,正则表通常被用来检索、替换那些符合某个模式(规则)的文本,常应用于表单上,一种字符串的匹配规则,但它不是字符串,是字符串的匹配模式/规则正则表达式的创建 1、字面量创建:正则由两个/包裹var reg1=/a/; 模式:匹配指定字符串中的"a...
2018-09-11 20:22:22 102
原创 04JavaScript事件——BOM、window对象、navigator对象、screen对象、location对象
BOM:浏览器对象模型,包含多个对象有不同的功能window对象是BOM的顶层对象,其他都是该对象的子对象window对象:浏览器窗口对象,所有的JavaScript全局对象、函数以及变量均会自动成为window的属性和方法(对象成员),可以通过window去访问,默认情况下window可以省略 var a=10; console.log(a); console.log(window...
2018-09-10 21:21:58 276
原创 03JavaScript事件——放大镜、碰撞检测、滚轮事件、本地存储
JS原生放大镜js代码:<script> var img=document.querySelector("img") left.onmouseover=function(){ console.log("移入") mask.style.display="block"; right.style.display="block"; left.onmousemove...
2018-09-10 21:08:41 215
原创 02JavaScript事件——事件流、事件绑定类型、跨浏览器事件处理程序、阻止事件冒泡/默认事件
事件流事件流就是页面中的事件的触发顺序,IE提出了事件冒泡,网景提出了事件捕获事件冒泡:即事件由子元素向祖先元素传播,在所有的浏览器中,几乎所有都支持事件冒泡,事件的触发由最确定的元素向父级逐级传播,一直传到html事件捕获:和冒泡完全相反,由祖先向子元素传播,IE浏览器中不存在事件捕获,事件的触发由html开始向子级逐级传播DOM0级事件处理程序,默认都支持事件冒泡例:...
2018-09-10 20:33:11 173
原创 01JavaScript事件——事件对象、鼠标事件、键盘事件、表单事件
事件对象event事件对象:包含着所有的与事件有关的操作,所有浏览器都支持event对象,event对象会转入DOM0级、DOM2级、HTML指定定事件内置对象,可在事件处理函数内直接使用,event,在事件处理程序中有效,事件执行完成自动销毁兼容问题:在所有支持DOM2级事件处理程序的浏览器中,event是内置对象,可以直接拿来使用,IE8及其以前的版本不兼容DOM2级,event并不是...
2018-09-10 20:22:03 253
原创 03JavaScript动画DOM——滚动偏移、瀑布流、Image对象、图片预加载、懒加载、获取计算后样式
浏览器页面获取滚动偏移兼容写法:注意顺序不能乱var scroll=document.body.scrollTop||window.pageYOffset||document.documentElement.scrollTop测试各个浏览器滚动偏移属性window.onscroll=function(){ // 对各个浏览器获取页面滚动偏移的兼容测试 console.log...
2018-09-10 20:10:40 316
原创 02JavaScript动画DOM——获取节点、动态创建、添加、修改、删除、克隆元素
DOM对象文档对象模型(Document Object Model,简称DOM),是W3C组织推荐的处理可扩展标志语言的标准编程接口。HTML DOM 定义了所有HTML 元素的对象和属性,以及访问它们的方法,也就是说HTML DOM 是一套标准规则:关于如何获取、修改、添加或删除HTML 元的,Document 对象使我们可以从脚本中对 HTML 页面中的所有元素进行访问,DOM独立于具...
2018-09-07 20:39:30 456
原创 01JavaScript动画DOM——js轮播图、动画、tween库、swipe库、offsetTop/Left/Width/Height、clientWidth/clientHeight
JS动画本质上就是通过JS的方式让元素的属性发生连续变化的过程JS动画核心: 1、获取元素属性,改变后重新赋值 2、改变过程是连续的->setInterval() 注:通过element.style.attr只能获取行间样式的值,并且得到的是一个字符串,通过层叠样式表设置的样式,用这样的方法只能得到"" 即空字符串。通过JS为元素设置样式,只有唯一的一种方式,就...
2018-09-07 19:59:02 215
原创 JavaScript获取元素与绑定事件onclick事件
获取元素的方法: 1、window.document.getElementById(id字符串)通过id名称获取,window可以不写,只能得到页面中带有指定ID的第一个元素2、document.getElementsByClassName(class名)通过class名称获取指定元素,获得的是一个元素集合并非一个元素,因此不能直接操作,需要将元素重集合中取出来在操作,取元素需要索...
2018-09-06 21:09:49 4759
原创 06JavaScript基础——data对象、闭包、类型转换
Data对象JS提供了Date对象,我们可以通过它得到当前设备的系统时间创建时间对象var date=new Date();console.log(date);// 通过date获取确切的时间 1、获得四位数的年份,number var year=date.getFullYear(); console.log(year); // 2、获得月份,得到的月份会比...
2018-09-06 20:48:10 151
原创 05JavaScript基础——函数、作用域、计时器
函数一对可以重复的代码块,但是代码块不会自动执行, 需要触发机制,比如事件触发或人为调用语法: function 函数名(参数名){ 函数体,是真正可以重复执行的代码部分 return 返回值; }function系统关键字,用来声明函数,功能类似于var函数名;类似于变量名,需要符合变量命名规则,可有可无...
2018-09-06 20:33:34 151
原创 04JavaScript基础——字符串、字符串常用方法
字符串的创建属性:length表示字符串包含字符的数量,又叫字符串长度,得到的是一个number1、字面量创建var str1="hello world";2、通过构造函数创建var str2=new String("hello world");字符串常用方法1、charAt():需要一个number作为参数,能得到指定字符串中number下标位置上的字符2、i...
2018-09-06 20:12:39 308
原创 03JavaScript基础——数组、二维数组、数组方法
数组:可以理解为一个大容器,像变量一样可以存储值或其他变量的值,数组的数据类型是Object, 但是数组可以存储多个值或变量,并且他们在数组中是有顺序的。 数组所存储的值或变量称为数组的元素.元素与元素之间需要用”,“号隔开数组属性:length,返回数组当前数组的长度,也就是数组中有多少个元素数组的创建:1、通过系统的构造函数Array()来创建数组对象var arr =n...
2018-09-06 19:48:55 165
原创 02JavaScript基础——分支/循环结构、循环控制语句
一、分支结构if语句:if(条件) { 条件语句;//如果条件成立就执行大括号内的代码,否则跳过大括号,继续向下执行 } 条件可以是具体的值、变量、关系表达式、逻辑表达式 if(条件){ 如果条件成立就执行if大括号内的代码 }else{ ...
2018-09-06 19:22:26 198
原创 01JavaScript基础——引入/输出方式、变量、数据类型、运算符
一、js代码常见的的引入方式、输出方式、JS注释:引入方式:1、 内部引入:将js代码通过script标签引入HTML文档内部,引入位置:理论上来说可以出现在文档的任意位置,甚至出现于HTML标签外部,但是通常来说,一般写在head标签或body标签内,以及body标签下边,当写在head标签里面时,注意将JS代码放在window.onload()中,也即当页面加载完成时,在执行JS代码...
2018-09-04 20:54:05 223
原创 HTML标签结构
1、单标签:由一个标签组成。例如<a> A不能放内容 B多是功能性标签2、双标签:由“开始标签”和“结束标签”两部分构成。例如<p></p> A可以放内容 B超文本、其他标签 C多是一些结构性标HTML常用术语Hyper Text ...
2018-06-27 20:25:14 461
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人