1、属性的操作：对象名.getAttribute(“属性值”)获取属性值
案例如下：
<html>
<head>
<title>form.html</title>
<meta charset="UTF-8">
</head>
<body>
您喜欢的游戏:<br>
<ul>
<li id="fk" value="fankong">反恐</li>
<li id="ms" value="moshou">魔兽</li>
<li id="xj" value="xingji">星际争霸</li>
</ul>
</body>
<script type="text/javascript">
//获取<li id="xj" value="xingji">星际争霸</li>节点的value属性的值
//1.获取di是xj的标签对象
var xjEle = document.getElementById("xj");
//2.使用对象名.getAttribute("属性值")获取属性值
//alert(xjEle.value);//输出的是0
//这种方式只适用于有固定的标签(input,select,textarea)-->value img-->src
alert(xjEle.getAttribute("value"));//所有标签通用的方式
</script>
</html>
注意：
对象.属性名：获取的value的属性值,没有在文本框输入获取的是默认值，在文本框中输入内容，获取的是输入的值。修改了之后实际上读取的是内存中缓存html文件。
对象.getAttribute(“属性值”)：获取的属性值,无论页面中内容是否改变，获取的都是value上写的值
对象名.属性名这种方式获取属性值，一般都是form表单中的标签使用(固定的标签)(input,select,textarea)。其他的标签一般不使用这种方式。多使用getAttribute(“属性值”)。
若要使用对象调用某些方法，就得通过getElementById(“元素的id属性值”）或者getElementsByName(“name的属性值”)……得到对象名。
关于form表单的说明：https://blog.csdn.net/qq_45083975/article/details/91055272
2、属性的操作：对象名.setAttribute(“属性名”,“属性值”)给元素添加属性
案例如下：
<html>
<head>
<title>form.html</title>
<meta charset="UTF-8">
</head>
<body>
您喜欢的游戏:<br>
<ul>
<li id="fk" value="fangkong">反恐</li>
<li id="ms" value="moshou">魔兽</li>
<li id="xj" value="xingji">星际争霸</li>
</ul>
</body>
<script type="text/javascript">
//给这个节点增加 name属性 <li id="xj" value="xingji" name="xingjizhengba">星际争霸</li>
//1.获取id是xj的标签对象
var xjEle = document.getElementById("xj");
//2.使用对象名.setAttribute("属性名","属性值")给元素添加属性
xjEle.setAttribute("name","xingjizhengba");
//测试
alert(xjEle.getAttribute("name"));//xingjizhengba
xjEle.removeAttribute("name");
alert(xjEle.getAttribute("name"));//null
</script>
</html>
注意：
使用对象名.setAttribute(“属性名”，“属性值”)给元素添加属性，改变的是内存中html文件的属性，并不是源代码。
对象名.removeAttribute(“属性值”)可以删除某一个元素的属性。此时移除的也是内存中html文件的属性。
3、标签元素的操作：对象的innerHTML属性
设置标签体: 对象名.innerHTML = 标签体;
获取标签体: 对象名.innerHTML
<html>
<head>
<title>form.html</title>
<meta charset="UTF-8">
</head>
<script type="text/javascript">
//页面加载事件,页面加载完毕,在执行事件的响应函数
window.onload=function(){
//在div层中插入 <h1>海马</h1>
//1.获取id是city的标签对象
var cityEle = document.getElementById("city");
/*
* 2.使用对象的innerHTML属性
* 设置标签体: 对象名.innerHTML = 新的标签体;
* 获取标签体: 对象名.innerHTML
*/
//alert(cityEle.innerHTML);//fff
cityEle.innerHTML = "<h1>海马</h1>";
//alert(cityEle.innerHTML);//<h1>海马</h1>
/*
* 了解:innerText属性:
* 设置标签体: 对象名.innerText = 新的标签体; 设置的标签体都会解析为text文本
*/
//cityEle.innerText = "<h1>海马</h1>";
//alert(cityEle.innerText);//<h1>海马</h1>
}
</script>
<body>
<div id="city">fff</div>
</body>
</html>
注：用innerHTML操作对象，若之前有元素，那么操作完之后，会把之前的元素覆盖掉。
对象名.innerText = 新的标签体; 设置的标签体都会解析为text文本
比如：
cityEle.innerHTML = "<h1>海马</h1>"
//则会把“海马”这两个以h1大小的样式输出
cityEle.innerText = "<h1>海马</h1>"
//则会把“<h1>海马</h1>”这一串文本都数出来，字体大小为默认
等页面加载完，再加载一个事件（经常用到，比如弹广告，轮播图…）
方法一：可以直接把要发生的事件，加到代码最后面。不用创建响应函数。
方法二：（一般在head标签内）在最前面创建一个页面加载事件，等加载所有的页面加载完毕之后，再响应函数window.οnlοad=function(){ }
有两种情况：若选中，则返回true。若未选中，则返回false。
form标签的子标签option，option有个子标签selected。
form标签的子标签input---->input标签的属性---->type（设置input标签的类型）的属性值里有两个属性值radio（单选）、checkbox（多选）中都有个属性checked。