1,属性
事物所具有的不可缺少的性质
利用属性可以描述一个对象的特性和功能
2,属性操作
增加属性、删除属性、改写属性、查找属性
3,操作属性的方式
点(。)
元素的自身属性,并且符合命名规则
中括号([ ])
属性名不符合命名规则,或者属性名存在变量中
4,注意事项
属性名要符合变量命名规则
5,元素的style属性
用来操作行间样式
样式名不符合命名规则
通过 [ ] 的方式操作
通过 驼峰 的方式(去掉 - ,- 后的首字母大写)
6,元素的其他属性
id、className、value、innerHTML以上属性都可以进行读写操作
innerHTML 获取当前元素下的所有字符
简易留言板
1、获取元素(输入框、按钮、列表)
* 输入框输入的内容,获取value
* 按钮添加事件,点击后新增留言
* 列表,放新增留言内容
*
* 2、给按钮添加点击事件
*
* 3、获取输入框的value
*
* 4、通过设置ul的innerHTML新增留言内容
<body>
<input type = "text" id = "text"/>
<input type = "button " id = "btn" value = "留言板"/ >
<ul id = "list"> </ul>
<script>
// 1、获取元素(输入框、按钮、列表)
window.onload = function(){
var text = document.getElementById('text');
var btn = document.getElementById('btn');
var list = document.getElementById('list');
// 2、给按钮添加点击事件
btn.onclick = function() {
// 3、获取输入框的value
console.log(text.value)
// 4、通过设置ul的innerHTML新增留言内容
console.log('在innerHTML之前:'+list.innerHTML);
list.innerHTML += '<li>'+ text.value +'</li>';
console.log('在innerHTML之后:'+list.innerHTML);
// 5、清空当前输入框的value
text.value = '';
}
}</script>
</body>