您现在的位置是:首页 > IT分类 > html+js网站首页html+jsjs基础知识大盘点

js基础知识大盘点

  • 蓝天
  • html+js
  • 2020-07-30 10:04:45
简介JavaScript
特点:
1.JavaScript主要用来向HTML页面中添加交互行为。 JavaScript是一种脚本语言,语法和java类似 javaScript一般用来编写客户端脚本 JavaScript是一种解释性语

JavaScriptZSg蓝天个人博客-一个自学的好博客
特点:ZSg蓝天个人博客-一个自学的好博客
一.JavaScript主要用来向HTML页面中添加交互行为。ZSg蓝天个人博客-一个自学的好博客

  • JavaScript是一种脚本语言,语法和java类似
  • javaScript一般用来编写客户端脚本
  • JavaScript是一种解释性语言,边执行边解释。

二.JavaScript的组成ZSg蓝天个人博客-一个自学的好博客
由核心语法(ECMAScript)、浏览器对象模型(BOM)、文档对象模型(DOM)ZSg蓝天个人博客-一个自学的好博客
ZSg蓝天个人博客-一个自学的好博客
三.JavaScript的基本结构ZSg蓝天个人博客-一个自学的好博客
语法:<script type= " text/javascript " >ZSg蓝天个人博客-一个自学的好博客
<!--ZSg蓝天个人博客-一个自学的好博客
// JavaScript 代码ZSg蓝天个人博客-一个自学的好博客
//-->ZSg蓝天个人博客-一个自学的好博客
</script>ZSg蓝天个人博客-一个自学的好博客
注:(1)”<!-- -->”部分是非必须的,为了规避老版本浏览器不识别ZSg蓝天个人博客-一个自学的好博客
       (2)“//”是 JavaScript 的注释符号(/**/也是注释符号),它会阻止 JavaScript 编译器对这一行的编译ZSg蓝天个人博客-一个自学的好博客
       (3)type属性不推荐写成 language= " javascript " ,不符合XHMLT1.0ZSg蓝天个人博客-一个自学的好博客
ZSg蓝天个人博客-一个自学的好博客
四. 引用JavaScript的3种方式ZSg蓝天个人博客-一个自学的好博客

  1. HTML标签中引用
  2. <script>标签中直接书写
  3. 通过<script>标签的src属性引入外部JS文件

五.常用的输入、输出、确定ZSg蓝天个人博客-一个自学的好博客

1.alert()ZSg蓝天个人博客-一个自学的好博客
alert("提示信息"); //提示信息框ZSg蓝天个人博客-一个自学的好博客

2.prompt()ZSg蓝天个人博客-一个自学的好博客
prompt("提示信息", "输入框的默认信息");ZSg蓝天个人博客-一个自学的好博客
prompt("请输入姓名", "张三");ZSg蓝天个人博客-一个自学的好博客
prompt("请输入姓名");ZSg蓝天个人博客-一个自学的好博客

3.confirm()ZSg蓝天个人博客-一个自学的好博客
confirm("确认信息?"); //确定则返回true,取消则返回falseZSg蓝天个人博客-一个自学的好博客

六.javaScript的基本语法ZSg蓝天个人博客-一个自学的好博客
1.注释ZSg蓝天个人博客-一个自学的好博客

JavaScript的注释方法,与Java一致ZSg蓝天个人博客-一个自学的好博客
<script type="text/javascript">ZSg蓝天个人博客-一个自学的好博客
//单行注释, // 开头用于注释单行ZSg蓝天个人博客-一个自学的好博客
/ZSg蓝天个人博客-一个自学的好博客
以 / 开头, / 结束,用于多行注释 ;与JAVA一致ZSg蓝天个人博客-一个自学的好博客
/ZSg蓝天个人博客-一个自学的好博客
document.write("请合理使用注释"); //作该行代码的注释ZSg蓝天个人博客-一个自学的好博客
window.alert("我是确认框"); / 同样可以是多行注释 /ZSg蓝天个人博客-一个自学的好博客
</script>ZSg蓝天个人博客-一个自学的好博客

2.变量声明和使用ZSg蓝天个人博客-一个自学的好博客

