操作对象标签
<div id="first" class="green" data-age="19"></div>
<div id="second" class="blue"></div>
<div id="third" class="red"></div>
<input type="radio" name="select" checked="False">web
- 原生js属性获取
var div = document.getElementById(“first”);
获取第一个标签的ID
var divID = div.id;
给id重新赋值
div.id = "four"
通过getAttributr方法获取属性值
var divID = div.getAttribute("id")
通过getAttributr方法设置id属性
div.setAttribute("id","first")
通过className方法获取class值
var myClass = div.className;
给div添加class值,这个方法会替换掉原来的class值
div.className = "border"
获取div的class值,但是获取的是一个数组列表类型的class
var classList = div.classList
给div设置一个class值,但是会替换原来类名
div.classList = "green"
给div添加一个类名,不会替换原来的class值
div.classList.add("border")
移除一个类名
div.classList.remove("border")
判断class值是否存在,有则删除,无则添加
div.classList.toggle("border")
查找dataset集合属性值
var age= div.dataset.age
设置data属性
div.dataset.age = "30"
- JQ方法获取属性值
获取属性 获取的是所有同类型标签中的某一个的属性
var myID = $("div").attr("id")
设置属性 设置的是所有同类型标签的属性
$("div").attr("id","newID")
添加一个class属性值
$("div").addClass("red")
移除一个class属性值
$("div").removeClass("red")
判断class值是否存在,有则删除,无则添加
$("div").toggleClass("red")
attribute 属性 用来设置和获取所有值不为布尔类型的属性
var isSelect = $("input").attr("checked")
查看单选框是否被选中
property 属性 用来设置和获取值布尔类型的属性
var isSelect = $("input").prop("checked")
链式调用
$("div").css("background-color","orange").css("margin-left","0").css({"margin-top":"0"})