.attr()
Định nghĩa và sử dụng .attr()lấy giá trị hoặc thêm thuộc tính (attribute) cho thành phần. Ngoài việc sử dụng .attr() để lấy giá trị như id, class, chúng ta còn có thể lấy title, type, hay bất cứ attr nào khác. .attr(tên thuộc tính) Cấu trúc Lấy giá trị của thuộc tính. $(‘a’).attr(‘thuộc tính’); Html viết: <!DOCTYPE HTML> <html> <head> […]
Định nghĩa và sử dụng
.attr()lấy giá trị hoặc thêm thuộc tính (attribute) cho thành phần.- Ngoài việc sử dụng
.attr()để lấy giá trị nhưid,class, chúng ta còn có thể lấytitle,type, hay bất cứ attr nào khác.
.attr(tên thuộc tính)
Cấu trúc
Lấy giá trị của thuộc tính.
$('a').attr('thuộc tính');
Html viết:
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Tiêu đề</title>
<script src="https://code.jquery.com/jquery-latest.js"></script>
<script>
$(function(){
var hrefAttr = $('a').attr('href');
$('.test').html(hrefAttr);
});
</script>
</head>
<body>
<p>Thành phần p có <a href="http://www.lth90.top">link a</a></p>
<div>Bạn đang xem nội dung tại <span class="test"></span></div>
</body>
</html>
Hiển thị trình duyệt:
Thành phần p có link a
Bạn đang xem nội dung tại http://www.lth90.top
Với cách sử dụng .attr('href') ta đã lấy được giá trị thuộc tính href của thẻ a.
So sánh code HTML trước và sau khi có jQuery:
| Trước khi có jQuery | Sau khi có jQuery |
| <p>Thành phần p có <a href=”http://www.lth90.top”>link a</a></p> <div>Bạn đang xem nội dung tại <span class=”test”></span></div> |
<p>Thành phần p có <a href=”http://www.lth90.top”>link a</a></p> <div>Bạn đang xem nội dung tại <span class=”test”>http://www.lth90.top</span></div> </div> |
.attr(tên thuộc tính, giá trị thuộc tính)
Cấu trúc
Gán giá trị cho thuộc tính.
$('a').attr('thuộc tính','giá trị');
Html viết:
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Tiêu đề</title>
<script src="https://code.jquery.com/jquery-latest.js"></script>
<script>
$(function(){
$('a').attr('href','http://www.lth90.top');
});
</script>
</head>
<body>
<p>Thành phần p có <a href="http://www.google.com">link a</a></p>
</body>
</html>
Hiển thị trình duyệt:
Thành phần p có link a
Ban đầu thuộc tính href có giá trị http://www.google.com, nhưng với cách sử dụng như trên ta đã thay đổi giá trị của thuộc tính href thành http://www.lth90.top.
So sánh code HTML trước và sau khi có jQuery:
| Trước khi có jQuery | Sau khi có jQuery |
| <p>Thành phần p có <a href=”http://www.google.com”>link a</a></p> | <p>Thành phần p có <a href=”http://www.lth90.top“>link a</a></p> |