**innerText：**修改元素内容
<body>
<div></div>
<p>
我是文字
<span>123</span>
</p>
<script>
// innerText 和 inner HTML 的差別
// 1. inner Text 不識别html 标簽 非标準 去除空格 和換行
var div = document.querySelector("div")
div.innerText = '今天是：2020';
**inner HTML：**修改元素内容
// 2. inner HTML 識别 HTML 标簽 W3C标準 保留白格和換行
div.innerHTML = "<strong>今天是</strong>：2020";
// 這倆個屬性是可讀寫的 可以擷取元素裡面的内容
var p = document.querySelector("p");
console.log(p.innerHTML);
**修改的元素名字.屬性： **修改元素屬性``
// 2.注冊事件
zxy.onclick = function(){
img.src = "images/u=2637309453,136156531&fm=26&gp=0.jpg" // 修改元素屬性
img.title= "張學友" // 修改元素屬性
}
修改元素的名字.style.需要修改的樣式: 修改元素樣式屬性
// 擷取元素
var div = document.querySelector("div");
// 綁定事件 操作元素
div.onclick = function(){
// div.style.backgroundColor = "bule" div.style 裡面的屬性 采取駝峰命名法
this.style.backgroundColor = "purple" // 修改元素樣式
this.style.width = "250px"; // 修改元素樣式
// js 裡面的樣式采取駝峰命名法 比如 fontSize backgroundColor
// js 修改 style 樣式操作 産生的是行内樣式 css權重比較高
}
（特殊） 表單元素的屬性操作
<body>
<button>按鈕</button>
<input type="text" value="輸入内容" >
<script>
// 1.擷取元素
var btn = document.querySelector("button");
var input = document.querySelector("input");
// 2.注冊事件 處理程式
btn.onclick = function(){
// input.innerHTML = "點選了" 這個是普通盒子 比如 div 标簽裡面的内容
// 表單裡面的值 是通過 value 來修改的
input.value = "被點選了"
// 如果想要某個表單被禁用 不能再點選 disabled 我們想要這個按鈕被禁用
btn.disabled = "true" //禁用
this.disabled - "true" // this是指向事件函數的調用者 btn
}
</script>
</body>
![主流浏覽器四大綜合性能測試[圖]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)