136.元素的操作

html代码部分：

<div id="box">helo</div>
<input type="text" id="email" value="">
<div id="box2" contenteditable="true">123345</div>
<img id="img1" src="src/18.jpg">
<a id="a1" href="http://www.baidu.com">xxx</a>

效果为上图

通过一个事件就能操作元素的属性

我下面用的是点击

btn.onclick = function fn() {
			
				box.innerText = "<h1>6666</h1>"
				email.value = "6666"
				
				box2.innerText = "6666"
				
				img1.src = "./src/25.jpg"
				a1.href = "http://www.4399.com"
				a1.style.textDecoration = "none"
			}

我点击后的效果如下

 

tip:

id是box的元素 可以把box直接看做一个全局变量  它引用的就是#box元素

知道就行了 不要在项目这样使用 因为容易导致程序混乱

操作元素的属性:你知道就可以操作多少