入口函数:ready() 当 DOM(文档对象模型) 已经加载,并且页面(包括图像)已经完全呈现时,会发生 ready 事件. 由于该事件在文档就绪后发生,因此把所有其他的 jQuery 事件和函数置于该事件中是非常好的做法.正如上面的例子中那样. ready() 函数规定当 ready 事件发生时执行的代码. ready() 函数仅能用于当前文档,因此无需选择器. 允许使用以下三种语法: 语法 1 $(document).ready(function) 语法 2 $().ready(funct…
1.样式属性操作     1)设置样式属性操作         ①设置单个样式: // 第一个参数表示:样式属性名称 // 第二个参数表示:样式属性值 $(selector).css(“color”, “red”); ②设置多个样式(也可以设置单个) // 参数为 {}(对象) $(selector).css({“color”: “red”, “font-size”: “30px”}); 2)获取样式属性操作 // 参数表示要获取的 样式属性名称 $(selector).css(“font-si…
今天是小年了,2013马上要过去了,但是学习不能间断啊.最近正在看<jQuery权威指南>,先温习一下选择器和DOM操作. 一.基本选择器 1.table单双行: $(function () { $( "#tbStu tr:nth-child(even)" ).addClass("trOdd"); }) 2.jQuery完善的检测机制: 传统js处理对象时要首先判断是否存在:jQuery具有较完善的检测机制不需要判断,即使该元素不存在,也不会出现错误提示…
jQuery学习笔记之DOM操作.事件绑定(2) --------------------学习目录------------------------ 4.DOM操作 5.事件绑定 源码地址: https://github.com/iyun/jQueryDemo.git --------------------学习目录------------------------ 4.DOM操作(节点增删改查) 节点查找:节点分为三种类型:元素节点.属性节点.文本节点 创建节点 创建元素节点 使用 jQuery…
这个文章经历的时间比较长,不是因为jQuery比较难,而是东西比较多,真心是个体力活.所以本来想把jQuery做成一篇去写,但由于写的时候发现jQuery发现写成一篇的话过于长,对于阅读起来也不是一个好事,所以拆成两篇,这篇文章只说说选择器,筛选器和dom的操作,有基础的人可以把这个一篇略去不看,或者直接去看官方的API.因为这个实在没有什么可以发挥和有心得的地方,就是简单的api的使用,有点枯燥,所以说,如果真心觉得底子不够的人,还是要静下心去阅读,毕竟这是一个开始.下篇会说到一些“高级”的知…
jQuery基础之事件方法,如下图: 代码实现: <script src="JS/jquery-1.12.4.min.js"></script> <script> $(function(){ var $btn = $('#btn1'); // 鼠标点击事件 $btn.click(function(){ alert('使用JS实现鼠标单击事件!'); }); // 元素获取焦点事件 var $txt = $('#txt1'); $txt.focus(f…
一.jQuery简介 jQuery 是一个 JavaScript 库.(其实就是js,就是封装了,语法上有些不一样) jQuery 极大地简化了 JavaScript 编程. jQuery 库位于一个 JavaScript 文件中,其中包含了所有的 jQuery 函数. $:jQuery标识符 二.jQuery选择器 1.基本选择器(写法上就跟css一样) *①ID选择器:# $("#div1").css("background-color", "red&…
第1章 认识jQuery jQuery有以下优势: 轻量级: 强大的选择器: 出色的DOM操作的封装: 可靠的事件处理机制: 完善的Ajax: 不污染顶级变量: 出色的浏览器兼容性: 链式操作方式: 隐式迭代: 行为层与结构层的分离: 丰富的插件支持: 完善的文档: 开源. jQuery对象就是通过jQuery包装DOM对象后产生的对象. 在jQuery对象中无法使用DOM对象的任何方法.同样,DOM对象也不能使用jQuery里的方法. jQuery对象和DOM对象的相互转换        如果…
居然是12年的总结.... 文章地址: http://www.cnblogs.com/happyPawpaw/articles/2595092.html JQuery选择器 1.基本选择器 基本选择器是JQuery中最常用的选择器,也是最简单的选择器,它通过元素id.class 和标签名来查找DOM元素.这个非常重要,下面的内容都是以此为基础,逐级提高的. 1).“$(“#id”)”,获取id指定的元素,id是全局唯一的,所以它只有一个成员. 2).“$(“.class”)”,获取class指定…
常规事件: 把JS的事件  on去掉即可 例如:js    document.getElementById("id").onclinck=function(){} Jquery  $("#id").click(function(){  事件发生的事}); 复合事件 hover(function(){}   ,   function(){})     移入移出事件 toggle(function(){} , function(){}  ....)可以有无数个funct…
事件是用户操作时页面或页面加载时引发的用来完成javascript和HTML之间的交互操作.常见的元素点击事件.鼠标事件.键盘输入事件等,较传Javascript 相比JQuery增加并扩展了基本的事件处理机制,极大的增强了事件处理的能力. 一.DOM加载事件 页面加载完毕后浏览器会通过javascript为Dom元素加载事件,使用Javascript时候使用的是window.onload方法,而Jquery使用的是$(document).ready()方法,下表 展示两个事件的异同.    w…
一.使用JS的痛处 在学习和使用js的过程中发现了js的一些痛处: 1.书写繁琐,代码量大. 2.代码复杂. 3.动画效果很难实现.使用定时器,要小心各种定时器的清除.各种操作和处理事件不好实现. 4.浏览器的兼容性. 同样是实现点击按钮后,展示三个div栏,并在div栏显示内容: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <ti…
一.DOM节点的创建 1.创建节点及节点属性 通过JavaScript可以很方便的获取DOM节点,从而进行一系列的DOM操作.但实际上一般开发者都习惯性的先定义好HTML结构,但这样就非常不灵活了. 试想下这样的情况:如果我们通过AJAX获取到数据之后然后才能确定结构的话,这种情况就需要动态的处理节点了 本文向大家介绍一下如何使用JavaScript创建div节点元素,主要包括创建div节点元素的属性和创建div节点元素的样式两大部分内容,相信本文介绍一定会让你有所收获. 先介绍下需要用到的浏览…
day56 参考:https://www.cnblogs.com/liwenzhou/p/8178806.html#autoid-1-9-6 事件 *****         1. 目前为止学过的绑定事件的方式             1. 在标签里面写 onclick=foo(this);             2. 原生DOM的JS绑定      DOM对象.onclick=function(){...}             3. jQuery版的绑定事件   jQuery对象.cli…
JQuery语法 1.JQuery("选择器").action; 通过选择器调用时间函数 但Jquery可以用$符号代替,即$("选择器").action; ①选择器可以直接使用css选择器,选中元素 ②.action表示直接对元素执行的操作:2.文档就绪函数:防止文档在完全加载之前运行Jquery代码 $(document).ready(function(){ JQuery代码 }); 文档就绪函数简写方式 $(function(){ }); 3.[文档就绪函数&…
jQuery鼠标事件之click与dbclick事件 用交互操作中,最简单直接的操作就是点击操作.jQuery提供了两个方法一个是click方法用于监听用户单击操作,另一个方法是dbclick方法用于监听用户双击操作.这两个方法的用法是类似的,下面以click()事件为例 使用上非常简单: 方法一:$ele.click() 绑定$ele元素,不带任何参数一般是用来指定触发一个事件,用的比较少 <div id="test">点击触发<div> $("el…
---恢复内容开始---   jQuery中的DOM操作 [DOM操作分类] DOM操作分为DOM Core(核心).HTML-DOM和CSS-DOM三个方面. DOM Core:任何一种支持DOM的程序设计语言都可以使用它.它不仅可以用于处理网页,也可以处理任何一种使用标记语言编写出来的文档. HTML-DOM:它提供了一些更简明的记号来描述各种HTML元素的属性.不过它只能用来处理web文档. CSS-DOM:是针对CSS的操作,其主要作用是获取设置style对象的各种属性.通过改变styl…
DOM操作的分类 一般来说,DOM操作分为3个方面,即DOM Core.HTML-DOM和CSS-DOM. 1. DOM Core DOM Core并不专属于JavaScript,任何一种支持DOM的程序设计语言都可以使用它.它的用途并非仅限于处理网页,也可以处理任何一种使用标记语言编写出来的文档,例如XML. JavaScript中的getElementById().getElementsByTagName().getAttribute()和setAttribute()等方法,这些都是DOM…
一:样式操作 addClass();// 添加指定的CSS类名. removeClass();// 移除指定的CSS类名. hasClass();// 判断样式存不存在 toggleClass();// 切换CSS类名,如果有就移除,如果没有就添加. 示例:开关灯和模态框 CSS css("color","red")//DOM操作:tag.style.color="red" 示例: $("p").css("color…
一:JQuery知识点 *:JQuery的dom操作 *:获取节点.给节点添加内容 *:动态创建dom节点 比如动态创建表格等,在js里面进行完成. *删除节点 这里面的删除就是将其放在了一个地方,并不是真的删除,之后可以使用. *:document方法 1:.val()可以获取到文本框里面的值,若括号里面有值则直接为赋值. Eg:加法计算器 <!DOCTYPE html> <html lang="en" xmlns="http://www.w3.org/1…
1. 事件绑定$(el).bind ie使用attachEvent,其它浏览器使用addEventListener,不同的是ie多了个on前缀,this绑定在window上,需要用call和apply修正this 的指向. if (element.addEventListener) {         element.addEventListener(type, handler, useCapture);     } else {         if (element.attachEvent)…
进一步选择元素相关方法:  .get() .eq() .find() .filter() .not() .is() .has() .add()集中操作  .end()回退操作 .get() $(".class").get()   可以填 $()选择器选出来的dom 索引,  0  1  2  3   -1  -2 ,   不填  取全部dom, 但是 取出来的dom 不再是jquery的对象,而是原生dom, 用get()取出来的 dom  都为原生dom: 现在会用了,但是咱们不能单…
选择器: 1. 基本选择器 1. 标签选择器(元素选择器) * 语法: $("html标签名") 获得所有匹配标签名称的元素 2. id选择器 * 语法: $("#id的属性值") 获得与指定id属性值匹配的元素 3. 类选择器 * 语法: $(".class的属性值") 获得与指定的class属性值匹配的元素 4. 并集选择器: * 语法: $("选择器1,选择器2....") 获取多个选择器选中的所有元素 2. 层级选择器…
DOm 操作之: 1.1  children(),这个函数只是查找元素的子元素,而不考虑其他后代元素 <body> <p title="请选择你最喜欢的水果">你最喜欢的水果是设么</p> <ul> <li title="苹果" class="shuoguo1">苹果</li> <li title="梨子" class="huanying2…
<body> <h3>例子</h3> <p title="选择你最喜欢的水果." >你最喜欢的水果是?</p> <ul> <li id="apple">苹果</li> <li>橘子</li> <li>菠萝</li> </ul> </body> 可以通过JavaScript中的getElementsBy…
主要内容: 1.指针事件 2.操作事件 1.指针事件 指针事件由各种活动输入源引发,包括触摸.触摸板.笔和鼠标(它们替代传统的鼠标事件).指针事件基于单一输入点(手指.笔尖.鼠标光标),但不支持基于速度的交互.下面是指针事件列表及其相关的事件参数列表: 事件或类 描述 PointerPressed 单根手指触摸屏幕时发生. PointerReleased 该同一触摸接触抬起时发生. PointerMoved 在屏幕上拖动指针时发生. PointerEntered 在指针进入元素的点击测试区时发生…
HTML标签: 一.通用标签(一般标签) 1.格式控制标签 <font color="#6699aa" face="楷体" size="24">文字</font><b>加粗</b><i>倾斜</i><u>下划线</u><br/>换行 ** 空格 **<center>居中</center> * 2.内容标签 <h…
1.children()方法 jQuery是一个合集对象,如果想快速查找合集里面的第一级子元素,此时可以用children()方法.这里需要注意:.children(selector) 方法是返回匹配元素集合中每个元素的所有子元素(仅儿子辈,这里可以理解为就是父亲-儿子的关系) 理解节点查找关系: <div class="div"> <ul class="son"> <li class="grandson">1…
一.获取DOM节点 //找祖宗 parent() parents() closest() //找后代 children(); find(); //找兄弟 next()/nextAll() prev()/prevAll() siblings() 二.元素节点操作 $(html) //创建DOM append()/appendTo() //内部追加 prepend()/prependTo() //内部前置 after()/insertAfter() //后面插入 before()/insertBef…
插入: insertBofore() before() insertAfter() after() appendTo() append() prependTo() prepen() 删除: remove() detach() //css <style type="text/css"> .wrapper{ border: 1px solid black; width: 200px; padding: 10px; } .wrapper div{ width: 200px; he…