
js设置和获取标签的属性
代码如下:
jq设置和获取标签的属性
代码如下:
值得注意的是JS的windowonload方法块的内容是在JQ的$(function(){})方法块执行完成后,再执行的。
二通过修改标签的css样式来改变它的样式
看看基本的语法:
代码如下:
$("#attr")addClass("banner");//添加样式
$("#attr")removeClass("banner");//移除样式
//JQ支持连带写法,因为removeClass的返回结果也是一个Jq对象,所以Jq对象的所有方法和事件它都可以使用
$("#attr")removeClass("banner")addClass("bannerOver");
下面是一个例子,当在dd标签上单击时,将当前dd块进行高亮显示
代码如下:
人一种高级动物狗人类的朋友猫猫科动物的祖先下面是为表格的隔行变色效果
代码如下:
odd{background:#808080;}
even{background:#ffd800;}
selected{background:#0094ff;color:#fff;}hover{background:#808080;}
代码如下:
var$trs=$("#menu_title>dd");//选择所有行$trsfilter(":odd")addClass("odd");//给奇数行添加odd样式$trsfilter(":even")addClass("even");//给偶数行添加odd样式
单击行后,让当前行高亮显示
代码如下:
//点击行,添加变色样式
$trsclick(function(e){
$(this)addClass("selected")
siblings()removeClass("selected");
})
添加鼠标移入与移出事件
代码如下:
//鼠标移入与移出
$("#menu_title>dd")hover(
function(){
$(this)addClass("hover");
},
function(){
$(this)removeClass("hover");
}
);
css方法:
1、取得第一个段落的color样式属性的值。
$("p")css("color");2、将所有段落的字体颜色设为红色并且背景为蓝色。
$("p")css({ color: "#ff0011", background: "blue" });<html><head>
<title>JQuery中如何获取样式属性的值</title>
<script type="text/javascript" src="jqueryjs"></script>
<style>
top {
background: url(Tupianjpg) no-repeat;
width: 75px;
height: 90px;
}
</style>
<script type="text/javascript">
$(function () {
var url = $("divtop")css("background-image");
alert(url);
})
</script>
</head>
<body>
<div class="top"></div>
</body>
</html>
jquery可以通过修改标签属性来改变它的样式;
js设置和获取标签的属性 :
代码如下:
<script type="text/javascript">
windowonload = function () {
var attr = documentgetElementById("attr");
attrsetAttribute("style", "font-weight:bold;")
alert(attrgetAttribute("style"));
}
</script>
jq设置和获取标签的属性 :
<script src="IP/Scripts/jquery/jquery-142minjs" type="text/javascript"></script>
<script type="text/javascript">
$(function () {
$("#attr")attr("style", "color:#ff0000");//单个属性的设置
$("#Avatar")attr({ "class": "banner", "alt": "头像", "src": "IP/avatar/a118538jpgid=11133319" });//多个属性的设置
alert($("#Avatar")attr("src")); //得到指定标签的属性
});
</script>
如果你知道div的class : $("classname")attr("id") 获得id
如果你知道div的id :$("#id")attr("class")获得class
如果都不知道,就要循环所有的div自己去判断了
var divs=$(div);
for(var i=0;i<divslength;i++)
{
//你的判断
}
获得div有什么属性 比如 data-id="a"
$("div[data-id='a']")attr("id")//获得id
$("div[data-id='a']")attr("class")//获得class
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<link rel="stylesheet" href="jqhovercss"><!--这里显示外链式样式-->
<!--<style>这里显示是内嵌式样式,两种方式都可以在下面的jq代码中获取到背景定位的值
a{ background-position: 0px 0px;}
a:hover{ background-position: 120px -20px;}
</style>-->
<script src="jquery-180minjs"></script><!--这里引入jq库,你在使用的时候记住修改路径-->
<script>
$(function(){
var bgPosition = $('a');
bgPositionhover(function(){
alert($(this)css('background-position'))
},function(){
alert('ok')
});
})
</script>
</head>
<body>
<a href="#">1111111111111</a>
</body>
</html>
以上就是关于如何标签中的样式全部的内容,包括:如何标签中的样式、JQuery中如何获取样式属性的值、怎样用jquery改变标签等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!
欢迎分享,转载请注明来源:内存溢出
微信扫一扫
支付宝扫一扫
评论列表(0条)