首页> 基础笔记 >JS/JQ基础学习 >Jquery Jquery
JQuery中的Dom操作-使用attr()方法来获取/设置元素的各个属性的值
作者：小萝卜 2023-03-24 【 jquery 】 浏览 407
简介JQuery中的Dom操作-使用attr()方法来获取元素的各个属性的值
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>元素操作</title>
<style type="text/css">
#test,div{width:200px;height:200px;background:orange;}
#test,.item{background:cyan;}
</style>
</head>
<body>
<div id="test" name="ok"><a>iloveyouvery much</a></div>
<script type="text/javascript" src="jquery-1.8.3.min.js"></script>
<script type="text/javascript">
//属性操作
//属性添加
$('#test').attr('love','iloveyou');//setAttribute
//获取
var v = $('#test').attr('id');//getAttribute
//属性的移出
$('#test').removeAttr('name');//removeAttribute
//样式操作
//添加样式
// $('#test').css('background','black');
// $('#test').css({background:'black',border:"solid 20px red",paddingLeft:'200px'});
//添加class className
// $('div').addClass('item');//add 添加 class类
// $('div').removeClass('item');
//获取元素样式 test.style.width;
var w = $('#test').css('width');//css方法不仅能设置css样式 而且还能够获取css样式 即使是外部css还有内联样式
var b = $('#test').css('background-color');
//文本操作
//获取文本
var t = $('#test').html();//innerHTML
var t = $('#test').text();//textContent
//设置文本
$('#test').html("<span>明天就周五啦 思密达</span>");
$('#test').text("<span>后天就休息了 哦也</span>");
</script>
</body>
</html>
很赞哦！ (0)
