
1、jQuery设置css样式
<div style="background-color:#ffffff;padding-left:10px;">测试jQuery动态获取padding-left</div>
2、用css()方法返回元素的样式属性
$("div")css("padding-left"));
3、用css()设置样式
$("div")css("color","yellow");
4、设置多个样式
$("div")css({"background-color":"yellow","font-size":"200%"});
var css = {
background-color: '#EEE',
height: '500px',
margin: '10px',
padding: '2px 5px' };
$("div")css(css);
jquery提供了三个获得内容的方法: text()、html() 以及 val(),其中前两个可用于解决本问题:
$("label#userid")text(); // 首选,获取label的文本
$("label#userid")html(); // 也可以实现,获取label标签内的所有html标记,一般情况改下label标签内就是文本,所以等效上面的方法
下面给出实例演示:分别使用以上两种方法获取label标签的内容,注意最终结果的区别
创建Html元素
<div class="box">
<span>点击按钮获取label中内容:</span><br>
<div class="content">
<label id="userid">输入用户名</label><input type="text">
</div>
<input type="button" value="获取label中的内容">
</div>
设置css样式
divbox{width:300px;padding:20px;margin:20px;border:4px dashed #ccc;}
divbox span{color:#999;font-style:italic;}
divcontent{width:250px;margin:10px 0;padding:20px;border:2px solid #ff6666;}
h3{display:inline-block;}
input[type='button']{height:30px;margin:10px;padding:5px 10px;}
编写jquery代码
$(function(){
$("input:buttonbtn1")click(function() {
alert($("label#userid")text());
});
$("input:buttonbtn2")click(function() {
alert($("label#userid")html());
});
})
观察效果
使用text()方法获取标签内的内容
1、打开html开发工具,新建一个html代码页面。
2、在html页面创建三个p标签,给这三个p标签设置不同的内容。
3、引入jquery库。在title标签后面引用下载好的jqueryjs文件。
4、 在jquery引用库标签后面新建一个script标签,在这个标签里面添加一个DOM加载完成后执行函数。
5、在DOM加载完成后执行函数里面添加点击p标签时获取当前元素的上一个元素对象。
6、保存html代码后使用浏览器打开,点击p标签d出框就会显示当前点击标签的上一个标签的内容。
$(window)height();//是文档窗口高度
$("div")offset()top//是标签距离顶部高度(没有到下面的距离,比如$("div")offset()down)
$("div")offset()left//是标签距离右边高度(没有到下面的距离,比如$("div")offset()right)
$(document)scrollTop();//是滚动条高度
$("div")height();//是标签高度
你要的高度+$("div")height()+[$("div")offset()top-$(document)scrollTop()]=$(window)height();
经过简单的数学变换即可得到你要的值了
获取页面某一元素的绝对X,Y坐标,可以用offset():
var X = $(‘#DivID’)offset()top;
var Y = $(‘#DivID’)offset()left;
获取相对(父元素)位置:
var X = $(‘#DivID’)position()top;
var Y = $(‘#DivID’)position()left;
通过getBoundingClientRect方法获取对象位置,包含: left , top , right , bottom 4个参数值。
以上就是关于jquery给div添加样式_百度经验1一c全部的内容,包括:jquery给div添加样式_百度经验1一c、如何通过jquery获得div元素的translateY值 / 网络技术编程、jQuery怎么获取当前li元素顺序等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!
欢迎分享,转载请注明来源:内存溢出
微信扫一扫
支付宝扫一扫
评论列表(0条)