jQuery的属性,事件及操作】的更多相关文章

1.属性操作 1.1 基本属性操作 $("img").attr("src") 返回文档中所有图像的src属性值 $("img").attr("src","test.jpg") 设置文档中所有图像的src属性值 $("img").removeAttr("src") 将文档中图像的src属性删除 $("input[type='checkbox']").…
1.jQuery简介 为了简化JavaScript 的开发, 一些JavsScript 库诞生了. JavaScript库封装了很多预定义的对象和实用函数.能帮助使用者建立有高难度交互的页面, 并且兼容各大浏览器 当前流行的JavaScript 库有 jQuery是继prototype之后又一个优秀的Javascript框架.其宗旨是--WRITE LESS,DO MORE.优势如下: 轻量级(压缩后只有几十k) 强大的选择器 出色的DOM 操作的封装 可靠的事件处理机制 完善的Ajax 出色的…
jQuery jQuery介绍 1.jQuery是一个轻量级的.兼容多浏览器的JavaScript库. 2.jQuery使用户能够更方便地处理HTML Document.Events.实现动画效果.方便地进行Ajax交互,能够极大地简化JavaScript编程.它的宗旨就是:“Write less, do more.“ jQuery的优势 一款轻量级的JS框架.jQuery核心js文件才几十kb,不会影响页面加载速度. 丰富的DOM选择器,jQuery的选择器用起来很方便,比如要找到某个DOM对…
jQuery 效果函数 方法 描述 animate() 对被选元素应用“自定义”的动画 clearQueue() 对被选元素移除所有排队的函数(仍未运行的) delay() 对被选元素的所有排队函数(仍未运行)设置延迟 dequeue() 运行被选元素的下一个排队函数 fadeIn() 逐渐改变被选元素的不透明度,从隐藏到可见 fadeOut() 逐渐改变被选元素的不透明度,从可见到隐藏 fadeTo() 把被选元素逐渐改变至给定的不透明度 hide() 隐藏被选的元素 queue() 显示被选…
jQuery 的属性操作        html() 它可以设置和获取起始标签和结束标签中的内容. 跟 dom 属性 innerHTML 一样.        text() 它可以设置和获取起始标签和结束标签中的文本. 跟 dom 属性 innerText 一样.        val() 它可以设置和获取表单项的 value 属性值. 跟 dom 属性 value 一样 这三个方法,空参表示获取,带参表示修改或者设置. 通过获取多个JQuery对象,分别对他们得值进行修改 attr()   …
事件是用户操作时页面或页面加载时引发的用来完成javascript和HTML之间的交互操作.常见的元素点击事件.鼠标事件.键盘输入事件等,较传Javascript 相比JQuery增加并扩展了基本的事件处理机制,极大的增强了事件处理的能力. 一.DOM加载事件 页面加载完毕后浏览器会通过javascript为Dom元素加载事件,使用Javascript时候使用的是window.onload方法,而Jquery使用的是$(document).ready()方法,下表 展示两个事件的异同.    w…
一.监听事件大全 1.1 JavaScript事件 onblur 元素失去焦点 onchange 用户改变域的内容 onclick 鼠标点击某个对象 ondblclick 鼠标双击某个对象 onfocus 元素获得焦点 onkeydown 某个键盘的键被按下 onkeypress 某个键盘的键被按下或按住 onkeyup 某个键盘的键被松开 onload 某个页面或图像被完成加载 onmousedown 某个鼠标按键被按下 onmousemove 鼠标被移动 onmouseout 鼠标从某元素移…
JQuery是一个JavaScript代码库,或者是JavaScript框架: 1.选择器:(和CSS选择器一致) 基本选择器:ID选择器$('#div1');Class选择器('.div1');标签选择器('img'); 并列选择器('用逗号隔开');后代选择器('用空格隔开'); 2.过滤选择器: first:$('.div1:first').click(function(){}); last:$('.div1:last').click(function(){}); eq(索引号):$('.…
昨日内容回顾 jQuery 宗旨:write less do more 就是js的库,它是javascript的基础上封装的一个框架 在前端中,一个js文件就是一个模块 一.用法: 1.引入包 2.入口函数 $(fn(){}); 3.事件处理 处理dom(文档中的所有的元素) 二.筛选选择器(重点) 三.动画 $('div').show(3000)/hide()/toggle() slideDown/slideUp/slideToggle() fadeOut()隐藏/fadeIn()/fadeT…
JQuery的CSS_DOM与样式操作 样式: 获取 class 和设置 class : class 是元素的一个属性, 所以获取 class 和设置 class 都可以使用 attr() 方法来完成. 追加样式: addClass() 移除样式: removeClass() --- 从匹配的元素中删除全部或指定的 class 切换样式: toggleClass() --- 控制样式上的重复切换.如果类名存在则删除它, 如果类名不存在则添加它. 判断是否含有某个样式: hasClass() --…
主要内容: 1.jQuery属性操作 2.jQuery文档操作 一.jQuery属性操作 1.什么是jQuery的属性操作? jQuery的属性操作模块包括四个部分:html属性操作,dom属性操作,类样式操作和值操作. (1)html 属性操作 对html文档中的属性进行读取,设置和移除操作.例如:attr(),removeAttr(). (2) DOM属性操作 对DOM元素的属性进行读取,设置和移除操作.例如:prop(),removeProp(). (3) 类样式操作 对DOM属性clas…
一.jquery的属性操作 jquery对象有它自己的属性和方法. 其中jquery的属性操作模块分为四个部分:html属性操作,dom属性操作,类样式操作和值操作. 1.html属性操作 是对html文档中的属性进行读取.设置和移除操作.比如attr(),removeAttr(). (1)attr:设置属性值或者返回被选元素的属性值 $('button').click(function () { // jquery的属性操作,html属性操作:attr() // attr如果有一个参数,表示获…
jQuery学习笔记之DOM操作.事件绑定(2) --------------------学习目录------------------------ 4.DOM操作 5.事件绑定 源码地址: https://github.com/iyun/jQueryDemo.git --------------------学习目录------------------------ 4.DOM操作(节点增删改查) 节点查找:节点分为三种类型:元素节点.属性节点.文本节点 创建节点 创建元素节点 使用 jQuery…
JavaScript创建新节点和操作属性 通过JavaScript原生接口创建节点,在处理上是非常复杂与繁琐的. <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>练习</title> <!-- 用到的知识点: 01...创建元素document.createElement 02...设置属性addA…
前文提到JQuery提供了丰富的内置方法来操作对象集,本文主要介绍JQuery中的那些内置操作属性和DOM结构的方法. prop还是attr? 从JQuery1.6版开始,新增了prop方法来获取和设置JQuery对象的属性,这里的prop方法和attr方法究竟有什么区别呢? 要弄懂这个问题,我们首先要区别property和attribute两个概念.property主要是针对DOM对象的,而attribute主要是针对HTML标签的.这样对prop和attr这两个方法来说,它们的区别主要在如下…
jQuery之属性操作 相信属性这个词对大家都不陌生.今天我就给大家简单地介绍一下JQuery一些属性的操作 属性一共分三大类 一.基本属性 1.attr 2.removeAttr 3.prop 4.removeprop html代码 <div id="box1">菜单</div> <div id="box2" class="hezi">123</div> <input type="…
04-jQuery的属性操作   jquery的属性操作模块分为四个部分:html属性操作,dom属性操作,类样式操作和值操作 html属性操作:是对html文档中的属性进行读取,设置和移除操作.比如attr().removeAttr() DOM属性操作:对DOM元素的属性进行读取,设置和移除操作.比如prop().removeProp() 类样式操作:是指对DOM属性className进行添加,移除操作.比如addClass().removeClass().toggleClass() 值操作:…
jQuery,高级事件,模拟操作,命名空间,事件委托,on.off 和 one 学习要点: 1.模拟操作 2.命名空间 3.事件委托 4.on.off 和 one jQuery 不但封装了大量常用的事件处理,还提供了不少高级事件方便开发者使用.比 如模拟用户触发事件.事件委托事件.和统一整合的 on 和 off,以及仅执行一次的 one 方 法.这些方法大大降低了开发者难度,提升了开发者的开发体验. 一.模拟操作 在事件触发的时候,有时我们需要一些模拟用户行为的操作.例如:当网页加载完毕后 自行…
jquery的属性操作模块分为四个部分:html属性操作,dom属性操作,类样式操作和值操作 html属性操作:是对html文档中的属性进行读取,设置和移除操作.比如attr().removeAttr() DOM属性操作:对DOM元素的属性进行读取,设置和移除操作.比如prop().removeProp() 类样式操作:是指对DOM属性className进行添加,移除操作.比如addClass().removeClass().toggleClass() 值操作:是对DOM属性value进行读取和…
一.属性操作   1..attr()与.removeAttr() 每个元素都有一个或者多个特性,这些特性的用途就是给出相应元素或者其内容的附加信息.如:在img元素中,src就是元素的特性,用来标记图片的地址. 操作特性的DOM方法主要有3个,getAttribute方法. setAttribute方法和removeAttribute方法,就算如此在实际操作中还是会存在很多问题,这里先不说.而在jQuery中用一个 attr()与removeAttr()就可以全部搞定了,包括兼容问题 jQuer…
一. input标签的accept属性 当我们上传文件或者注册上传头像时,我们可以一般都是使用: <input type="file" id="my_file"> 但是这样的话,所有文件都会显示出来,这里以上传头像为例,一点击选择文件,所有跟图片无关的文件也会显示出来: 这时可以给input标签增加一个accept属性,让它只显示图片相关的文件: <input type="file" id="my_file"…
之前用过一些jQuery的动画和特效,但是用到的部分也不超过10%的样子,感觉好浪费啊——当然浪费的不是jQuery,而是Web资源.后来就想深入研究下jQuery的内部机理,读过两遍jQuery源代码,但是自觉还差的好远,跟好多大神(比如阮一峰)的理解还是有很大差距.现在就一点一点积累自己的知识体系,记录自己学到的和自己所理解的jQuery. JavaScript和HTML之间的交互式通过用户和浏览器操作页面时引发的事件机制来处理的.当文档或者它的某些元素发生某些变化或操作时,浏览器就会自动生…
众所周知,页面在加载时,会触发load事件:当用户单击某个按钮时,会触发该按钮的click事件. 这些事件就像日常生活中,人们按下开关,灯就亮了(或者灭了),往游戏机里投入游戏币就可以启动游戏一样, 通过种种事件实现各项功能或执行某项操作.事件在元素对象与功能代码中起着重要的桥梁作用. 在jQuery中,事件总体分为两大类:简单事件和复合事件. jQuery中的简单事件,与JavaScript中的事件几乎一样,都含有window事件.鼠标事件.键盘事件.表单事件等, 只是其对应的方法名称有略微不…
在学习Jquery中的过程中我们绝大部分都用到了事件的操作,也可以说事件是Jquery中必不可少的一部分,我们常见的一些事件有单击事件,鼠标事件,键盘事件等等.在Jquery中的学习中为了能使让页面以更绚丽的方式呈现给用户浏览,往往会用到动画.下面我主要就针对事件和动画进行详细的说明. 一.Jquery中的事件 我们说事件总体上可以分为两大类:简单事件和复合事件.这里的简单事件和JavaScript中的事件几乎完全一样,都含有windos的事件,鼠标事件,键盘事件,表单事件等,只是在JavaSc…
1.$(document).ready() $(document).ready()是jQuery中响应JavaScript内置的onload事件并执行任务的一种典型方式.它和onload具有类似的效果.但是也有一些差异: 当一个文档完全下载到浏览器中时,会触发window.onload事件.而使用$(document).ready()注册的事件处理程序会在html下载完成并解析为Dom树之后,代码就可以运行,但并不意味着所有关联文件都已经下载完毕. 一个页面中一般只有一个onload事件处理程序…
第4章 jQuery中的事件和动画 jQuery中的事件 加载DOM $(document).ready(function(){   // 编写代码... }); 可以简写成: $(function(){   // 编写代码... }); $(document).ready()方法的执行时机是在网页中所有DOM结构绘制完毕后就执行,可能此时DOM元素关联的东西(比如图片)并没有加载完. $(document).ready()方法能同时编写多个,每次调用$(document).ready()方法都…
关于jQuery中的事件 js与HTML之间的交互是通过用户和浏览器操作页面时引发的事件来处理的. jQuery增加并扩展了基本的事件处理机制,jQuery不仅提供了更加优雅的事件处理方法,而且极大地增强了事件处理能力. $(document).ready()只需要等文档结构加载完就能执行,而window.onload还要等到文档元素所关联的元素(比如图片)加载完才行. 而因为图片未加载完时ready()事件就执行了,因此图片的长宽属性未必有效,要想解决这个问题可以用$(document).lo…
作为技术狂热分子的职业本能,看到一个技术产品的功能,总会忍不住想知道它是怎么被实现的.比如我每每看到别人网站一个很炫的界面或者很酷的功能,就忍不住打开了浏览器的控制台... 好,不扯远,说说当你想看到网站上某个元素绑定的事件函数的代码时应该怎么做吧. 查看原生绑定的事件函数代码 所谓原生就是通过addEventListener方法绑定到dom元素上.这个好办: 审查绑定事件的元素(对着它右键->审查元素) 在弹出的Elements视图的控制台,右侧点击"Event Listeners&qu…
<select id="selectID" > <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> <option…
jQuery中的事件: 1.加载DOM:注意window.onload和$(document).ready()的不同 2.事件绑定 3.合成事件 --2和3的详细信息见代码- <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <script type="text/javascript" src="../../…