jQuery中的元素操作

jQuery元素操作

通过jQuery可以操作控制元素的样式,文本,属性等

jquery样式操作

css操作行内样式

// 获取div的样式
$("div").css("width");
$("div").css("color");//设置div的样式
$("div").css("width","30px");
$("div").css("height","30px");
$("div").css({fontSize:"30px",color:"red"});

特别注意
选择器获取的多个元素，获取信息获取的是第一个，比如：$(“div”).css(“width”)，获取的是第一个div的width。

类名class操作

操作样式类名

$("#div1").addClass(“divClass2”) //为id为div1的对象追加样式divClass2
$("#div1").removeClass(“divClass”) //移除id为div1的对象的class名为divClass的样式
$("#div1").removeClass(“divClass divClass2”) //移除多个样式
$("#div1").toggleClass(“anotherClass”) //重复切换anotherClass样式

文本操作

1、html() 取出或设置html内容

// 取出html内容var $htm = $('#div1').html();// 设置html内容
$('#div1').html('<span>添加文字</span>');

2、text() 取出或设置text内容

// 取出文本内容var $htm = $('#div1').text();// 设置文本内容$('#div1').text('<span>添加文字</span>');

属性操作

1、attr() 取出或设置某个属性的值

// 取出图片的地址var $src = $('#img1').attr('src');// 设置图片的地址和alt属性$('#img1').attr({ src: "test.jpg", alt: "Test Image" });//也可以用户设置class属性
$('#abc').attr('class','all')//也可以自定义 属性
$('#abc').attr('love','iloveyou')

2、removeattr()删除属性

$('#abc').removeattr('class')$('#abc').removeattr('love')

jQuery中的元素操作相关推荐

jQuery 学习笔记一(认识jQuery jQuery选择器 jQuery中的DOM操作)
第一章认识jQuery jQuery代码风格 $(document).ready(function(){ //... }); 简化 $(function(){ //... }); jQuery对象转 ...
jQuery中HTML的操作
jQuery中HTML的操作创建元素的方式 jQuery中创建元素的方式: 1.$("标签的代码") 2.对象.html("标签的代码"); var aObj ...
网页加载的不同的方式、点击按钮显示一句话、jQuery中获取元素的方法
网页加载的不同的方式 <!DOCTYPE html> <html lang="en"> <head><meta charset=" ...
jQuery 基础教程（四）之jQuery中的DOM操作
一.jQuery 中的 DOM 操作 (1)DOM(Document Object Model-文档对象模型):一种与浏览器, 平台, 语言无关的接口, 使用该接口可以轻松地访问页面中所有的标准组 ...
三、jQuery 中的 DOM 操作（超详细）
文章目录前言一. DOM 介绍二. 查找节点 2.1查找元素节点 2.2查找属性节点三. 创建节点 3.1.创建元素节点 3.2.创建文本节点 3.3.创建属性节点四.插入节点 4.1 DO ...
jQuery库的简单使用:jQuery中的 DOM 操作,增删改查,复制,替换,包裹,属性和样式操作
jQuery中的 DOM 操作查查找属性节点: 通过 jQuery 选择器完成. 操作属性节点: 查找到所需要的元素之后, 可以调用 jQuery 对象的 attr() 方法来获取它的各种属性值 ...
jquery中删除元素的remove（）方法
今天看jquery中删除元素的方法,包括remove()方法和empty() 方法 remove()方法为删除被选元素及子元素 empty() 方法为删除元素中的子元素其中remove()方法还有一 ...
JQuery中Ajax的操作
转载自:http://blog.csdn.net/liujiahan629629/article/details/22229669 Java软件开发中,后台中我们可以通过各种框架,像SSH等进行对代码 ...
jQuery中兄弟元素、子元素和父元素的获取
我们这里主要总结jQuery中对某元素的兄弟元素.子元素和父元素的获取,原声的Javascript代码对这些元素的获取比较麻烦一些,而jQuery正好对这些方法进行封装,让我们更加方便的对这些元素进行 ...