jquery接触初级-----juqery DOM操作之二

DOm 操作之: 1.1 children(),这个函数只是查找元素的子元素,而不考虑其他后代元素 <body> <p title="请选择你最喜欢的水果">你最喜欢的水果是设么</p> <ul> <li title="苹果" class="shuoguo1">苹果</li> <li title="梨子" class="huanying2…

1. DOM 分为三个部分:DOM core ,HTML_DOM,CSS_DOM: 1.1.document.getElementById(),document.getElementsByTagName,getAttribute(),setAttribute() 这些方法属于DOM core 1.2. docuement.froms // HTML_DOM获取一个表单对象 element.src //HTML_DOM获取元素的src属性类似这样的属于HTML_DOM…

jquery接触初级-----juqery DOM操作实例，动态图片显示

1. 要求:对一个a标签元素,当鼠标操作,移入时,显示a标签title属性的信息,鼠标移出时,隐藏a标签属性的title属性信息 a 标签本身的title 属性具有自我显示的特性,但是这个特性比较慢,如下: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content=&…

jquery接触初级-----juqery 动画函数

1. window.onload(), 一次只能保存对一个函数的引用:如果多次调用,他会自动用后面的函数覆盖前面的函数 2.$(document).ready(); 会在现有行为上追加新的行为,这些函数行为会按照注册的顺序进行依次执行,避免了window.onload()的覆盖行为: $(document).ready() 有三种写法: 2.1 $(document).ready(function(){}); 2.2 $(function(){}); 2.3 $().ready(functi…

jquery接触初级-----juqery选择器实例

jquery 选择器用于触发事件,可以少写很多js代码,一般来说,基本的特效功能都能够完成这里列举一个简单的jquery写的例子: 要求:有两种情况: 1.产品最初状态显示简约形式的品牌,即显示部分品牌 2.点击按钮后,网页变成显示全部品牌,并且按钮也随着改变 3.对一些列举出的品牌显示成高亮的色彩 4.再次点击按钮,产品品牌变成最初的状态在这里,将会用到jquery的选择器,和juery方法 html代码: <!DOCTYPE html> <html lang="en&q…

jQuery学习笔记之DOM操作、事件绑定（2）

jQuery学习笔记之DOM操作.事件绑定(2) --------------------学习目录------------------------ 4.DOM操作 5.事件绑定源码地址: https://github.com/iyun/jQueryDemo.git --------------------学习目录------------------------ 4.DOM操作(节点增删改查) 节点查找:节点分为三种类型:元素节点.属性节点.文本节点创建节点创建元素节点使用 jQuery…

jquery接触初级----jquery 对象和Dom对象

1. DOM 对象,每一份DOm对象(Document Object model)都可以表示成一棵树,一个基本的网页如下: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0…

jQuery基础修炼圣典—DOM篇（二）jQuery遍历

1.children()方法 jQuery是一个合集对象,如果想快速查找合集里面的第一级子元素,此时可以用children()方法.这里需要注意:.children(selector) 方法是返回匹配元素集合中每个元素的所有子元素(仅儿子辈,这里可以理解为就是父亲-儿子的关系) 理解节点查找关系: <div class="div"> <ul class="son"> <li class="grandson">1…

jQuery（3）——DOM操作

---恢复内容开始--- jQuery中的DOM操作 [DOM操作分类] DOM操作分为DOM Core(核心).HTML-DOM和CSS-DOM三个方面. DOM Core:任何一种支持DOM的程序设计语言都可以使用它.它不仅可以用于处理网页,也可以处理任何一种使用标记语言编写出来的文档. HTML-DOM:它提供了一些更简明的记号来描述各种HTML元素的属性.不过它只能用来处理web文档. CSS-DOM:是针对CSS的操作,其主要作用是获取设置style对象的各种属性.通过改变styl…

jQuery学习笔记（DOM操作）

DOM操作的分类一般来说,DOM操作分为3个方面,即DOM Core.HTML-DOM和CSS-DOM. 1. DOM Core DOM Core并不专属于JavaScript,任何一种支持DOM的程序设计语言都可以使用它.它的用途并非仅限于处理网页,也可以处理任何一种使用标记语言编写出来的文档,例如XML. JavaScript中的getElementById().getElementsByTagName().getAttribute()和setAttribute()等方法,这些都是DOM…

jQuery总结02_jq的dom操作+属性操作

一:JQuery知识点 *:JQuery的dom操作 *:获取节点.给节点添加内容 *:动态创建dom节点比如动态创建表格等,在js里面进行完成. *删除节点这里面的删除就是将其放在了一个地方,并不是真的删除,之后可以使用. *:document方法 1:.val()可以获取到文本框里面的值,若括号里面有值则直接为赋值. Eg:加法计算器 <!DOCTYPE html> <html lang="en" xmlns="http://www.w3.org/1…

jquery学习：选择器&dom操作

分类; 1.基本选择器 1.标签选择器(元素选择器) * 语法:$("html标签名”) 获得所有匹配标签名称的元素 2.id选择器 * 语法:$("#id的属性值") 获得与指定id属性值匹配的元素 3.类选择器 * 语法:$(".class的属性值") 获得与指定的class属性值匹配的元素 4.并集选择器: * 语法:$("选择器1,选择器2....") 获得多个选择器选中的所有元素 $(function (){ /…

jQuery 第二章实例方法 DOM操作选择元素相关方法

进一步选择元素相关方法: .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: 现在会用了,但是咱们不能单…

jQuery基础知识点（DOM操作）

1.样式属性操作 1)设置样式属性操作 ①设置单个样式: // 第一个参数表示:样式属性名称 // 第二个参数表示:样式属性值 $(selector).css(“color”, “red”); ②设置多个样式(也可以设置单个) // 参数为 {}(对象) $(selector).css({“color”: “red”, “font-size”: “30px”}); 2)获取样式属性操作 // 参数表示要获取的样式属性名称 $(selector).css(“font-si…

jQuery使用(五)：DOM操作之插入和删除元素

插入: 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…

jQuery 第二章实例方法 DOM操作取赋值相关方法

取赋值相关方法: .html() .text() .val() .size() .addClass() .removeClass() .hasClass() .html() html方法干嘛的呢,底层原理是用原生js的 innerHTML 实现的,接下来,来看一下怎么使用它, 有什么区别. 其实基本使用跟innerHTML 差不多,但是正常的jquery 方法来讲,$('ul li').html() 像这样,你选的是ul 下面的全部li,正常来讲,取出的值应该是有多少个li 就取多少个…

JavaScript的DOM操作（二）

一:window.history对象历史记录,通过历史记录可以操作页面前进或者后退 window.history.back();后退 window.history.forward();前进 window.history.go(n); n是正数代表前进n个页面,n是负数代表后退n个页面. 二:window.location对象 location地址栏 var s = window.location.href;获取当前页面的地址 window.location.href="http://www.b…

jquery基础学习之DOM篇（二）

在此之前请牢记,jquery 是一个合集对象!!!! 1.节点创建 js创建方法: 创建元素:document.createElement 设置属性:setAttribute 添加文本:innerHTML 加入文档:appendChild jq创建方法: 前三项可以合并成一个,直接向$()括号中加入要设置的html结构及内容, 然后append()添加到某个容器中 let div=$('jq创建'); $(body).append(div) 2.节点插入方法向元素内部添加 append() 与…

jquery接触初级----jquery 选择器

css 选择器主要有:元素选择器,ID选择器,类选择器,群组选择器,后代选择器,普通配符选择器等,通过css选择,我们可以很方便的给元素添加样式,使网页看起来更加好看 jquery 选择器也有相似的功能,基本上完全继承了css 样式的风格. 差异: CSS选择器:查找元素,添加样式: jquery选择器:查找元素,添加行为: <!DOCTYPE html> <html lang="en"> <head> <meta charset="…

JS DOM操作（二） Window.docunment对象——操作样式

一对元素的定位在 js 中可以利用 id.class.name.标签名进行元素的定位 id.class 用在客户端 name 用在服务端用 id 定位 -- 根据 id 最多只能找一个 var a = document.getElementById( "id 名" ) -- 将找到的变了放到变量 a 中用 class 定位 …

JavaScript之DOM操作（二）

这一篇写写常用并且通用的操作节点的一些方法. 1.节点方法 1>appendChild() 向childNodes列表的末尾添加一个节点,语法 var aChild = element.appendChild(aChild); 需要注意的是,如果被传入的节点在文档中已经存在,那结果会将该节点从原来位置移除,然后再添加到指定位置.例: var returnedNode = someNode.appendChild(someNode.firstChild); console.log(returned…