JavaScript的变量ZSg蓝天个人博客-一个自学的好博客
JavaScript变量用于保存值、保存表达式ZSg蓝天个人博客-一个自学的好博客
注:1、由于 JavaScript 对大小写敏感,变量名也对大小写敏感 (y 和 Y 是两个不同的变量)ZSg蓝天个人博客-一个自学的好博客
       2、变量必须以字母或下划线或美元符$开始 ,不能使用关键字作为变量名ZSg蓝天个人博客-一个自学的好博客

语法://JS的变量声明 ,是通过 var 语句来声明的,无需指定数据类型ZSg蓝天个人博客-一个自学的好博客
var num = 10 ;ZSg蓝天个人博客-一个自学的好博客
var str = "JavaScript" ;ZSg蓝天个人博客-一个自学的好博客
//当然也可声明多个,之间用逗号隔开ZSg蓝天个人博客-一个自学的好博客

var num =10 ,ZSg蓝天个人博客-一个自学的好博客
str = "JavaScript";ZSg蓝天个人博客-一个自学的好博客
//省略 var 语句,直接变量声明ZSg蓝天个人博客-一个自学的好博客
num = 100; //相当于window.num = 100; (不推荐)ZSg蓝天个人博客-一个自学的好博客
注意:1、 如声明多个采用第二种方式是较为高效的ZSg蓝天个人博客-一个自学的好博客
2、每个代码后面的“;”是可省的,建议都写上(为什么呢?)ZSg蓝天个人博客-一个自学的好博客
变量的使用ZSg蓝天个人博客-一个自学的好博客

建议先定义后使用ZSg蓝天个人博客-一个自学的好博客

  • 运算符用于把文本值或字符串变量加起来(连接起来),如果是两个数字则为数学运算加号= 运算符用于给变量赋值,变量可以重复赋不同类型的值

3.数据类型ZSg蓝天个人博客-一个自学的好博客
Undefined 1、Undefined 类型只有一个值,即 undefinedZSg蓝天个人博客-一个自学的好博客
2、未定义或定义未赋值ZSg蓝天个人博客-一个自学的好博客

Null 表示尚未存在的对象,与undefined值相等
Number var iNum=23; //整数ZSg蓝天个人博客-一个自学的好博客
var iNum=23.0; //浮点数
BooleanZSg蓝天个人博客-一个自学的好博客
String 一组被引号(单引号或双引号)括起来的文本ZSg蓝天个人博客-一个自学的好博客
var string1="This is a string";

4.运算符ZSg蓝天个人博客-一个自学的好博客

  • typeof检测变量的返回值,为字符串类型
  • typeof运算符返回值如下:
  • undefined:变量被声明后,但未被赋值
  • string:用单引号或双引号来声明的字符串
  • boolean:true或false
  • number:整数或浮点数
  • function:函数方法
  • object:对象 或 数组 或 Null 类型

数据类型转换ZSg蓝天个人博客-一个自学的好博客

  • 转换函数
  • parseInt()
  • parseFloat()
  • toString()
  • 强制类型转换
  • Boolean()
  • Number()
  • String()

5.逻辑控制符ZSg蓝天个人博客-一个自学的好博客
6.流程控制语句ZSg蓝天个人博客-一个自学的好博客

分类:ZSg蓝天个人博客-一个自学的好博客
while,do…while,for,for…inZSg蓝天个人博客-一个自学的好博客
区别ZSg蓝天个人博客-一个自学的好博客
while:先判断后执行ZSg蓝天个人博客-一个自学的好博客
do…while:先执行后判断,至少执行一次ZSg蓝天个人博客-一个自学的好博客
for:先判断,再执行ZSg蓝天个人博客-一个自学的好博客
for…in:遍历对象成员ZSg蓝天个人博客-一个自学的好博客
使用场景ZSg蓝天个人博客-一个自学的好博客
不知道循环次数,通常选择while或do…whileZSg蓝天个人博客-一个自学的好博客
知道循环次数,通常选择for循环ZSg蓝天个人博客-一个自学的好博客

7.语法规则ZSg蓝天个人博客-一个自学的好博客

  • 代码区分大小写
  • 变量、对象和函数的名称有意义,最好使用驼峰式命名
  • 句尾的分号最好不要省略

ZSg蓝天个人博客-一个自学的好博客
七.JavaScript中的函数定义ZSg蓝天个人博客-一个自学的好博客

