JavaWeb笔记(1)
JavaScript
JavaScript语言主要用于完成页面数据的获取,实现界面的动态效果
(1)变量
JS变量类型var
var a = 12;
var b = "123";
(2)数组的定义
var a = [];
//一次定义数组时,元素可为不同类型
var b = [1,"2",true];
(3)方法*
方法允许重载,但是会覆盖掉上一次的定义
//第一种定义方式
function 函数名(参数){
方法体
}
//第二种定义方式
var 函数名 = function(参数){
方法体
}
(4)自定义对象
对象的定义: var 变量名 =newObject();
// 对象实例(空对象) 变量名.属性名 = 值;
// 定义一个属性 变量名.函数名 =function(){}
// 定义一个函数
花括号{}自定义对象
var user1 = {
id:1,
username:zsh,
password:123123
}
(5)事件
与电脑页面交互的行为响应称为事件
绑定事件的步骤
- 获取要绑定事件的标签对象
- 标签对象.事件名 = function(){}
例:
事件1:onclick(单击事件)
事件2:onblur(失去焦点事件)
事件3:onchange(标签内容发生改变事件)
事件4:onsubmit(表单提交事件)
(6)Dom对象 (DocumentObjectModel)
Dom对象和HTML:
- Dom对象管理所有的HTML文档内容。
- 是一种树形结构,有层级关系。
- 将所有标签对象化。
获取Dom对象的方法:
- document.getElementById()
- document.getElementByName()
- document.getElementByTagName()
- document.createElement()
Dom对象的属性和方法:
方法:
- getElementsByTagName() 方法,获取当前节点的指定标签名孩子节点
- appendChild(oChildNode) 方法,可以添加一个子节点,oChildNode 是要添加的孩子节点
属性:
- childNodes 属性,获取当前节点的所有子节点
- firstChild 属性,获取当前节点的第一个子节点
- lastChild 属性,获取当前节点的最后一个子节点
- parentNode 属性,获取当前节点的父节点
- nextSibling 属性,获取当前节点的下一个节点
- previousSibling 属性,获取当前节点的上一个节点
- className 用于获取或设置标签的 class 属性值
- innerHTML 属性,表示获取/设置起始标签和结束标签中的内容
- innerText 属性,表示获取/设置起始标签和结束标签中的文本