javascript、jquery让我页面动起来吧

来源：互联网发布：网络视频地址mp4测试编辑：程序博客网时间：2024/06/07 22:22

JavaScript——网络的脚本语言

位置：<head><script></script></head>

在页面上的输出：document.write("要输出内容");

消息对话框：

（1）确认：confirm（str）//str对话框中要显示的文本

返回值： “确定”= true “取消” = false

（2）提问： prompt（str1，str2）//str1显示在对话框中的文本，不可修改，str2文本框中内容，可修改

返回值： “确定”=文本框内容 “取消” =null

（3）警告：alert（str）;//提示信息，不点”确定“就不能继续对网页进行操作

一、变量：

【命名规则】不能以数字开头，不能以（除$、_特殊符号外）符号开头，建议用字母开头

区分大小写，中间不可以用（除$、_特殊符号外）特殊符号

不能使用关键字和保留字做变量名

变量类型： var a ; //a可以是很多类型，数字、boolean、字符串、数组、对象、undefined

运算符：

（1）算术运算符：加 + 减 - 乘 * 除 / 取余 % 递增 ++ 递减 --

（2）赋值运算符：等于= +=（x+=y : x=x+y） -=(x-=y : x=x-y) *=(x*=y : x=x*y) /=(x/=y : x=x/y) %=(x%=y : x=x%y)

（3）比较运算符：等于 == 全等 ===（值和类型）不等于！= 大于> 小于< 大于等于>= 小于等于<=

（4）逻辑运算符：与 && 或 || 非！

二、DOM：

1.查找元素：

根据元素id查找元素：

document.getElementById（"boxId"）;

根据标签名查找元素：

document.getElementsByTagName（"p"）;

2.改变html内容：

<h1 id="txt1">Hello World</h1>

document.getElementById（"txt1"）.innerHTML="I love JavaScript";

3.改变html属性：

document.getElementById（"btn1"）.type = "text";

4.改变html样式：

document.getElementById（"p1"）.style.color="red"; //改变p标签内容颜色为红色

document.getElementById（"p1"）.style.visibility = //hidden 为隐藏元素，visible为显示

5.事件：

鼠标点击事件 onclick

鼠标滑过事件 onMouseOver

鼠标移出事件 onMouseOut

文本框内容改变事件 onChange

文本框内容选中事件 onSelect

光标放到文本框上 onFoucs

光标离开文本框 onBlur

加载事件 onload 离开页面 unload

表单提交事件 onSubmit //表单提交时做验证，可阻止提交

6.添加/删除元素

var tab = document.getElementById（"tab1"）;

var newTr = document.createElement（"tr"）; //创建新的行标签tr

var newTd1 = document.createElement（"td"）; //创建新的列标签td

var newTd = document.createElemet（"td"）;var newTd2 = document.createElement（"td"）；

newTr.appendChild（"newTd1"）；//将列标签td追加到tr上

newTr.appendChild（"newTd1"）；newTr.appendChild（"newTd2"）；

tab.appendChild（"newTr"）； //将新创建的tr追加到已有元素上

三、对象

内置对象：

1. 将文本转换成大写： toUpperCase（）

2. 字符串String对象：

（1）将大写字母都变小写： toLowerCase（）

（2）返回指定位置的字符： charAt（index）//index指定位置

（3）某个指定字符在字符串中出现的位置： indexOf（str，start）//str指定字符/字符串；start从什么位置开始

（4）分割字符串： split（str，num）//str分割的标志若为空串则每个字符都分开；num分出的组数

（5）提取字符串： substring（start，stop）//start开始位置；stop结束位置

（6）计算字符串长度： length（）

3.时间对象：

（1）返回当日时间： Date（）

（2）返回从 1970 年 1 月 1 日至今的毫秒数： getTime（）

（3）设置具体日期：

var d = new Date（）;

d.setFullYear（2013,9,8）;

（4）将当前日期转换成字符串： setUTCString（）

（5）获取星期： getDay（）

4.数组对象：

创建数组：

（1）var myarr = new Array（）; //可以在括号里写数组长度，也可以不写

（2）var myarr = new Array（"aa","bb","cc"）；

遍历数组：

var x；

var myarr = new Array（"aa","bb","cc"）;

for（x in myarr）{

alert（x）；

}

指定分隔符连接数组：

var arr1 = new Array（"aa"，"bb"，"cc"）；

arr1.join（）;

输出结果： aa，bb，cc

arr1.join（"."）;

输出结果： aa.bb.cc

对数组排序：

文字排序：sort（） //按首字母的A~Z排序

数字排序：sort（）

5.Math对象：

四舍五入： Math.round（） //Math.round（3.4）= 3；Math.round（3.6）= 4；Math.round（-4.4）= -4；Math.round（-4.6）= -5

随机数： Math.radom（） //返回 0 ~ 1之间的随机数

两个给定数较大的： Math.max（）两个给定数较小的： Math.min（）

向上取整： Math.ceil（）//Math.ceil（5.4）=6；向下取整： Math.floor（）//Math.floor（6.6）=6；

四、浏览器对象模型：

1.浏览器尺寸：

//IE、Firefox、Chrome、Safair、Opera //对于 Internet Explorer 8、7、6、5

浏览器窗口的内部高度 window.innerHeight document.documentElement.clientHeight document.body.clientHeight

浏览器窗口的内部宽度 window.innerWidth document.documentElement.clientWidth document.body.clientWidth

0 0