JavaScript中的函数ZSg蓝天个人博客-一个自学的好博客
一组可以随时随地运行的语句ZSg蓝天个人博客-一个自学的好博客
将脚本编写为函数以避免页面载入时执行该脚本ZSg蓝天个人博客-一个自学的好博客
分类ZSg蓝天个人博客-一个自学的好博客
系统函数ZSg蓝天个人博客-一个自学的好博客
自定义函数ZSg蓝天个人博客-一个自学的好博客

ZSg蓝天个人博客-一个自学的好博客
八.系统函数ZSg蓝天个人博客-一个自学的好博客

函数名称 描述ZSg蓝天个人博客-一个自学的好博客
parseInt() 解析一个字符串并返回一个整数ZSg蓝天个人博客-一个自学的好博客
parseFloat() 解析一个字符串并返回一个浮点数ZSg蓝天个人博客-一个自学的好博客
isNaN() 检查某个值是否是数字,返回true | falseZSg蓝天个人博客-一个自学的好博客
eval() 计算 JavaScript 字符串,并把它作为脚本代码来执行ZSg蓝天个人博客-一个自学的好博客

ZSg蓝天个人博客-一个自学的好博客
九.自定义函数ZSg蓝天个人博客-一个自学的好博客

语法:ZSg蓝天个人博客-一个自学的好博客
function 函数名 ( 参数1,参数2,…. )ZSg蓝天个人博客-一个自学的好博客
{ZSg蓝天个人博客-一个自学的好博客
//函数代码块ZSg蓝天个人博客-一个自学的好博客
}ZSg蓝天个人博客-一个自学的好博客
ZSg蓝天个人博客-一个自学的好博客
var 函数名 = function (参数1,参数2,…. )ZSg蓝天个人博客-一个自学的好博客
{ZSg蓝天个人博客-一个自学的好博客
//函数代码块ZSg蓝天个人博客-一个自学的好博客
}ZSg蓝天个人博客-一个自学的好博客
传入的参数是可选的ZSg蓝天个人博客-一个自学的好博客

ZSg蓝天个人博客-一个自学的好博客
十. 如何调用函数ZSg蓝天个人博客-一个自学的好博客

函数可以通过其名字加上括号中的参数进行调用ZSg蓝天个人博客-一个自学的好博客
//自定义函数调用ZSg蓝天个人博客-一个自学的好博客
function sayHello(name){ZSg蓝天个人博客-一个自学的好博客
alert( name + "说了句hello。" );ZSg蓝天个人博客-一个自学的好博客
}ZSg蓝天个人博客-一个自学的好博客
sayHello("Tom");ZSg蓝天个人博客-一个自学的好博客
//函数变量的调用ZSg蓝天个人博客-一个自学的好博客
var sayHello = function(name){ZSg蓝天个人博客-一个自学的好博客
alert( name + "说了句hello。" );ZSg蓝天个人博客-一个自学的好博客
}ZSg蓝天个人博客-一个自学的好博客
sayHello(" Tom ");ZSg蓝天个人博客-一个自学的好博客

十一.匿名函数ZSg蓝天个人博客-一个自学的好博客
//传统的定义函数方式ZSg蓝天个人博客-一个自学的好博客
var fn = function (){ZSg蓝天个人博客-一个自学的好博客
alert(12345);ZSg蓝天个人博客-一个自学的好博客
}ZSg蓝天个人博客-一个自学的好博客
fn();ZSg蓝天个人博客-一个自学的好博客
//函数体替换fnZSg蓝天个人博客-一个自学的好博客
(function() {ZSg蓝天个人博客-一个自学的好博客
alert(12345);ZSg蓝天个人博客-一个自学的好博客
})();ZSg蓝天个人博客-一个自学的好博客
10.2函数如何返回值ZSg蓝天个人博客-一个自学的好博客
通过 return 关键字返回函数的值ZSg蓝天个人博客-一个自学的好博客
与 Java 一样,函数在执行过 return 语句后立即停止代码。因此,return 语句后的代码都不会被执行ZSg蓝天个人博客-一个自学的好博客
11.事件ZSg蓝天个人博客-一个自学的好博客
JavaScript侦测到的行为ZSg蓝天个人博客-一个自学的好博客
事件举例:ZSg蓝天个人博客-一个自学的好博客

  1.  鼠标点击
  2. 页面或图像载入
  3. 鼠标悬浮于页面的某个热点之上
  4. 在表单中选取输入框
  5. 表单提交
  6. 键盘按键

