本帖最后由 小鲁哥哥 于 2017-3-22 15:50 编辑
【济南中心】PHP课程同步笔记day06：JS介绍(四) 对象 将一组数据与这组数据有关操作组装在一起，形成一个实体，这个实体就是对象在 JavaScript 中，对象是拥有属性和方法的数据。 属性是对象相关的值 方法是能够在对象上执行的动作。 以汽车为例，汽车就是现实中的对象。 汽车的属性包括名称、型号、重量、颜色等 汽车的方法可以是启动、驾驶、刹车等。 JavaScript 中的几乎所有事务都是对象：字符串、数字、数组、日期、函数，等等。 访问对象的属性的语法是： objectName.propertyName 访问对象的方法的语法是： objectName.methodName() 事件： HTML和JS通过事件建立联系 鼠标事件： Onclick:点击事件 Onmouseover:鼠标放上 Onmouseout:鼠标离开 键盘事件： onkeyDown:键盘按下 onkeyUp:键盘抬起 onkeyPress:按键一次 表单事件 Onsubmit:表单提交事件 Onfocus:获得焦点 Onblur:失去焦点 窗口事件 Onload,在网页一打开的时候(必须把所有的东西都加载完成之后) <body onload=”init()”></body> Window.onload = init 注意：函数名init之后没有括号 Event：是指事件发生的时候(事件源)相关的一些信息 clientX：获得鼠标的X坐标 clientY：获得鼠标的Y坐标 Event.target:事件源 [HTML] 纯文本查看 复制代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title> new document </title>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
<script type="text/javascript">
window.onload = init;
function init(){
alert(123);
}
</script>
</head>
<body>
hello
</body>
</html>Js控制改变标签的html属性和css属性 1）首先获取标签 2）找对对应的标签属性并赋值 a) HTML的标签属性设置 i. 取值var w=对象.HTML属性名 ii. 对象.HTML 属性名 = 值 b) CSS属性设置 i. Var ab = 对象.style.CSS 属性名 ii. 对象.style.CSS属性名 = 值 Document.getElementById(“id”);通过这种方法可以获得这个id名的标签对象 Document.getElemetsByTagName(“标签名”)通过这种方法可以获得标签名的标签对象注意：这个时候获得的是数组形式的 Document.body：获得body这个对象 [HTML] 纯文本查看 复制代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">[/align]<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title> new document </title>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
<style type="text/css">
#div{
width:200px;
height:100px;
background-color:red;
}
</style>
<script type="text/javascript">
function change(){
var obj = document.getElementById("div");
obj.style.backgroundColor="black";
}
</script>
</head>
<body>
<div id="div"></div>
<input type="button" value="改变">
</body>
</html>效果：
innerHTML和value对比 innerHTML：所有在这个对象内的内容都是innerHTML的内容 Value：一般情况input的时候都是value,双标签都需要用到innerHTML [HTML] 纯文本查看 复制代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title> new document </title>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
<script type="text/javascript">
function show(){
var m = document.getElementById("d1");
var str = m.innerHTML;
alert(str);
}
</script>
</head>
<body>
<div id="d1">
<div>这是汉字</div>
</div>
</body>
</html>效果：
| 
收藏
淘帖
踩
