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、代码

 <!doctype html>

 <html lang="en">

 <head>

     <meta charset="UTF-8">

     <title>index</title>

 </head>

 <body>

     <div class="img">

         <img src="dog.png" id='dogid'>

     </div>

 </body>

 <script>

 //找到小狗图片

 dogobj=document.getElementById('dogid');

 //给小狗图片加事件

 dogobj.onclick=function(){

     //代码段

     alert(dogobj.id);

     alert(dogobj.src);

 }

 //触发事件

 </script>

 </html>
 

js课程 1-2 js概念的更多相关文章

  1. python 全栈开发，Day55(jQuery的位置信息,JS的事件流的概念(重点),事件对象,jQuery的事件绑定和解绑,事件委托(事件代理))

    一.jQuery的位置信息 jQuery的位置信息跟JS的client系列.offset系列.scroll系列封装好的一些简便api. 一.宽度和高度 获取宽度 .width() 描述:为匹配的元素集 ...

  2. TensorFlow.js之安装与核心概念

    TensorFlow.js是通过WebGL加速.基于浏览器的机器学习js框架.通过tensorflow.js,我们可以在浏览器中开发机器学习.运行现有的模型或者重新训练现有的模型. 一.安装     ...

  3. 7-81 js课程小结

    7-81 js课程小结 学习要点 理解全局对象 变量的作用范围 理解全局对象Global 全局属性和函数可用于所有内建的 JavaScript 对象.全局对象是所有全局方法的拥有者,用来统一管理全局方 ...

  4. js课程 6-15 js简单弹力球如何实现

    js课程 6-15 js简单弹力球如何实现 一.总结 一句话总结:a.通过document的documentElement属性获取可是区域的高: b.通过增值变为负的实现到底部后反弹 1.docume ...

  5. js课程 5-14 js如何实现控制动画角色走动

    js课程 5-14 js如何实现控制动画角色走动 一.总结 一句话总结:首先是onkeydown事件,然后是改变元素的left和top属性 1.常用键盘事件有哪些? • onkeydown和 onke ...

  6. js课程 5-13 js事件绑定和鼠标事件注意事项有哪些

    js课程 5-13  js事件绑定和鼠标事件注意事项有哪些 一.总结 一句话总结:js代码的灵魂就是改变标签的属性和样式,就这两种. 1.js触发改的东西是哪两样? 属性和样式 2.js如何让页面用标 ...

  7. js课程 4-12 js中正则表达式如何使用

    js课程 4-12 js中正则表达式如何使用 一.总结 一句话总结: 1.js正则表达式手册取哪里找? w3cschool或者菜鸟教程->找到js正则表达式->完整的RegExp参考手册这 ...

  8. js课程 4-11 表格如何实现隔行换色

    js课程 4-11 表格如何实现隔行换色 一.总结 一句话总结:表格奇数行和偶数行判断,赋予不同的样式. 1.表格如何隔行换色? 表格奇数行和偶数行判断,赋予不同的样式. 21 <script& ...

  9. js课程 3-10 js中字符串函数数组函数和其它语言中对应函数的区别和联系是什么

    js课程 3-10  js中字符串函数数组函数和其它语言中对应函数的区别和联系是什么 一.总结 一句话总结:js中是对象点方法的形式,这些方法都是对象的方法,而在php.java中却不是这样. 1.j ...

随机推荐

  1. [Javascript] Classify text into categories with machine learning in Natural

    In this lesson, we will learn how to train a Naive Bayes classifier or a Logistic Regression classif ...

  2. [Javascript AST] 3. Continue: Write ESLint rule

    The rule we want to write is show warning if user using console method: // valid foo.console() conso ...

  3. gplaycli—— 用于从 GooglePlayStore 中下载和管理 Apk 文件的命令行工具

    gplaycli-- 用于从 GooglePlayStore 中下载和管理 Apk 文件的命令行工具 这个 GooglePlay市场 中 https://play.google.com/store/a ...

  4. jmeter连接mysql数据库配置

    用jmeter连接mysql数据库,在配置的过程中遇到了几个坑,跟大家分享一下,避免人人踩坑~~ 关于驱动包:大部分时候是需要下载与服务器的mysql相同版本的jar包~~ 关于驱动包路径:不是所有的 ...

  5. 【Codeforces Round #431 (Div. 2) C】From Y to Y

    [链接]点击打开链接 [题意] 让你构造一个大小最多为10W的字符multiset. 你进行n-1次操作; 每次操作,从set中取出两个字符串,一开始单个字符被认为是字符串. 然后把它们连接在一起. ...

  6. Cocos2d 游戏状态机

    加cocos2d 是标题党. 事实上跟cocos2d无关. 1.游戏背景介绍 比方有这么一个"记忆"类的比赛游戏.你和电脑对战.轮到谁的回合,谁翻两张牌.假设两张牌一样,就消掉这两 ...

  7. Testin云測与ARM 战略合作：推动全球移动应用加速进入中国市场

    Testin云測与ARM 战略合作:推动全球移动应用加速进入中国市场 2014/10/14 · Testin · 业界资讯 (中国北京–2014年10月14日 )全球最大的移动游戏.应用真机和用户云測 ...

  8. C语言深度解剖读书笔记

    开始本节学习笔记之前,先说几句题外话.其实对于C语言深度解剖这本书来说,看完了有一段时间了,一直没有时间来写这篇博客.正巧还刚刚看完了国嵌唐老师的C语言视频,觉得两者是异曲同工,所以就把两者一起记录下 ...

  9. 【AtCoder Beginner Contest 074 A】Bichrome Cells

    [链接]h在这里写链接 [题意] 在这里写题意 [题解] 在这里写题解 [错的次数] 0 [反思] 在这了写反思 [代码] #include <bits/stdc++.h> using n ...

  10. 错误代码： 1449 The user specified as a definer (&#39;root&#39;@&#39;%&#39;) does not exist

    1. 错误描写叙述 1 queries executed, 0 success, 1 errors, 0 warnings 查询:call analyse_use('20150501','201506 ...