博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
jquery改变元素属性值(转)
阅读量:5366 次
发布时间:2019-06-15

本文共 2006 字,大约阅读时间需要 6 分钟。

//标签的属性称作元素属性,在JS里对应的DOM对象的对应属性叫DOM属性。JS里的DOM属性名有时和原元素属性名不同。
 
//==================================操作元素属性==================================
 
//返回元素指定属性值
var txt1_val=$("#txt1").attr("value");
 
//通过元素的DOM属性名更改DOM属性值
$("#txt1").attr({ value : "txt1_value" , className : "txt1_class" });
 
//通过指定元素属性改变元素属性值
$("#txt1").attr("class","txt1_class2");
 
//给指定元素属性赋值,通过后面捆绑的方法返回值
$("#txt1").attr("class",function(){
    return "txt1_class3";
})
 
//移除指定的元素属性
$("#txt1").removeAttr("class");
 
//==================================修改CSS类==================================
 
//给CSS类即class元素属性添加一个属性值,可以添加多个之间用空格分开以下的对CSS类操作函数同样可以填入多个CSS类
$("#txt1").addClass("txt1_class txt1_class2");
 
//判断是否已有该CSS类,返回真假
$("#txt1").hasClass("txt1_class txt1_class2");
 
//移除指定CSS类,用空格分开,如无指定则删除该元素所有CSS类
$("#txt1").removeClass("txt1_class");
 
//判断是否有这个CSS类,有就删除,没有就添加
$("#txt1").toggleClass("txt1_class");
 
//根据后面的返回真则添加此CSS类,假则删除此CSS类
$("#txt1").toggleClass("txt1_class",false);
 
//==================================修改CSS属性==================================
 
//返回指定CSS样式值
$("#txt1").css("color");
 
//一次赋多个样式
$("#txt1").css({color:"#ff0011",background:"blue"});
 
//一次赋一个指定的样式
$("#txt1").css("color","black");
 
//==================================宽和高相关==================================
 
//设置元素的高度,无值则返回该元素的高度单位像素
$("#txt1").height(25);
 
//设置元素的宽度,无值则返回该元素的宽度
$("#txt1").width(150);
 
//获取元素的内部高度,不包括边框
$("#txt1").innerHeight();
 
//获取元素内部宽度,不包括变宽
$("#txt1").innerWidth();
 
//获取元素外部高度,包括边框
$("#txt1").outerHeight();
 
//获取元素外部宽度,包括边框
$("#txt1").outerWidth();
 
//==================================位置相关==================================
 
//获取元素相对窗口的偏移位置,返回两个值,一个top值,一个left值
var txt1_offset=$("#txt1").offset();
var top=txt1_offset.top;
var left=txt1_offset.left;
 
//返回相对父元素的相对偏移位置,返回两个值一个top,一个left
var txt1_position=$("#txt1").position();
var top=txt1_position.top;
var left=txt1_position.left;
 
//针对的元素具有垂直滚动条,设置从总体内容向下的第20行像素开始,显示在滚动条可视窗口内上方顶端

//如无参数,则返回当前滚动条可视窗口左端顶点位置,距离整体内容左端顶点的距离

$("#div_outer").scrollLeft(20);

转载于:https://www.cnblogs.com/huojing/articles/3840211.html

你可能感兴趣的文章
Python环境搭建(安装、验证与卸载)
查看>>
一个.NET通用JSON解析/构建类的实现(c#)
查看>>
如何辨别一个程序员的水平高低?是靠发量吗?
查看>>
linux的子进程调用exec( )系列函数
查看>>
zju 2744 回文字符 hdu 1544
查看>>
【luogu P2298 Mzc和男家丁的游戏】 题解
查看>>
前端笔记-bom
查看>>
上海淮海中路上苹果旗舰店门口欲砸一台IMAC电脑维权
查看>>
给mysql数据库字段值拼接前缀或后缀。 concat()函数
查看>>
迷宫问题
查看>>
【FZSZ2017暑假提高组Day9】猜数游戏(number)
查看>>
练习10-1 使用递归函数计算1到n之和(10 分
查看>>
Oracle MySQL yaSSL 不明细节缓冲区溢出漏洞2
查看>>
Code Snippet
查看>>
zoj 1232 Adventure of Super Mario
查看>>
组合数学 UVa 11538 Chess Queen
查看>>
Redis常用命令
查看>>
[转载]电脑小绝技
查看>>
thinkphp如何实现伪静态
查看>>
BZOJ 1925: [Sdoi2010]地精部落( dp )
查看>>