W3.JS Thêm lớp vào HTML
Thêm một lớp học:
w3.addClass(selector,'class')
Thêm nhiều lớp:
w3.addClass(selector,'class1 class2 class3...')
Thêm lớp theo Id
Thêm lớp "được đánh dấu" vào phần tử có id = "London":
Thí dụ
<button onclick="w3.addClass('#London','marked')">Add Class</button>
Thêm lớp theo thẻ
Thêm lớp "được đánh dấu" vào tất cả các phần tử <h2>:
Thí dụ
<button onclick="w3.addClass('h2','marked')">Add Class</button>
Thêm lớp theo lớp
Thêm lớp "được đánh dấu" vào một phần tử có class = "city":
Thí dụ
<button onclick="w3.addClass('.city','marked')">Add Class</button>
Thêm nhiều lớp
Để thêm nhiều lớp vào một phần tử, hãy tách mỗi lớp bằng một khoảng trắng.
Thêm cả "class1" và "class2" vào một phần tử có id = "London":
Thí dụ
<button onclick="w3.addClass('#London','class1 class2')">Add
Classes</button>
Xóa các lớp khỏi các phần tử HTML
Xóa một lớp học:
w3.removeClass(selector,'class')
Loại bỏ nhiều lớp:
w3.removeClass(selector,'class1 class2 class3...')
Xóa lớp theo Id
Xóa lớp "được đánh dấu" khỏi phần tử có id = "London":
Thí dụ
<button onclick="w3.removeClass('#London','marked')">Remove Class</button>
Xóa lớp theo thẻ
Xóa lớp "được đánh dấu" khỏi tất cả các phần tử <h2>:
Thí dụ
<button onclick="w3.removeClass('h2','marked')">Remove Class</button>
Xóa từng lớp
Xóa lớp "được đánh dấu" khỏi tất cả các phần tử có class = "city":
Thí dụ
<button onclick="w3.removeClass('.city','marked')">Remove Class</button>
Xóa nhiều lớp
Để xóa nhiều lớp khỏi một phần tử, hãy tách mỗi lớp bằng một khoảng trắng.
Xóa cả "class1" và "class2" khỏi phần tử có id = "London":
Thí dụ
<button onclick="w3.removeClass('#London','class1 class2')">Remove
Classes</button>
Chuyển đổi loại phần tử HTML
Chuyển đổi một lớp (bật / tắt):
w3.toggleClass(selector,'class')
Chuyển đổi giữa hai lớp:
w3.toggleClass(selector,'property','class','class')
Chuyển đổi lớp theo Id
Chuyển đổi giữa lớp "được đánh dấu" của một phần tử có id = "London":
Thí dụ
<button onclick="w3.toggleClass('#London','marked')">Toggle</button>
Chuyển đổi lớp theo thẻ
Chuyển đổi giữa lớp "được đánh dấu" của tất cả các phần tử <h2>:
Thí dụ
<button onclick="w3.toggleClass('h2','marked')">Toggle</button>
Chuyển đổi lớp theo lớp
Chuyển đổi giữa lớp "được đánh dấu" của tất cả các phần tử với class = "city":
Thí dụ
<button onclick="w3.toggleClass('.city','marked')">Toggle</button>
Chuyển đổi nhiều lớp
Chuyển đổi giữa tên lớp "class1" và "class2" của id = "London:
Thí dụ
<button onclick="w3.toggleClass('#London','class1','class2')">Toggle</button>