DOM操作之属性和样式操作】的更多相关文章

在DOM操作,除了前面的节点操作以外,常常被用到的操作还有属性操作和节点操作,下面,主要来总结一下jQuery中的属性操作方法和样式操作方法. 在开始操作前,我们需要先在html中添加如下代码,后面所有的操作都是基于该DOM结构进行的. <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</tit…
回顾 1. jquery基本使用 <script src="jquery.min.js"></script><script> $(function(){       $('li').css().css().attr().find() })</script>​js 原生dom 和 jQuery DOM$(原生DOM) $(this)jQuery的本质是 由 原生dom组成 的类数组 对象 2 选择器 # 基本选择器# 层级选择器# 基本筛选…
jQuery jQuery介绍 1.jQuery是一个轻量级的.兼容多浏览器的JavaScript库. 2.jQuery使用户能够更方便地处理HTML Document.Events.实现动画效果.方便地进行Ajax交互,能够极大地简化JavaScript编程.它的宗旨就是:“Write less, do more.“ jQuery的优势 一款轻量级的JS框架.jQuery核心js文件才几十kb,不会影响页面加载速度. 丰富的DOM选择器,jQuery的选择器用起来很方便,比如要找到某个DOM对…
一.DOM操作分类 DOM Core:任何一种支持DOM的编程语言都可以使用它,例如:getElementById(). HTML-DOM:用于处理HTML文档,例如:document.forms. CSS-DOM:用于操作CSS,例如:element.style.color="green". 二.jQuery中的DOM操作 jQuery对JavaScript中的DOM操作进行了封装,使用起来更加简便. jQuery中的DOM操作可分为如下几种: 样式操作. 内容及value属性值操作…
带有Element和不带的区别 a)  带Element的获取的是元素节点 b)  不带可能获取文本节点和属性节点 获取所以子节点 a)   . childNodes b)   . children c)   . parentNode . children [索引] . children:获取所有子节点 opacity:0-1:透明度 alpha(opacity:百分数):IE6/7/8透明度 先绑定事件再进行循环 previousNode()上一个兄弟节点 alert(变量名)可测试变量名是否…
DOM操作 1.在div1内部最后追加一个节点 $("#div1").append("<img src='../01-HTML基本标签/img/Male.gif'/>"); 2.将一个节点插入到div1的内部最后 $("<img src='../01-HTML基本标签/img/Female.gif'/>").appendTo("#div1") 3.在div1内部前面追加一个节点 $("#div…
DOM取值与赋值 .html() .text() .size() 1.html()方法类似原生DOM的属性innerHTML,不传入参数的时候默认为取指定元素内的HTML内容,包含前后空白文本结构,以字符串类型返回:当被指定执行html()方法的jQuery对象是一组DOM集合时,获取到的内容是集合中的第一个DOM节点的内容.(html代码在文末) console.log($('ul').html()); console.log($('ul li').html()); 2.html('参数')-…
如果说web的研究对象是html和css,那么整个dom结构,包含html树和dom树的dom结构才是研究对象,而在整个页面呈现上面,js起到的作用则是异步的用户行为. 按照上面整个思路,获取dom元素,修改dom相关的样式和属性,就显得无比重要了.博客里面已经有讲过关于dom对象文章:原生js操作Dom节点:CRUD,本文主要讲解dom样式的操作和属性的操作. 操作的含义包含读取和修改. 对于dom的样式操作: 1)通过ele.style获取,例如 <!DOCTYPE html> <h…
1. 对样式进行操作: 1) 以样式(C1,C2等)为最小单位进行修改. className, classList, (以列表形式获得) classList.add("C2"), classList.remove("C1") 2) 以某个样式作为单位进行修改.(可以只修改颜色/字体/背景等,可以只修改C1下面的color属性.)  下面的例子就是增加/修改了style里面的fontSize属性. obj=document.getElementById("i…
jQuery DOM操作 1 插入子元素 append('<img>') 插后面 被插入元素调用 appendTo('<img scr="...">') 新元素调用 prepend() 插前面 prependTo() 2 插入兄弟元素 after() 插后面 被插入元素调用 insertafter() 新元素调用 before() 插前面 insertbefore() 3 包裹 wrap() 所有元素分别添加一个父元素 wrapAll() 添加一个共同的父元素…