知识点预览1.js的基本使用2.js变量的定义及类型3.js函数的定义与预解析4.js中获取标签5.读写标签js中的属性00-JavaScript简介JavaScript是一种运行在浏览器端的脚本语言。JavaScript主要解决前端与用户交互的问题，包括用户交互和数据交互。JavaScript由浏览器解释执行，前端脚本语言有JScript（微软，IE特有）、ActionScript（Adobe，需要插件）等。三个前端块：1.HTML：页面结构2.CSS：页面性能：元素大小，颜色，位置，隐藏或显示，一些动画效果3.JavaScript：页面行为：一些动画效果，页面和用户交互，页面Function01-JS的三种写法内联型内嵌外部链接型注意：如果一个脚本标签链接一个js文件，这个脚本不能做其他事情02-变量定义变量可以单独定义，也可以一次定义多个，但是用逗号分隔[AppleScript]以纯文本查看__复制代码？1234/`/1。定义一个`variNumber=100`;`/`/2。定义多个`variOne=200`,sTwo``=``"abc",iThree``=``300;`变量类型基本数据类型numbertypeintfloatstringstringbooleantypetruefalseundefinedundefinedvariableunassignedisundefinedemptytypenullcompositeTypeobject[AppleScript]plaintextview__Copycode?1234varoObj={name`:"张三",`age`:16,`}typeof获取对象类型04-变量和函数的命名约定1.严格区分sizes写2.第一个字符：字母下划线(_)$3.除第一个字符外的其他字符：数字和字母下划线$匈牙利语命名风格：objectoObject例如：oDivarrayaArray例如：aItemsStringsStringFor例如：sUserNameIntegeriInteger例如：iItemCountBooleanvaluebBoolean例如：bIsCompleteFloatfFloat例如：fPriceFunctionfnFunction例如：fnHandler正则表达式reRegExp例如：reEmailCheck**05-js语句和注释***每条语句结束End英文带分号*变量属性函数的名字尽量清楚*单行注释*win系统：ctrl+/*Mac系统：command+/*多行注释*win系统：alt+shift+a*mac系统：option+shift+a**06-js函数定义***无参数Function*\[AppleScript\]_纯文本视图__复制代码_[?](http://bbs.itheima.com/#)12345`functionfnTest``(``)``{``alert``(``'你好'``)``;``}``/``/``函数调用``/``执行``fnTest``(``)``;`*是参数函数*\[AppleScript\]_纯文本查看__复制代码_[?](http://bbs.itheima.com/#)1234`functionfnResult``(``a``,``b``)``{``return``a``+``b;``}``var``result``=``fnResult``(``1``,``2``)``;`**return**关键字的作用：1.返回函数中的值或对象2.结束操作function***07-Functionpre-parsing***变量预解析：*如果先使用变量，则后面写变量声明，此时变量值未定义*函数预解析：*如果先写执行，再写函数定义，系统会执行检查代码，可以调用**08-条件语句***"=="js默认会转换数据类型，将数据类型转换为统一类型再比较"==="不会转换数据类型，如果类型不同，则不等于"&&"如果为假，则为假，只要有一个条件不为真，则这不会是真的*“||”为真则为真，只要有一个条件为真，则为真*“！”InverttruetofalseFalsetotrue*\[AppleScript\]_plaintextview__copycode_[?](http://bbs.itheima.com/#)1234`if``(``条件``1``)``{``}``elseif``(``Condition``2``)``{``}``else``{``}`***\-获取元素标签***\[AppleScript\]_纯文本视图__复制代码_[?](http://bbs.itheima.com/#)123456`/``/``1.``等到``窗口``加载窗口以获取标签``window``.onload``=``function``(``)``{``/``/``1.1``获取div的``id````1``label``varoDiv``=``document``.getElementById``(``"div1"``)``;``/``/``validation``alert``(``oDiv``)``;`***读写元素标签属性***js中使用的css样式属性是去掉属性中间的-后面单词的首字母*\[AppleScript\]_纯文本查看__复制代码_[?](http://bbs.itheima.com/#)123`使用点语法读写属性``class``属性在js中应该写成className``background``在css-``color在js中应该写成backgroundColor**属性的值是什么类型，可以放光标放到属性上看提示**11-标签包裹的内容***\[AppleScript\]_纯文本查看__复制代码_[?](http://bbs.itheima.com/#)1`-``innerHTML修改标签内容`***匿名函数***如果这个函数只使用一次，并且在事件触发后执行，可以简化为匿名函数'没有名字的函数'*一个单独的匿名函数Error*匿名函数必须赋值给一个变量或属性*onclick监听按钮的点击事件，当按钮被点击时调用该方法**13-网页换肤案例***\[AppleScript\]_纯文本查看__复制代码_[?](http://bbs.itheima.com/#)010203040506070809101112131415`<``linkrel``=``"stylesheet"``href``=``"./css/skin01.css"``id``=``"link01"``>``<``script``>``window``.onload``=``function``(``)``{``varoLink``=``document``.getElementById``(``'link``01``'``)``,``oBtn``01``=``document``.getElementById``(``'btn``01``'``)``,``oBtn``02``=``document``.getElementById``(``'btn``02``'``)``;``oBtn``01.``onclick``=``function``(``)``{``/``/``修改链接标签的href属性``oLink.href``=``'css``/``skin``01.``css';``}``oBtn``02.``onclick``=``function``(``)``{``o链接。href``=``'css``/``skin``02.``css';``}``}``<``/``script``>`***打印名片***\[苹果脚本\]_纯文本查看__复制代码_[?](http://bbs.iheima.com/#)12345678`if``(``oInput``01.``value```=``=``''||oInput``02.``value``=``=``''||oInput``03.``value``=``=``''||oInput``04.``value``=``=``''||oInput``05.``value``=``=``''||oInput``06.``value```=``=``''``)``{``alert``(``"请输入一些东西！"``)``;``return``;``}``/``/``替换``class``修改样式``<``!``--+也可以运行它可用于连接字符串。如果要操作，必须保证两边都是数字类型，否则会拼接字符串-->``varsClassName``=``'idcard``0``'``+``(``parseInt``(``oInput``07.``value``)``+``1``)``;``oCard_wrap.className``=``sClassName;`
