javascript代码实例教程-JavaScript基础知识(必学)

发布时间:2019-01-02 发布网站:脚本宝典
脚本宝典收集整理的这篇文章主要介绍了javascript代码实例教程-JavaScript基础知识(必学)脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。
小宝典致力于为广大程序猿(媛)提供高品质的代码服务,请大家多多光顾小站,小宝典在此谢过。

JavaScript(以下简称为JS)在web前端开发中的重要性在每一位开发人员的心中应该都十分的清楚。在网页的特效方面,JS起到重要的作用,虽然在网络中,jquery插件可以说是一抓一大把,但JQ插件的制作完成亦是通过JS来实现的。想要制作出炫酷的特效动画效果不是一朝一夕便可完成的,需要有坚实的基础来支撑。今天,我们就来学一学JS入门基础。

一、关于内容的输出打印

1、window.alert(“内容”); 该语句会在页面弹出一个对话框,对话框中的内容为想要输出的内容,在对话框出现后点击右下方的确定按钮后对话框关闭后才可关闭页面

2、console.LOG(“内容”);该语句在控制台输出打印内容。内容不会显示在页面上,只会在后台的控制台中显示,程序员多用此语句进行程序的调试。console不仅仅可以在控制台输出打印内容,还可以输出打印警告、错误信息

(1)输出打印警告信息:console.warn(“警告信息”);

(2)输出打印错误信息:console.error(“错误信息”);

3、document.wrITe(“内容”);该语句输出的内容会显示在页面上,若有若干个document.write(“内容”);这些内容会依次输出。该语句可识别标签,若想通过document来添加标签,语法:document.write(“

内容

“);

二、关于获取元素

1、通过ID获取:document.getElementById(“ID名”);由于ID名唯一,因而只会返回一个元素

2、通过类名获取:document.getElementsByClassName(“类名”);一个页面中类名可有多个,所以,返回为数组。需注意的是:通过类名获取元素,IE具有兼容性,IE不支持该方法

3、通过标签获取:document.getelementsbytagname(“标签”);一个页面中同一个标签必定会重复使用,因而该方法返回值也为数组。

三、关于数据类型:

1、数据类型:

(1)Number类型:数字,例如:1,2,3…..

(2)String类型:“hello world ”、“你好”……

(3)Boolean类型:ture/false

2、数据类型转换:

(1)转换为Boolean类型:Boolean(需转换的变量名);

(2)转换为Number类型:Number(需转换的变量名);

(3)转换为String类型:String(需转换的变量名);或使用”+”转换

四、关于内容的获取:

1、获取标签中的内容:元素.innerHTML;该方式使用于双标签中的内容的获取

2、获取表单元素中的内容:元素.value;

五、关于内容的设置:

1、设置标签中的内容:元素.innerHTML(“内容”);

2、设置表单元素中的内容:元素.value(“内容”);

六、关于函数

1、含义:可重复使用的代码块

2、函数的定义:

(1)function 函数名(){ 代码块 }

(2)函数直接量定义:VAR fn=function(){ 代码块 }

(3)通过构造函数定义:var fn=new Function(“代码块”);

2、函数的调用:

(1)函数名();

(2)自执行函数:(function(){ 代码块 })();

七、关于流程控制

1、for语句:for语句大多用于数组的遍历,语法为:for(var i=0;i<数组名.length;i++){ 代码块 }

2、if……else/if……else if …….else语句:两种语句大多用于条件的判断,若条件成立则执行if的代码块,若if中的条件不成立则继续判断else if语句中的条件,成立则执行若两者条件皆不成立则执行else语句中的代码块,语法:if(条件1){ 代码块1;} else if(条件2){ 代码块2; } else{ 代码块3;},若只有两种条件下,else if可以省略。

八、事件

JS中的事件是动画特效不可缺少的。事件具有三要素:事件(谁引起)、事件类型(引起的人怎么了)、事件驱动程序(结果如何),JS的事件有多种,之今我接触的大多为以下几种

1、点击事件:onclick()

2、鼠标悬停事件:onmouseover()/onmouseenter();

3、鼠标移除事件:onmouseout()/onmouseleave();注意::onmouseover()与:onmouseout()配合使用,onmouseenter()和onmouseleave()配合使用。大多使用的为后两者,因为后两者的触发不会产生冒泡事件。

4、鼠标获取焦点事件:onfocus();

5、鼠标事情焦点事件:onblur();

关于JS的相关知识不仅仅只是以上内容,还有很多有趣的知识,若有兴趣或是有需要的同学可以自己去查看,当然,我也会在博客中为大家提供一定的帮助。

觉得可用,就经常来吧! 脚本宝典 欢迎评论哦! js脚本,巧夺天工,精雕玉琢。小宝典献丑了!

脚本宝典总结

以上是脚本宝典为你收集整理的javascript代码实例教程-JavaScript基础知识(必学)全部内容,希望文章能够帮你解决javascript代码实例教程-JavaScript基础知识(必学)所遇到的问题。

如果觉得脚本宝典网站内容还不错,欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。