事件通常与函数配合使用,当事件发生时去调用函数ZSg蓝天个人博客-一个自学的好博客
11.1常用的事件ZSg蓝天个人博客-一个自学的好博客
事件名称 描述ZSg蓝天个人博客-一个自学的好博客

  • onload 和 onunload 当用户进入或离开页面时就会触发 onload 和 onunload 事件
  • onfocus, onblur 和 onchange 主要与form表单里的文本域或下拉框配合使用
  • onsubmit form 表单提交时发生
  • onmouseover 和 onmouseout 鼠标移至对象上和离开时发生
  • onclick和ondbclick 对象被点击/双击时发生

BOM浏览器对象模型ZSg蓝天个人博客-一个自学的好博客

  1. Window对象ZSg蓝天个人博客-一个自学的好博客
    常用属性ZSg蓝天个人博客-一个自学的好博客
    history 有关客户访问过的URL的信息ZSg蓝天个人博客-一个自学的好博客
    location 有关当前URL的信息ZSg蓝天个人博客-一个自学的好博客
    screen 有关客户端的屏幕和显示性能的信息ZSg蓝天个人博客-一个自学的好博客
    常用方法ZSg蓝天个人博客-一个自学的好博客
    prompt() 显示可提示用户输入的对话框ZSg蓝天个人博客-一个自学的好博客
    alert() 显示带有一段信息和一个确认按钮的警告框ZSg蓝天个人博客-一个自学的好博客
    confirm() 确认按钮和取消按钮的对话框ZSg蓝天个人博客-一个自学的好博客
    close() 关闭浏览器窗口ZSg蓝天个人博客-一个自学的好博客
    open() 打开新的浏览器窗口ZSg蓝天个人博客-一个自学的好博客
    setTimeout() 用于在指定的时间调用或计算表达式ZSg蓝天个人博客-一个自学的好博客
    setInterval() 按照指定的周期调用或计算表达式

setInterval( fn,millisec )方法ZSg蓝天个人博客-一个自学的好博客
可按照指定的周期(以毫秒计)来调用函数或计算表达式,循环执行多次。ZSg蓝天个人博客-一个自学的好博客
setTimeout( fn,millisec )方法ZSg蓝天个人博客-一个自学的好博客
用于在指定的毫秒数后调用函数或计算表达式,只执行一次。ZSg蓝天个人博客-一个自学的好博客
Window对象的常用事件ZSg蓝天个人博客-一个自学的好博客
Onload 一个页面或一幅图像完成加载ZSg蓝天个人博客-一个自学的好博客
Onmouseover 鼠标指针移到某元素之上ZSg蓝天个人博客-一个自学的好博客
Onclick 点击某个对象ZSg蓝天个人博客-一个自学的好博客
Onkeydown 某个键盘按键被按下ZSg蓝天个人博客-一个自学的好博客
onchange 域的内容被改变ZSg蓝天个人博客-一个自学的好博客

  1. History对象ZSg蓝天个人博客-一个自学的好博客
    常用方法ZSg蓝天个人博客-一个自学的好博客
    Back () 加载history对象上一个URLZSg蓝天个人博客-一个自学的好博客
    Forward() 加载history对象下一个URLZSg蓝天个人博客-一个自学的好博客
    Go() 加载history对象某具体URLZSg蓝天个人博客-一个自学的好博客

  2. Location对象ZSg蓝天个人博客-一个自学的好博客
    Location对象的属性ZSg蓝天个人博客-一个自学的好博客
    Host 设置或返回主机名ZSg蓝天个人博客-一个自学的好博客
    Hostname 设置或返回当前URL的主机名ZSg蓝天个人博客-一个自学的好博客
    href 设置或返回完整的URL

常用的方法ZSg蓝天个人博客-一个自学的好博客
Reload() 重新加载当前文档ZSg蓝天个人博客-一个自学的好博客
Replace() 用新的文档代替当前文档ZSg蓝天个人博客-一个自学的好博客

  1. Document对象ZSg蓝天个人博客-一个自学的好博客
    Ref errerZSg蓝天个人博客-一个自学的好博客
    返回载入当前文档的URLZSg蓝天个人博客-一个自学的好博客
    URL 返回当前文档的URL

常用方法ZSg蓝天个人博客-一个自学的好博客

getElementByld() 返回对拥有指定id的第一个对象的引用ZSg蓝天个人博客-一个自学的好博客
getElementsByName() 返回带有指定名称的对象的集合ZSg蓝天个人博客-一个自学的好博客
getElementsByTagName() 返回带有指定标签名的对象的集合ZSg蓝天个人博客-一个自学的好博客
Write() 向文档写文本、HTML表达式ZSg蓝天个人博客-一个自学的好博客

