js课程 1-2 js概念
一、总结
一句话总结:js标签元素也是js对象,有属性和方法,方法就是事件,属性就是标签属性,可以直接调用。
1、js中如何获取标签对象?
getElement获取的是标签,是元素,同样也是js对象,也有属性和方法,方法就是onclick这些事件,属性就是固有的属性
13 //找到小狗图片
14 dogobj=document.getElementById('dogid');
15
16 //给小狗图片加事件
17 dogobj.onclick=function(){
18 //代码段
19 alert(dogobj.id);
20 alert(dogobj.src);
21 }
2、为什么说js是基于对象语言而不是面向对象语言?
因为js是内置了很多对象,我们可以直接使用而不用创建,比如document、history、event等等
3、document.write()的作用是什么,里面可以输出html标签么?
在执行位置输出html,可以html标签
2.document.write('<h1>'+username+'</h1>');
4、js中的标签对象有哪些常用属性和方法?
方法就是那些onclick事件那些,属性的话就标签的各种属性
13 //找到小狗图片
14 dogobj=document.getElementById('dogid');
15
16 //给小狗图片加事件
17 dogobj.onclick=function(){
18 //代码段
19 alert(dogobj.id);
20 alert(dogobj.src);
21 }
二、js概念
1、相关知识
何为js特效:
1.定义事件(触发时机+行为)
2.触发事件(行为发生)
3.事件发生是具有重复性
面向对象编程:(js是一门基于对象的语言)
1.如何获得该对象
2.如何调用该对象的属性
3.如何调用该对象的方法
对象的组成部分:
1.属性(特征)
2.方法(行为)
js标签放置位置(执行顺序):
1.内联
2.内部
3.外部
变量定义:
username='小金';
字符串连接变量:
'my name is '+username
js如何输出变量:
1.alert(username);
2.document.write('<h1>'+username+'</h1>');
js中字符串连接符:
+
2、代码
1 <!doctype html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>index</title> 6 </head> 7 <body> 8 <div class="img"> 9 <img src="dog.png" id='dogid'> 10 </div> 11 </body> 12 <script> 13 //找到小狗图片 14 dogobj=document.getElementById('dogid'); 15 16 //给小狗图片加事件 17 dogobj.onclick=function(){ 18 //代码段 19 alert(dogobj.id); 20 alert(dogobj.src); 21 } 22 23 //触发事件 24 </script> 25 </html>