函数: function(){}
函数声明：
function name(){
}
函数执行:
name();
函数类型的划分
一、根据调用环境的不同来划分:
1、事件函数 (绑定在事件中的函数，叫做事件函数,触发该事件时，函数才会被执行)
事件调用时，不需要加括号
2、非事件函数 非事件调用:
非事件调用时，需要加括号
二、根据有无名字划分:
有名字的函数
匿名函数
变量和函数的命名:
1. 不能以数字开头
2. 绝大部分的特殊字符都不能使用,目前只能用(_,$)
3. 建议不要用中文
4. 不能使用关键字和保留字
5. 最好都带有含义
6. js中一般使用驼峰命名（从第二个单词开始首字母大写）
函数书写的位置：
1、行间样式
eg. <input type = "button" onclick = "alert('弹出框')">
2、外部样式
eg. <script type = "text/javascript" src = "js/index.js" ></script>
3、内部样式
3-1 紧接着页面的结构书写
eg. <input type = "button" id = "btn" >
<script type = "text/javascript">
btn.onclick = function(){
alert('弹出框');
}
</script>
3-2 引用window.onload 可以写在html中的任何位置
eg. <script type = "text/javascript" >
window.onload = function(){
btn.onclick = function(){
alert('弹出框');
}
}
</script>
函数事件：
1、事件包括:
onclick、onmouseover、onmouseout
2、事件绑定:
eg. el.onclick = function(){}
注意：事件绑定是会前后覆盖的，一个元素的某个事件 只能添加一个操作
若想有多种显示结果，可以考虑用函数调用
eg. btn.onclick = function(){ // btn这一个元素的点击事件可以有多种操作
fn1(); // 弹出1（调用下面的函数）
fn2(); // 弹出2（调用下面的函数）
};
function fn1(){
alert(1);
};
function fn2(){
alert(2);
};
属性操第一种操作：（通过.的操作，此处的 . = "的" ）
一、读操作
eg. console.log(div.id);
console.log(div.className);
console.log(div.innerHTML);
console.log(text.value);
console.log(select.value);
注意问题:
1. class不叫class，叫作className
2. 要获取元素的内容的话，可以使用innerHTML
- innerHTML代表元素的开始标签和闭合标签之间的所有内容（如:包含在元素中的标签，也属于innerHTML）
- 获取textarea 既可以用innerHTML 也可以用value
- 获取select 选中的值 用value
3. style 获取元素的行间样式
- cssText 行间所写的所有样式
- 具体的样式名
4. js中不能出现"-",去掉"-"之后，后边的单词首字母大写
5. 注意 img 和 link 等外链内容，获取路径时，获取到的是绝对路径
二、属性的写操作
在js中 包含在一对引号之间的一串字符叫做“字符串”，引号可以是单引号‘ ’，也可以是双引号“ ”。
eg. var box = document.getElementById("box")
box.innerHTML = '百度';
box.style.cssText = "border: 2px solid #000";
box.style.border = "2px solid #000";
注意问题:
1. 直接设置innerHTML,会直接替换掉之前的所有内容
2. 直接设置cssText,会直接替换掉之前的所有内容
3. 一般不要修改id名
属性操第二种操作：（通过[‘属性名’]操作，此处的 [] = "的" ）
eg. console.log(box['innerHTML'])
box['innerHTML'] = box.innerHTML
var s = "innerHTML"; //属性名可以是个变量
box[s] = "马上就要秋天了" === box.innerHTML="马上就要秋天了"
网友评论