JavaScript内置对象ZSg蓝天个人博客-一个自学的好博客

  1. Date对象ZSg蓝天个人博客-一个自学的好博客
    语法:ZSg蓝天个人博客-一个自学的好博客
    Var 日期实例 = newDate(参数);ZSg蓝天个人博客-一个自学的好博客
    常用方法ZSg蓝天个人博客-一个自学的好博客
    getDate() 返回 Date 对象的一个月中的每一天,其值介于1~31之间ZSg蓝天个人博客-一个自学的好博客
    getDay() 返回 Date 对象的星期中的某一天,其值介于0~6之间ZSg蓝天个人博客-一个自学的好博客
    getHours() 返回 Date 对象的小时数,其值介于0~23之间ZSg蓝天个人博客-一个自学的好博客
    getMinutes() 返回 Date 对象的分钟数,其值介于0~59之间ZSg蓝天个人博客-一个自学的好博客
    getSeconds() 返回 Date 对象的秒数,其值介于0~59之间
  2. 定时函数ZSg蓝天个人博客-一个自学的好博客

  3. DOMZSg蓝天个人博客-一个自学的好博客
    3.1DOM节点

3.1.1访问节点ZSg蓝天个人博客-一个自学的好博客

常用方法ZSg蓝天个人博客-一个自学的好博客
getElementByld() 返回对拥有指定id的第一个对象的引用ZSg蓝天个人博客-一个自学的好博客
getElementsByName() 返回带有指定名称的对象的集合ZSg蓝天个人博客-一个自学的好博客
getElementsByTagName() 返回带有指定标签名的对象的集合ZSg蓝天个人博客-一个自学的好博客
使用层次关系访问节点ZSg蓝天个人博客-一个自学的好博客
ParentNode:返回节点的父节点ZSg蓝天个人博客-一个自学的好博客
FirstChild:返回节点的首个子节点ZSg蓝天个人博客-一个自学的好博客
LastChild:返回节点的最后一个子节点ZSg蓝天个人博客-一个自学的好博客

3.1.2操作节点属性值ZSg蓝天个人博客-一个自学的好博客

getAttribute(“属性名”):获取属性值ZSg蓝天个人博客-一个自学的好博客
setAttribute(“属性名”,“属性值”):设置属性值ZSg蓝天个人博客-一个自学的好博客
3.1.3创建节点ZSg蓝天个人博客-一个自学的好博客
方法名称名名称名称名称 说明说嘛说说明明说明说 明ZSg蓝天个人博客-一个自学的好博客
createElement( tagName) 创建一个名为tagName的新元素节点ZSg蓝天个人博客-一个自学的好博客
ANode.appendChild( BNode) 把B节点追加至A节点的末尾ZSg蓝天个人博客-一个自学的好博客
insertBefore( ANode,BNode ) 把A节点插入到B节点之前ZSg蓝天个人博客-一个自学的好博客
Node.cloneNode(deep) deep为true则复制该节点以及该节点的所有子节点,为false则只复制该节点和其属性ZSg蓝天个人博客-一个自学的好博客

3.1.4删除或替换节点ZSg蓝天个人博客-一个自学的好博客
方法 说 明ZSg蓝天个人博客-一个自学的好博客
removeChild( node) 删除指定的节点ZSg蓝天个人博客-一个自学的好博客
replaceChild( newNode, oldNode) 用newNode来替换oldNodeZSg蓝天个人博客-一个自学的好博客

  1. DOM操作表格ZSg蓝天个人博客-一个自学的好博客
    HTML DOMZSg蓝天个人博客-一个自学的好博客
    a) 其特性和方法是专门针对HTML文档的ZSg蓝天个人博客-一个自学的好博客
    b) HTML文档中的每个节点都是一个对象ZSg蓝天个人博客-一个自学的好博客
    c) 通过对象的方法和属性来操作节点ZSg蓝天个人博客-一个自学的好博客
    d) HTML DOM包括:ZSg蓝天个人博客-一个自学的好博客
    Table 对象ZSg蓝天个人博客-一个自学的好博客
    Document 对象ZSg蓝天个人博客-一个自学的好博客
    Form 对象ZSg蓝天个人博客-一个自学的好博客
    Image 对象

4.1Table 对象ZSg蓝天个人博客-一个自学的好博客

Table 对象代表一个 HTML 表格ZSg蓝天个人博客-一个自学的好博客
<table> 标签对应一个 Table 对象的创建ZSg蓝天个人博客-一个自学的好博客
对象集合ZSg蓝天个人博客-一个自学的好博客
1.rows[]返回表格中所有行的一个数组ZSg蓝天个人博客-一个自学的好博客
2.cells[]返回包含表格中所有单元格的一个数组ZSg蓝天个人博客-一个自学的好博客
分析:ZSg蓝天个人博客-一个自学的好博客
1、获取该表格对象ZSg蓝天个人博客-一个自学的好博客
2、通过rows[]得到所有的行ZSg蓝天个人博客-一个自学的好博客
3、通过cells[]得到所有的单元格ZSg蓝天个人博客-一个自学的好博客

方法ZSg蓝天个人博客-一个自学的好博客
insertRow( index )ZSg蓝天个人博客-一个自学的好博客
用于在表格的指定位置插入新行ZSg蓝天个人博客-一个自学的好博客
deleteRow( index )ZSg蓝天个人博客-一个自学的好博客
用于删除表格中指定的行ZSg蓝天个人博客-一个自学的好博客
分析:ZSg蓝天个人博客-一个自学的好博客
1.获取表格对象ZSg蓝天个人博客-一个自学的好博客
2.使用insertRow() 插入ZSg蓝天个人博客-一个自学的好博客
3.使用deleteRow() 删除ZSg蓝天个人博客-一个自学的好博客

4.2TableRow对象的属性和方法ZSg蓝天个人博客-一个自学的好博客

属性对象集合ZSg蓝天个人博客-一个自学的好博客
cells[]ZSg蓝天个人博客-一个自学的好博客
返回包含该行中所有的单元格的一个数组ZSg蓝天个人博客-一个自学的好博客
 方法ZSg蓝天个人博客-一个自学的好博客
insertCell(index)ZSg蓝天个人博客-一个自学的好博客
在一行中的指定位置插入一个空的 <td> 元素ZSg蓝天个人博客-一个自学的好博客
deleteCell(index)ZSg蓝天个人博客-一个自学的好博客
删除行中的指定的单元格ZSg蓝天个人博客-一个自学的好博客

4.3TableCell 对象ZSg蓝天个人博客-一个自学的好博客

TableCell 对象代表一个 HTML 表格单元格ZSg蓝天个人博客-一个自学的好博客
属性ZSg蓝天个人博客-一个自学的好博客
cellIndex:单元格在某行的单元格集合中的位置ZSg蓝天个人博客-一个自学的好博客
innerHTML:设置或返回单元格的开始标签和结束标签之间的 HTMLZSg蓝天个人博客-一个自学的好博客
align:设置或返回单元格内部数据的水平排列方式ZSg蓝天个人博客-一个自学的好博客
className:设置或返回元素的class属性ZSg蓝天个人博客-一个自学的好博客

  1. 数组ZSg蓝天个人博客-一个自学的好博客
    5.1创建数组ZSg蓝天个人博客-一个自学的好博客
    语法:ZSg蓝天个人博客-一个自学的好博客
    Var 数组名称 = new Array(size);ZSg蓝天个人博客-一个自学的好博客
    5.2数组的赋值ZSg蓝天个人博客-一个自学的好博客
    先声明后赋值ZSg蓝天个人博客-一个自学的好博客
    声明时同时初始化ZSg蓝天个人博客-一个自学的好博客
    5.3操作数组ZSg蓝天个人博客-一个自学的好博客
    1)单个读取ZSg蓝天个人博客-一个自学的好博客
    数组对象名[数组下标]ZSg蓝天个人博客-一个自学的好博客
    2)循环读取ZSg蓝天个人博客-一个自学的好博客
    For….in….

5.31Array对象的属性和方法ZSg蓝天个人博客-一个自学的好博客

属性length:设置或返回数组中元素的数目ZSg蓝天个人博客-一个自学的好博客
方法:ZSg蓝天个人博客-一个自学的好博客
Join():把数组的所有的元素放入一个字符串中,通过一个分隔符进行分隔ZSg蓝天个人博客-一个自学的好博客
Sort():对数组进行排序。ZSg蓝天个人博客-一个自学的好博客
5.4 使用下拉列表框对象selectZSg蓝天个人博客-一个自学的好博客
事件 onchange 当改变选项调用的事件ZSg蓝天个人博客-一个自学的好博客
方法 add() 向下拉列表框中的添加一个选项ZSg蓝天个人博客-一个自学的好博客
属性 options[] 返回包括下拉列表框中的所有选项的一个数组ZSg蓝天个人博客-一个自学的好博客
SelectedIndex 设置或返回下拉列表框中被选项目的索引号ZSg蓝天个人博客-一个自学的好博客
Length 返回下拉列表框中选项的数目ZSg蓝天个人博客-一个自学的好博客

5.5 Option对象的常用属性ZSg蓝天个人博客-一个自学的好博客

Text(): 设置或返回某个选项的纯文本值ZSg蓝天个人博客-一个自学的好博客
Value():设置或返回被送往服务器的值ZSg蓝天个人博客-一个自学的好博客
6.JavaScript访问样式的常用方法ZSg蓝天个人博客-一个自学的好博客
1.style属性ZSg蓝天个人博客-一个自学的好博客
2.className属性ZSg蓝天个人博客-一个自学的好博客
3.display属性ZSg蓝天个人博客-一个自学的好博客
7.访问样式的应用ZSg蓝天个人博客-一个自学的好博客
实现思路:ZSg蓝天个人博客-一个自学的好博客
1.把广告图片放在一个div中,并且div总是显示在页面的上方ZSg蓝天个人博客-一个自学的好博客
2.使用getElementByld()方法获取层对象,并且获取层在页面上的初始位置。ZSg蓝天个人博客-一个自学的好博客
3.根据鼠标滚动事件,获取滚动条滚动的距离。ZSg蓝天个人博客-一个自学的好博客
4.随着滚动条的移动改变层在页面上的位置。ZSg蓝天个人博客-一个自学的好博客

7.1 获取样式属性值ZSg蓝天个人博客-一个自学的好博客

Position属性ZSg蓝天个人博客-一个自学的好博客
属性 说明ZSg蓝天个人博客-一个自学的好博客
Top 设置元素的顶边缘距离父元素顶边缘的上下面的距离ZSg蓝天个人博客-一个自学的好博客
Left 设置元素的左边缘距离父元素左边缘的左右面的距离ZSg蓝天个人博客-一个自学的好博客
Right 设置元素的右边缘距离父元素右边缘的左右面的距离ZSg蓝天个人博客-一个自学的好博客
Bottom 设置元素的低边缘距离父元素低边缘的上下面的距离ZSg蓝天个人博客-一个自学的好博客
zIndex 设置元素的堆叠次序ZSg蓝天个人博客-一个自学的好博客

注:在实际工作中,通常是样式和内容相分离,一般把设置层的样式放在内部样式表或外部样式表,所以常用currentStyle对象获取。ZSg蓝天个人博客-一个自学的好博客

7.2获取鼠标滚动 的距离ZSg蓝天个人博客-一个自学的好博客

1.scrollTop、scrollLeft属性ZSg蓝天个人博客-一个自学的好博客
属性 说明ZSg蓝天个人博客-一个自学的好博客
ScrollTop 设置或获取位于对象的最顶端,内容的最顶端的之间的距离ZSg蓝天个人博客-一个自学的好博客
scrollLeft 设置或获取位于对象的最左端,内容的最左端的之间的距离ZSg蓝天个人博客-一个自学的好博客
ClientWidth 对象的宽度,会随着窗口改变ZSg蓝天个人博客-一个自学的好博客
clientHeight 对象的高度ZSg蓝天个人博客-一个自学的好博客
语法:document.documentElement.scrollTop;ZSg蓝天个人博客-一个自学的好博客
2.页面事件ZSg蓝天个人博客-一个自学的好博客
Onscroll 用于捕捉页面垂直 水平的移动ZSg蓝天个人博客-一个自学的好博客
Onload 一个页面或一幅图片完成加载ZSg蓝天个人博客-一个自学的好博客

以上来源于:https://www.imooc.com/article/13960

转载: 感谢您对蓝天个人博客网站平台的认可,非常欢迎各位朋友分享到个人站长或者朋友圈,但转载请说明文章出处“来源蓝天个人博客 http://www.along168.cn”。

上一篇:CSS:常用CSS总结

下一篇:CSS工作原理

文章评论

联系方式