您的位置:时时app平台注册网站 > web前端 > javascript彩世界网址

javascript彩世界网址

2019-11-03 04:31

<input type="text" onchange="on_change()">

str1==str2  返回0的值

function IntSort(a,b){

</body>
</html>

节点属性的修改
setAttribute(name,value):给一个节点增加属性,name是属性名,value是属性值
removeAttribute(name):删除节点的属性
getAttribute(name):获取一个节点属性的值

for (var i=1;i<=7;i ){

document.querySelector('#id');
document.querySelector('.class_name'); //querySelector()方法选择的是复合要求的第一个节点对象
document.querySelectorAll(); //选择所有复合规则的节点对象

day13 5随机星星跳过 后期再玩

//第一个数组元素索引为0

<input type="text" onfocus="on_focus()">
<input type="text" onblur="on_blur()">

var str="abcdefg";
var b=str.charAt(3);
document.write(b);

//

//如果我们想在某个子节点的后面插入,其实相当于在该节点的下一个兄弟节点前面插入
var n = c.nextElementSibling;
a.insertBefore(b,n);

复合数据类型:数组(Array)、对象(Object)、函数(Function)

 

//对b进行一系列的设置,如 b.innerHTML = '这里填写想要显示的字符串';b.style.color = 'blue';
a.insertBefore(b,c); //c必须是a的子节点,b将被插到c之前,参数2选填,可以使null

js用处:表单验证、横幅广告(动画效果)、tab标签(鼠标键盘动作)等

                close();

a.onclick = function(){
clearInterval(xxx);
}
b.onclick = function(){
if (confirm('确定?')) {
xxx = setInterval(getMytime,1000);

nodeName:节点的名称
nodeValue:节点的值
firstChild:第一个子节点(存在兼容性问题)
lastChild:最后一个子节点(存在兼容性问题)
childNodes:子节点列表,是一个数组

                   right.appendChild(option);

<!-- 表单 -->
<form action="" onsubmit="return on_submit()" onreset="return on_reset()">
<input type="text" onkeydown="on_keydown()">
<input type="text" onkeypress="on_keypress()">
<input type="text" onkeyup="on_keyup()">

Var arr = new Array();
arr[0] = 10;
arr[1] = [10,20,40]
arr[2] = new Array(); //JS从严格意义上来说只支持一维数组,但它可实现数组元素是数组。不具备完整二维数组的特性,因此必须先创建一个空的数组,然后再添加元素
arr[2][0] = “abc”; //如果没有上边一行,在PHP中是支持的

在 JavaScript 中,这些字母被称为变量。

复制下面的代码到编辑器里,让编辑器自动排版一下格式,效果会好一点,自我感觉我笔记的条理还是比较容易记忆的

注意:shift()、pop()、unshift()、push()它们是直接在原数组进行操作,因此不需要再创建变量
说明:delete只能删除数组元素的值,而所占空间还存在;shift()和pop()删除数组元素后,所占空间不存在。

 

<div style="width:100px;height: 100px;float: left;margin-left: 10px; background-color: red" onclick="on_click()">单击</div>
<div style="width:100px;height: 100px;float: left;margin-left: 10px; background-color: orange" ondblclick="on_dbclick()">双击</div>
<div style="width:100px;height: 100px;float: left;margin-left: 10px; background-color: yellow" onmousemove="on_mousemove()">移动</div>
<div style="width:100px;height: 100px;float: left;margin-left: 10px; background-color: green" onmouseout="on_mouseout()">移出</div>
<div style="width:100px;height: 100px;float: left;margin-left: 10px; background-color: skyblue" onmouseover="on_mouseover()">OVER</div>
<div style="width:100px;height: 100px;float: left;margin-left: 10px; background-color: blue" onmousedown="on_mousedown()">鼠标down</div>
<div style="width:100px;height: 100px;float: left;margin-left: 10px; background-color: purple" onmouseup="on_mouseup()">鼠标up</div>

parseInt(str):在字符串中,从左到右提取整数,如遇到非数字数据,则停止提取;
例如:将一个<div>的宽度增加200px
var width = “100px;”
width = parseInt(width); //结果为100
width = 200; // 300
width = width “px”; //结果为 “300px”
parseFloat(str):在字符串中,从左到右提取浮点数(小数),如遇到非数字数据,则停止提取;
parseFloat(“.3px”); // 0.3
paseFloat(“abc200”); // NaN
parseFloat(“123.09px”); // 123.09
注意:如果要提取的字符串的第一个字符是非数字的,则直接返回NaN。

//结果为"c,d"

<input value="重置2" type="reset">

window.alert("");
</script>

if ( (x==6) || (x==0) ) {

//JS的DOM操作
document.getElementsByClassName('class_name'); //使用类名选择元素,注意是Elements
document.getElementsByTagName('tab_name'); //使用标签名选择元素,也是Elements
document.getElementsByName('name'); //使用名字属性选择
document.getElementById('id_name');

while(条件){
循环体
i ;【变量更新!】
}

比较数字和字符串

//在一个节点中插入一个新节点
var a = document.getElementById('a_name');
var c = document.getElementById('c_name');
var b = document.createElement('div');

createElement(tagName):创建一个指定的标记,如:document.createElement(“img”),注意:标记不加尖括号
createTextNode(text):创建一个文本节点。如:document.createTextNode(“年龄”),注意:这里只能是纯文本
appendChild(node):将一个节点,追加到某个父节点下。追到父节点的最后。
insertBefore(new,current):将一个新节点,追加到当前节点之前。Current当前节点,是已经存在的节点。New是新节点,是刚刚创建的。
removeChild(node):移除一个子节点。

//               ele.onclick=function(){

  • addZero(d.getMonth() 1) '-'
  • addZero(d.getDate()) ''
  • addZero(d.getHours()) ':'
  • addZero(d.getMinutes()) ':'
  • addZero(d.getSeconds());
    }

 

 

//函数:略

isNaN(判断是不是一个数) isIninity
var s="000.000123";
if(isNaN(s)){
alert("不是数");
}else{
alert("是数");
}

for循环基本格式

//从一个节点列表中获取指定索引的节点
document.getElementById('').children.item(0);

NaN = not a number
Infinity = 无穷大
var s="abc";
alert(parseInt(s)); //NaN //parseInt() 把字符串转成int

//var arr1=["a","d","f","c"];

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>JS</title>
<style type="text/css">
*{
margin: 0;
padding: 0;
}
body div{
margin-top: 1000px;
}
</style>
</head>
<body onresize="">

for in 找出数组中有效数据,无效为undefine
Var arr = [45,44,,,,,,32,,,,,,,,,,,,,,,21,333,,,,,,,,,,,432];
//使用for in遍历数组中有效个数
for(var i in arr)
{
document.write(arr[i] " ");
}

onmousedown    鼠标按钮被按下。

d.getHours(); //显示当前时间的小时数
d.getMinutes(); //显示当前时间的分钟数
d.getSeconds(); //显示当前时间的秒数
d.getMilliseconds();//显示当前时间的毫秒

var r=7/0; alert(r); //Infinity

BOM(浏览器对象模型),可以对浏览器窗口进行访问和操作。使用 BOM,开发者可以移动窗口、改变状态栏中的文本以及执行其他与页面内容不直接相关的动作。

//删除一个节点
c.remove();
//删除一个节点对象的子节点
document.getElementById('').removeChild(c);
//克隆一个节点
c.cloneNode();

var max=100; min=10;

  • 改变 HTML 内容 

d.getTime(); //获取从1970年一月一号至今的毫秒数
d.getTimezoneOffset(); //北京时间东八区,比格林威治时间早八个小时,所以值是-480
Date.parse('1970-01-02'); //返回毫秒数

BOM 对象有 window document screen 等
DOM 对象有 <html> 所有元素对象

js的作用域和py相似,if while等控制语句并没有自己作用域;而函数是有自己的作用域的;

//对象、遍历对象和事件
var obj = {
attr1 : val1,
attr2 : val2,
fun1:function(){},
fun2:function(){}
}
//删除属性或方法使用delete
delete obj.attr1;
//使用对象里面的内容
obj.attr1;
//或者使用中括号
obj[0];
//调用函数,加中括号,中括号里面函数名需要引号,还要在后面加括号
obj['fun1']();
//遍历对象
for(var i in obj){
if (typeof obj[i] == 'function') { obj[i]();}
else{ console.log(obj[i])}
}

复合数据类型:复合数据类型的数据存储分两个部分,一是变量名和数据的地址,
存在“快速内存”中;二是将实际的数据存在“慢速内存”“堆内存”中。堆:大而慢
(数组、对象、函数) 将一个引用的变量赋给另一个变量,它赋的是数据地址,而不是真正的数据。
【数据共享】

b=2;

setTimeout( function(){alert('这里???');} , 5000); //未解
}
}
//七、数组对象
var a = [];
var b = ['a','b'];
var c = new Array(4); //这个可以指定数组的长度
var aa = [1,2,3,543,232,88];
var bb = ['2',5];

第一个单词全小写,后面的单词首字母大写,并且去掉中间的连接线(-)
举例:
background-color 转换后 obj.style.backgroundColor = “#FF0000”
font-size 转换后 obj.style.fontSize = “18px”

异常处理

//下面两个将获取元素和文本节点
z.firstChild;
z.lastChild;
//下面两个只能获取元素节点
z.firstElementChild;
z.lastElementChild;
//下(上)一个同级节点
z.nextSibling;
z.previousSibling;
//下(上)一个同级元素节点
z.nextElementSibling;
z.previousElementSibling;
//父级节点
z.parentElement;
z.parentNode;

Array对象
length
join(数组连成字符串)
shift() 删除数组第一个元素,将数组长度减一
pop() 删除数组最后个元素,将数组长度减一
unshift() 在数组的开头增加一个元素,并将数组的长度加一
push():在数组的结尾增加一个元素,并将数组的长度加一

    <script type="text/javascript">

//在不到10的日子时间前面补一个零
function addZero(){
x = x >= 10 ? x : '0' x;
return x;
}

=====================节点操作==============

     }

//JS事件
//一、鼠标事件
function on_click(){
alert('鼠标单击事件触发');
}
function on_dbclick(){
alert('鼠标双击事件触发');
}
function on_mousemove(){
alert('鼠标移动事件触发')
}
function on_mouseout(){
alert('鼠标移出');
}
function on_mouseover(){
alert('鼠标over');
}
function on_mousedown(){
alert('鼠标按下');
}
function on_mouseup(){
alert('鼠标抬起');
}
//二、键盘事件
function on_keydown(){
alert('键盘按下事件触发');
}
function on_keypress(){
alert('键盘按着事件触发');
}
function on_keyup(){
alert('键盘抬起事件触发');
}
//三、其他事件
function on_focus(){
alert('获得焦点事件触发');
}
function on_blur(){
alert('失去焦点事件触发');
}
function on_change(){
alert('内容改变事件触发');
}
function on_submit(){
return confirm('你确定提交?');
}
function on_reset(){
return confirm('你确定清空内容吗?');
}

value innerHTML区别
给表单元素加值 用 value , 其他如div 用 innerHTML

Date.parse(x)

//数组,数组也是对象,数组下标从0开始
var array = [];

【html dom 】
<div id=”box”></div>
var obj = document.getElementById(“box”); //获取对象
var img = document.createElement(“img”); // 创建节点
img.src = “images/img01.jpg”; //使用元素对象的属性
obj.appendChild(img); //将img节点,追加到id=box中去

    function copyNode(){

//JS内置的一些对象
//一、Number对象
//查看对象的详细内容
console.dir(Number);
var a = 3;
//Number的一些方法
a.toString();
a.valueOf(); //返回数值对象的原始数值
//二、Boolean对象
Boolean(123);
//三、Math对象
Math.abs();
Math.ceil(); //向上取整
Math.floor(); //向下取整
Math.max(); //取最大
Math.min(); //取最小
Math.pow(a,b); //a的b次方
Math.random(); //返回0-1的随机数
Math.round(); //进行四舍五入
Math.cos(); //三角函数,使用弧度
Math.sqrt(); //开方
Math.exp();
//四、字符串对象
var str = 'adsfasdfasgasdf';
str.length; //得到字符串的长度
str.indexOf('s'); //搜索从第二个参数(可选)开始第一个字符出现的位置,不论从哪儿找,该字符串第一个元素记为第零个
str.indexOf('s',12);
str.lastIndexOf('s');//与上面的类似,从后往前
//字符串切片
str.slice(5,8); //从字符串的第一个参数开始截取到第二个(可选,默认是字符串尾);
str.slice(-2); //参数是负数表示左边界从右边开始算起,而且第二个参数一定要在第一个参数的右边
//字符分割
str.split('s'); //第二个参数可选,表示返回值中数组的最大长度
//字符串提取
str.substr(5,2); //从第一个参数起始,截取第二个参数要截取的长度
str.substring(3,8); //从第一个参数起始,截取到这个字符串在第二个参数的位置
//字符串拼接
str.concat('asdfasf');
str.concat('fasd','fasdf');
//大小写转换
str.toLocaleUpperCase();
str.toUpperCase();
str.toLocaleLowerCase();
str.toLowerCase();
//五、正则表达式
//由四部分组成
//定界符、原子、元字符、模式修正符
//元字符:没有单独存在的意义,它只能用来修饰原子,而且修饰的是紧挨它前方的原子
var c = /[23][34]{3,6}/
//- 连接,根据ascii吗表连续的内容
c.test('asd'); //使用我们的正则来判断里面的字符串
//中括号
var i = /[a-z]/;
var j = /[^abc]/; //表示除中括号内规则以外的内容
var k = /.{1,8}/;
var l = /w{1,9}/; //w相当于[a-zA-Z0-9_] W相当于[^a-zA-Z0-9_]
var m = /d{1,8}/; //d相当于[0-9] D相当于[^0-9]
var n = /s{1,8}/; //s表示任意空白字符
var o = /^[1-9]/; //^表示起始必须符合我们表达式的起始
var p = /^[1-9]d{4,9}/; //$表示结尾也必须符合我们的表达式的结尾
// *相当于{0,}, 相当于{1,},?相当于{0,1}
//模式修正符写在定界符之外
var b = /ah/i; //i表示前面的正则表达式不区分大小写匹配
var c = /ah/g; //g表示全局匹配,多次调用正则会一次将符合规则的结果匹配出来
var d = /ah/m; //m表示多行匹配

str1<str2   返回-1的值

        //3添加属性 <img src="001.jpg" />

//对时间应用的例子
function getMytime(){
var d = new Date();
var f =
d.getFullYear() '-'

举例:循环1-100间所有的数,但大于50的就不再输出了。
for(var i=1;i<100;i )
{
if(i>50)
{
break; //退出循环,直接跳转到for的结束大括号之后
}
document.write(i ”<br>”);
}

}

</script>

window 是顶级对象 ,可以省略
innerWidth:指当前浏览器窗口的宽度,不含滚动条、菜单栏、地址栏、状态栏等。IE低版本不支持。
IE中要使用document.documentElement.clientWidth来代替;

   var div1=document.getElementById("div1");

//检验节点对象是否含有某个属性
c.hasAttribute('class,title');

(2)使用{ }来创建一个对象
var obj = {
name:“周更生”,
school:“北京理工大学”,
showInfo:getInfo //将一个普通函数传给对象属性,这里千万不要带( )。如果带(),表示将函数的执行结果赋给对象属性,这个执行结果是“基本数据类型”。
}
//定义一个普通函数
function getInfo()
{
var str = obj.name “的毕业于” obj.school
document.write( str );
}

 

d.toTimeSring();
d.toDataString();
d.toLocaleString();
d.toLocaleDateString();
d.toLocaleTimeString();

document.body.removeChild(); 父节点删除子节点

通过上面的表达式 z=x y,我们能够计算出 z 的值为 11。

<button id="btn">停止</button>
<button id="start">开始</button>
<script type="text/javascript">
//基本语法略:创建对象var obj = {};
//可以写JS的四个地方:略
//循环:略
//类型及类型转换
//js有六种类型:数值 布尔 字符 undefined 对象 null
/*数值型*/
var a = 100;
var c = a 'b'; //数值和字符相加变成字符拼接。
//转换成数值型
parseInt('123'); //123
parseInt('123asdf'); //123
Number('123'); //123
Number('123adf'); //报错
parseFloat('123.23');
//转成字符型
a = a.toString();
console.log(100..toString());
//转成布尔型
var f = 0;
Boolean(0);
Boolean('');
Boolean(null);
Boolean(undefined);
//特殊的转型布尔方式
var g = 1 ;
console.log(!!g);

类型转换
var a="100";
a= Number(a); //测试用而已
a=parseInt(a);

   

//子模式的外在表现一般使用一个小括号包着的部分就是一个子模式
//子模式最多只能有99个
//我们可以用$1……$99来调用缓冲区的内容
//六、时间对象
var d = new Date();
d.getFullYear();//显示年份
d.getMonth(); //显示第几月,从0开始
d.getDay(); //显示星期几,从零(周日)开始
d.getDate(); //显示几号

//js的数组可动态增长
var a=[1,2];
a[2]=3;
alert(a.length);

            //用户输入的无效(重复2,3步骤)

aa.concat(bb); //拼接数组
bb.concat(aa);
aa.join('-'); //join可以指定一个分割符号,然后将数组的每个值使用该分隔符一次连接起来,形成一个字符串
aa.toString();
aa.pop(); //从数组的末端删除一个元素
aa.shift(); //从数组的首端删除一个元素
aa.push(); //从数组的尾部添加一个或多个元素
aa.unshift(); //从数组的首端添加一个或多个元素
aa.reverse(); //将原来的数组进行调转排列
aa.slice(); //这个跟字符串的slice的一样
//之后李阳搞了个桃子的玩意儿,没写

charAt(index)     返回字符
indexOf(char)     返回字符位置    如果未找到,返回-1 
lastIndexOf(char)         //   var filename="xxx.jpg"    找 jpg文件
substr(startIndex[,length])   //截取字符串
substring(startIndex[,lastIndex])   //功能与上类似
split(字符串转数组)           // str.split(",");
toLowerCase() 转小写
toUpperCase() 转大写
localeCompare() 使用本地的排序规则(根据所使用的操作系统,简体中文操作系统)对中文进行排序

//创建日期对象

//当前节点的属性列表
z.attributes;
//使用数字下标获取属性的名称和值(不保险,不推荐使用)
z.attributes[0].name;
z.attributes[0].value;
//获取一个节点的属性值
z.getAttribute('id');
z.setAttribute('data-ssse',1234);

“ ” =如果它的前后有一个是字符串,则“ ” =的功能就是“连接”字符串功能;
“ ” =如果它的前后都是数值时,则“ ” =的功能就是“加法”运算的功能;
Var a = 100;
Var b = “100”;
Var c = a b; //结果是:“100100”

 

//某个节点对象的一些属性和方法
var z = document.getElementById('z'); //
z.nodeName; //获取当前节点名
z.childNodes;
z.children; //获取子元素节点

(2)将一个匿名函数的定义赋给一个数组元素
var arr = new Array();
arr[0] = 100;
arr[1] = 200;
arr[2] = function(a){ return a*a*a; } //将函数的定义赋给数组元素,那么该元素就是一个函数了
//调用函数
var result = arr[2];
result(10);

 

var xxx;

基本数据类型:字符型(String)、数值型(Number)、布尔型(Boolean)、Undefined(未定义型)、Null(空型)

var str2=str1.replace("cd","aaa");

<button type="reset">重置</button>

基本数据类型:基本数据类型是将变量名和变量值存储在“快速内存”“栈内存”中。 栈:小而快

 

var a = document.getElementById('btn');
var b = document.getElementById('start');

最大值
var a=1;b=2;
var max=a>b?a:b;

var ret = func();

<button type="submit">提交</button>
</form>

比较的结果:

var x= (new Date()).getDay();

语法结构:var arrObj = document.getElementsByTagName(“li”)
功能描述:取得标记为<li>的一个数组(标记列表)。
举例:取得一个<ul>标记中的所有的<li>标记
//获取id=ul的对象
var ulObj = document.getElementById("ul");
//取得所有的li对象的一个数组
var arrLi = ulObj.getElementsByTagName("li");
//修改第二个和第四个li的样式
arrLi[1].style = "font-size:24px;color:#ff0000;"; //放两个style
arrLi[3].style.textDecoration = "underline";

<html lang="en">

//调用对象的方法
obj.showInfo(); //对象方法
getInfo(); //调用普通函数

                    ele2.checked=true;

reverse() 反转数组元素的顺序
sort([sortby]) 数组默认按字母排序
//实例:按拼音的先后顺序排列
var arr = ["安庆市","安徽省","河南省","河北省","北京市"];
arr.sort(orderby2);
function orderby2(str1,str2)
{
return str1.localeCompare(str2);
}
document.write(arr);

                    ele2.checked=false;

Date对象

 

document是一个对象,对象有属性和方法,加括号就是方法,不加括号就是属性。

 

&& || !与或非
<a href="javascript:void(0)">首页</a> 比#好,链接不会变色 <a href="#"></a>

赋值 =

Math对象
Math.abs(),取绝对值
Math.ceil(),向上取整 例如:Math.ceil(4.3) = 5 ,Math.ceil(4.9)=5
Math.floor(),向下取整 例如: Math.floor(4.4)=4,Math.floor(4.9)=4
Math.round(),四舍五入
Math.sqrt(),求平方根
Math.random(),返回0-1之间的随机小数。0<=X<1

arr1.push(4,5);

全局变量 版本太多。。。
注意:任何地方省略var关键字,定义的变量都是“全局变量”,因此,一般情况下,不要省略var关键字。
【跟php不一样 】
全局变量:全局变量一般是在函数外定义的。全局变量可以在网页的【任何地方】使用(函数内和函数外)
局部变量:局部变量一般是在函数内定义的。局部变量只能在函数内来使用。函数执行完毕,局部就消失。

         <tr>

变量是内存中来存储和运行的。
var name,age; //同时定义多个变量
变量区分大小写

    // 在表单验证时使用该对象验证用户填入的字符串是否符合规则.

Var d = 200;
Var result = a d; //结果为:300

Date.UTC(x)

========================js 对象=======================
js本身是一种弱类型语言,本身是没有类class和对象这个概念
,但是我可以通过js代码去模拟实现这个过程,所以我们说js也可以说是面向对象的。

 

<img src="a.jpg" onclick="javascript:window.alert('')" /> //不需要;号

       链中的下一个对象,如果搜索完所有对象都未找到,则认为该标识符未定义,函数执行过程中,每个标识符都

str1.localeCompare(str2)

    function begin(){

var a=i 先赋值给a,i再加1

    ele.onclick=function(){

<script type="text/javascript">

<div id="abc" onclick="func1(this)">事件绑定方式1</div>

break只能退出当前循环,不会多层循环。但在PHP中,break可以退出多层循环。
continue语句,结束本次循环,去开始下一次循环。

匈牙利类型标记法

数组的值可以是任意数据类型
delete arr[0]; //删除下标为0的数组元素
注意:用delete删除数组元素时,只是将内容清除,但所占空间还存在。

 

======================dom 简单法=====================
【不用 document.body.childNodes[0] 和 setAttribute() 】
【css dom】
var obj = document.getElementById("box");
//给id=box的对象增加样式
obj.style.width = "400px";

 

(1)使用new关键字和Object()构造函数来创建
var obj = new Object(); //创建一个空对象
obj.name = “周更生”; //增加一个属性
obj.school = “北京理工大学”; //增加一个属性
//方法就是函数,方法在定义时不需要加括号,给方法赋的值,一定是一个函数。
obj.showInfo = function(){
var str = obj.name “毕业于” obj.school;
document.write( str );
}
//对象的使用
obj.name = “张立峰” //修改内容
obj.edu = “大专”; //增加一个属性
delete obj.school; //删除一个对象的属性
document.write( obj.name ); //输出一个对象的属性值
obj.showInfo( ); //对象方法的调用,加上小括号

    } )()

【对任何对象的操作,以及数据库操作,都是“增删改查”。】
数组也是对象

<script>

当网页<body>加载完成后调用js函数 <body onload="test()">

 

<script type="text/javascript" src="myjs.js"></script>

7.4.1 node的CURD:

表格隔行变色 【项目应该不是这样】
var str = "<table width='500' border='1' style='border-collapse:collapse;'>";
str = "<tr><th>编号</th><th>新闻标题</th><th>发布时间</th></tr>";
for(var i=1;i<100;i )
{
str = "<tr";
//如果是偶数行,则输出bgcolor属性
if(i%2==0) //【这个是重点】
{
str = " bgcolor='#cccccc'";
}
str = ">";
str = "<td>" i "</td><td> </td><td> </td>";
str = "</tr>";
}
str = "</table>";

 

修改一个变量的值,另一个变量的值不会发生改变。

//   var ele3=div1.getElementById("div3");

<script language="javascript">
var num1=1;
var num2=333;
var res=num1 num2;
window.alert('结果是:' res); 【变量和字符串要分开】 js 用 连接 php 用 . 连接
window.alert(typeof num1);
alert(res); //可省略 window

布尔型(Boolean)

//(3)输出结果
document.write(str);

 

if和switch的主要区别:if的条件应该是一个范围,switch的条件应该是一个值。

        var img = document.createElement("img");

========节点操作   html dom /css dom

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
        "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <title>Title</title>
 <script type="text/javascript">
function test(){
            var img1=document.createElement("img");   //添加节点
            img1.setAttribute("src","../img/2.jpg");  //设置属性
            document.body.appendChild(img1);          //追加节点
       }
        // html dom
        function test1(){
            var img1=document.createElement("img");
            img1.src="../img/2.jpg";
            var div1=document.getElementById("div1");
            div1.appendChild(img1);
        }
        // css dom
        function test2(){
            var div1=document.getElementById("div1");
            div1.style.border="1px solid #ccc";
            div1.style.width="300px";
            div1.style.height="300px";
            div1.style.backgroundColor="#456aaa";
        }
    </script>
</head>
<body onload="test1()"><div id="div1">123</div>
</body>
</html>

 

innerHTML:指标记对中的HTML文本(含有HTML标记的文本),一般指双边标记;比如:<h2>二级标题</h2>

overflow:hidden; 超出部分隐藏
overflow:auto; 超出部分加滚动条

元素属性
offsetWidth:指元素的宽度,不含滚动条中的内容;
offsetHeight:指元素的高度,不含滚动条中的内容,【是只读属性;】
scrollWidth:指元素的总宽度,含滚动条中的内容;
scrollHeight:指元素的总高度,含滚动条中的内容;
scrollTop:指内容向上滚动进去的距离,如果没有滚动条,则值为0;
scrollLeft:指内容向左滚动过去的距离,如果没有滚动条,则值为0;

onscroll事件:当内容滚动时,发生的事件。

鼠标事件
onclick单击事件
ondbclick双击事件
onload网页加载完成,一般用于<body>元素
onchange:当内容发生改变时,一般用于选择上传文件
onscroll:当移动滚动条时(只要可能出现滚动都可以)
onmouseover:当鼠标放上时
onmouseout:当鼠标移开时
onsubmit:当单击“提交按钮”时(用于submit按钮)
onreset:当单击“重置按钮”时(用于reset按钮)
onfocus:当文本框获得焦点(鼠标光标在文本框中点击)
onblur:当文本框失去焦点(鼠标光标在文本框之外点击)
onselect:更改下拉列表中的内容时(用于select表单元素)

【第一种简单点】/【第二种可以绑定多个事件,如mouseover mouseout onclick】
(1)每个HTML标记都有事件句柄属性。onClick是HTML标记属性,不分大小写。
例如:<img src=“images/01.jpg” onClick=“init()” />
(2)HTML标记对应的元素对象也具有事件句柄属性,这个属性必须全小写,因JS区分大小写
obj.onclick = init; // init是一个函数的地址,而不能加小括号
function init(){
window.alert(“OK”);
}
注意:(1)元素对象绑定事件的名称必须全小写;(2)元素对象的事件必须调用一个函数,可以是普通函数,也可以是匿名函数。

事件返回值,对有些事件,会影响默认动作的执行。如:onclick和onsubmit

=================== event ======================
DOM中event对象的属性
clientX:获取当前事件距离窗口左边的距离;
clientY:当前事件发生时距离窗口顶端的距离;
pageX:当前事件所在网页中的x坐标
pageY:当前事件所在网页中的y坐标;
screenX:当前事件所在屏幕中的x坐标;
screenY:当前事件所在屏幕中的y坐标;
type:当前事件的类型

event事件 ,firefox 需要 event参数,ie不需要,兼容性问题

IE模型中,事件对象,采用如下语法:
window.event

在W3C模型中,采用如下语法:
dom对象.事件 = function(event) {
event.
}

=================== event 结束 ==================

obj.className = “box”;

表单提交的三种方法
submit按钮结合onsubmit事件,实现表单提交(最常用)

表单验证
一、常用的属性
Name:元素的名称
Value:元素的值
Size:文本框的宽度
Maxlength:最多存放多少个字符
Readonly:只读
Disabled:禁用
……
二、常用的事件
Onfocus:当获得焦点时;
Onblur:当失去焦点时;
三、常用方法
Select():选中内容
Focus():定位光标
Blur():让光标从某个元素上移走

Select对象的常用属性
options[]:返回所有option组成的一个数组;
name:名称
value:option的value的值
length:设置或读取option的个数
selectedIndex:当前选中的option的索引号
……
option对象的常用属性

text:指<option></option>中的文本
value:指option对象的value属性
index:指每个option对象的索引号
selected:当前option是否选中
……

 

======== javascript(5) ajax(2) jquery(3)=========
javascript(5) 扯太深远了

20141004(面向对象1) 20141005(面向对象2) 20141007(正则)

//自调用匿名函数
// ( 匿名函数 )();
(function(){alert('a')})();
//自调用匿名函数,可加参数 name
(function(name){alert('a ' name)})('小明');

this php和js 都表示,谁调用,this就指谁

=========== 事件监听 =================
问题:我们可不可以对同一对象的同一事件绑定多个处理程序?
dom.onclick = function fn1() {}
dom.onclick = function fn2() {}

答:可以,采用事件监听的方式

浏览器:
IE
attachEvent
detachEvent
W3C(firefox chrome )
addEventListener
removeEventListener

冒泡模型
1、基本语法
addEventListener(type,callback,capture)
capture:true false
false : 冒泡模型 【默认】
ture:捕捉模型
目前IE浏览器只支持冒泡模型

响应式设计(电脑 平板 手机)听说在微信开发里面有介绍。。。
==============jquery===============

jquery 就是 javascript框架 extjs 现在没优势了。。

==================== jquery dom ====================
jQuery对象本身就是一个数组

dom对象只能调用dom方法
jQuery对象只能调用jQuery方法

1)jQuery对象转dom对象

语法:

jQuery[0]

jQuery.get(0)

2)dom对象转jQuery对象

语法:

$(dom) 内置方法 理论上,把字符串 dom 等传入 $()就变成了 jquery对象!牛逼吧!

var a=document.getElementById("content");
$(a).html("123"); //$(a) 转换为 jquery对象

建议:我们在写程序时,对于jQuery对象的变量尽量加$
var $a=$(':checkbox');

json格式
var a={"name":"小明",
"age":"8"};

dom window.onload=function(){} 载入所有 html标签
jquery $(document).ready(function(){}); 载入需要的 html标签就可以了,快

RegExp对象

= 赋值
== 两个数值相等,返回true
=== 值和类型同时相等

<div id="div1">

document.write("");
window.alert("<span style=''></span>");

//返回结果为1,2,3,4,5

var a="abc";
if(a){ //a 自动转换为true or false

JavaScript中没有字符类型

访问<html>节点的方法:
document.documentElement
访问<body>节点的方法:
document.body

 

var num1=window.prompt("请输入一个数");

            background-color: coral;

//数字从小到大排序
function orderby(a,b)
{
return a-b; //对数值大小进行排序
}

当函数无明确返回值时,返回的也是值 "undefined";

//这样简单点
var arr = [
[1,2,3,4,5],
[10,20,30,40,50],
[100,200,300]
];

总结:

节点的访问:firstChild、lastChild、childNodes、parentChild(父子节)
可以使用元素对象的方法进行代替:getElementById()、getElementsByTagName()

<script>

//(2)将一个普通函数作为数据传给一个变量
var a = getInfo; //直接将函数名赋给一个变量,是将函数的地址传递给了另一个变量
a( ); //调用函数

}

Math.floor(Math.random()*(max-min) min);

    使用上讲: window对象不需要创建对象,直接使用即可.

求任意两个数值的最大值
//定义函数
function getMax(a,b)
{
var max = a>b ? a : b;
document.write(“最大值是:” max);
}
//调用函数,函数一次定义可以多次调用
getMax(10,20);

首先要看一个问题,if 语句适用范围比较广,只要是 boolean 表达式都可以用 if 判断;而 switch 只能对基本类型进行数值比较。两者的可比性就仅限在两个基本类型比较的范围内。

【js使用节点,html标签必须无空格】

////不支持

注意:访问节点的操作,都是以document为起点的。

        /*  alert(arr5.length);//8

//(3)将一个普通函数作为数据传给一个数组元素
var arr = new Array();
arr[0] = 100;
arr[1] = getInfo; //将一个函数的地址,传给了数组元素,所以arr[1]就成了函数了
arr[1]( ); //调用函数,相当于 getInfo();
=========================js 对象 结束===================
String对象方法

     遇到foo函数,创建foo.AO,绑定y属性<入栈>

Var arr = [45,44,,,,,,32,,,,,,,,,,,,,,,21,333,,,,,,,,,,,432];
for(var j=0;j<arr.length;j ){
if(arr[j]== undefined){
continue; //继续,跳过这个 undefined 跳到for循环开始处,并将i 1,继续循环
}
}
document.write(arr[i] " ");

    <div name="yuan">i am div2</div>

str1>str2  返回1的值

嵌套函数的作用域:

}

    (function(arg){

switch(变量、表达式){
case 1(变量、表达式的值):
xxx;
break;
}

    bar函数的scope chain为:[0]bar.AO-->[1]foo.AO-->[2]global.VO

<body>
<div id="box">dfdfdf</div>
</body>

    <meta charset="UTF-8">

有浏览器,就有js
js跨平台 windows linux unix mac

常用特殊字符在字符串中的表达

匿名函数,函数没有函数名
(1)将一个匿名函数定义赋给一个变量
var a = function(a){ return a*a*a; }
document.write( a(10)) ; //调用函数

函数的作用域链和闭包

简介:

尽管这两个值相等,但它们的含义不同。undefined 是声明了变量但未对其初始化时赋予该变量的值,null 则用于表示尚未存在的对象(在讨论 typeof 运算符时,简单地介绍过这一点)。如果函数或方法要返回的是对象,那么找不到该对象时,返回的通常是 null。

  • 关于class的操作 

       

                }

    概念上讲.一个html文档对应一个window对象.

1

2

var bResult = "Blue" < "alpha";

alert(bResult); //输出 true  

函数parseInt:   强制转换成整数   例如parseInt("6.12")=6  ; parseInt(“12a")=12 ; parseInt(“a12")=NaN  ;parseInt(“1a2")=1

 

//

<html lang="en">

 

if语句嵌套格式

////支持;

if (表达式){

        return "tony";

Pascal 标记法

知识预览

              ele.classList.remove("hide");

变量在声明的时候并不需要指定数据类型

//结果为"c,d,e,f,g"

        console.log(i)

// 匿名函数

如果表达式的值为true则执行语句1,

function func1(a,b){

按 Ctrl C 复制代码

    }

        return 0

<button onclick="history.go()">back</button>

Null & Undefined

      在JavaScript中,函数也是对象,实际上,JavaScript里一切都是对象。函数对象和其它对象一样,拥有可以通过代码访问的属性和一系列仅供JavaScript引擎访问的内部属性。其中一个内部属性是[[Scope]],由ECMA-262标准第三版定义,该内部属性包含了函数被创建的作用域中对象的集合,这个集合被称为函数的作用域链,它决定了哪些数据能被函数访问。

局部查找:

 

替换子字符串

<script type="text/javascript">

Function 类可以表示开发者定义的任何函数。

 

            position: fixed;

    y=y-1;

        //调用方式1

 

//x代表数组对象

如前所述,函数属于引用类型,所以它们也有属性和方法。

 

          foo函数的scope chain为:[0]foo.AO-->[1]global.Vo

 View Code

//x.pop()             弹栈     

   var a=1;

   

3.if..else 的判断条件范围较广,每条语句基本上独立的,每次判断时都要条件加载

        console.log("hello")

    return Bar;

var city = 'beijing';

onload:

}

 

        console.log("alex")

//使用注解

}

 

var person=new Person()

a=1

 

var city = 'beijing';

Location 对象方法

            alert("您输入的大了!");

 

            }

        var year = date.getFullYear();

所以在多路分支时用switch比if..else if .. else结构要效率高。

        var hour = date.getHours();

case 7:y="星期日";    break;

注意:

var ret = func();

<script language="JavaScript">

onload         一张页面或一幅图像完成加载。

标识符

手工创建字符串对象

            }

y=6

 

        parent.appendChild(div_copy);

 

 

ECMAScript等性运算符

alert(arr1.toString());

// unshift shift

//连接数组-concat方法

</script>

    <p>hello yuan</p>

 

//  js中数组的特性

    </style>

 

    f();

//     ------------------arguments的用处2 ------------------

        div.appendChild(eleA);

函数的内置对象arguments

 

         var arr5 = ['abc',123,1.14,true,null,undefined,new String('1213'),new Function('a','b','alert(a b)')];

 

3 全选反选取消

1

2

var bResult = "25" < 3;

alert(bResult); //输出 "false"

if(1==1){

 

总结:

    document.write(hellostr);

  • 改变 HTML 属性 

//start表示开始位置索引

<form id="form">

arr1.push([6,7]);

   

        

布尔值也可以看作on/off、yes/no、1/0对应true/false

        //7. 获得当前秒

    alert(a b);

         }

 

    default:语句4;

 

switch(x){

   整数:
           在JavaScript中10进制的整数由数字的序列组成
           精确表达的范围是
-9007199254740992 (-253) 到 9007199254740992 (253)
           超出范围的整数,精确度将受影响
  浮点数:
           使用小数点记录数据
           例如:3.4,5.6
           使用指数记录数据
           例如:4.3e23 = 4.3 x 1023

 

         var options=document.getElementById("left").getElementsByTagName("option");

<div class="back">

//设置日期和时间

//x.sort()

max(x,y)    返回 x 和 y 中的最高值。

        elementNode.removeChild(node)

 

}

<script>

 

</head>

 

结论:for i in 不推荐使用.

 

 

DOM对象(DHTML)

             option_city.innerHTML=citys[i];

      var j = i;

 

 

    function inner(){

 

父(parent),子(child)和同胞(sibling)等术语用于描述这些关系。父节点拥有子节点。同级的子节点被称为同胞(兄弟或姐妹)。

            parent.removeChild(div);

close()            关闭浏览器窗口。

 

        //8. 获得当前星期

11种内置对象

 

//arr.sort();

    语句1;

上面这段代码比较的是字符串 "25" 和 "3"。两个运算数都是字符串,所以比较的是它们的字符代码("2" 的字符代码是 50,"3" 的字符代码是 51)。

    document.getElementById("abc_2").onclick=function(event){

 

数字类型(Number)

    var func = function(arg){

 

1

2

3

4

<script>

        var str="u4f60u597dn欢迎来到"JavaScript世界"";

        alert(str);

</script>

onblur         元素失去焦点。               应用场景:用于表单验证,用户离开某个输入框时,代表已经输入完了,我们可以对它进行验证.

            var div = document.getElementById("div_2");

        }

   var b=2;

document.write(x.toLocaleString( ) "<br>");

语句1;

 

Date对象的方法—设置日期和时间

数组的进出栈操作(1)

假如x=2,那么x 表达式执行后的值为3,x--表达式执行后的值为1
i 相当于i=i 1,i--相当于i=i-1
递增和递减运算符可以放在变量前也可以放在变量后:--i
   
var i=1;
console.log(i );
console.log( i);
console.log(i--);
console.log(--i);

//返回1997年8月1日12点23分50秒 

</div>

if (a == 1) ...

    }

function func(){

    b=2;

        for (var i=0;i<inputs.length;i=i 1){

        var parent = div.parentNode;

 

    ...

功能说明:

 

   

例如i =1相当于i=i 1,x&=y相当于x=x&y

 function a(a,b){

//setMillliseconds (ms)       设置毫秒(0-999)

 

           var temp=document.getElementById("ID1");

//结果为"1,2,3,4,5,6,7"

 

//value参数可以省略

  • 通过使用 getElementById() 方法 
  • 通过使用 getElementsByTagName() 方法 
  • 通过使用 getElementsByClassName() 方法 
  • 通过使用 getElementsByName() 方法 

 

 

    }

clearInterval()    取消由 setInterval() 设置的 timeout。

1

2

3

var str1= new String("hello word");

alert(str1.length);

alert(str1.substr(1,3));

 

        //----------alert confirm prompt----------------------------

//结果为"abaaaefgh"

 

        </div>

      }, 1000 );

//使用注解

            alert("您输入的小了!");

    <p>hello p</p>

//y=x.concat(addstr)

</script>

    }

 

 

    }

 

       域链初始化为当前运行函数的[[Scope]]所包含的对象。

    功能上讲: 控制浏览器窗口的.

    for (var i=0;i<doms.length;i ){

类型查询函数(typeof)

        alert(Math.pow(2,4));// pow 计算参数1 的参数2 次方.

    var val=ele.value;

onfocus        元素获得焦点。               //练习:输入框

 

 

};

//

 

    if (a>b){

   

    alert(result); */

    console.log(city);

 

            alert("请输入有效数字!");

    //该对象中的属性方法 和数学有关.

    else {

alert(arr2.toString());

 

 

 

调用字符串的对象属性或方法时自动创建对象,用完就丢弃

 

             var option=options[i];

    return Bar;

 

 

  1. 由不以数字开头的字母、数字、下划线(_)、美元符号($)组成
  2. 常用于表示函数、变量等的名称
  3. 例如:_abc,$abc,abc,abc123是标识符,而1abc不是
  4. JavaScript语言中代表特定含义的词称为保留字,不允许程序再定义为标识符

使用innerHTML属性修改元素的内容

增:

function func(){

     遇到bar函数,创建bar.AO,绑定z属性<入栈>

            alert("success!")

"W3C 文档对象模型(DOM)是中立于平台和语言的接口,它允许程序和脚本动态地访问和更新文档的内容、结构和样式。"

 

       console.log(i); // 0 1 2 length item namedItem

    var arr=[1,"hello",true]//var dic={"1":"111"}

根据 W3C 的 HTML DOM 标准,HTML 文档中的所有内容都是节点(NODE):

 

事件传播:

        //2.克隆 参数为true 那么克隆时克隆所有子元素. false 只克隆自己

    case 值2:语句2;break;

 

连接字符串

    function inner(){

 

<script>

        }else {

<script>

 

         }

        <option>book4</option>

ECMAScript 提供了 typeof 运算符来判断一个值是否在某种类型的范围内。可以用这种运算符判断一个值是否表示一种原始类型:如果它是原始类型,还可以判断它表示哪种原始类型。

 

        //6. 获得当前分钟

alert(getCurrentDate());

Undefined 类型

        //2.创建a标签  createElement==>创建一个a标签   <a></a>

<p id="ppp">hello p</p>

            // alert(num)

        //2. 获得当前年份

       在函数创建时,每个函数都会创建一个活动对象Active Object(AO),全局对象为Global Object(VO),创建函数的过程也就是为这个对象添加属性的过程,作用域链就是由这些绑定了属性的活动对象构成的。

 

 


 

children                        // 所有子标签

 

        return 1;//-1

 

            }else{

 

var str1="abcd";

</html>

数组切片-slice

 

    语句1;

第二中方式:

              ele2.classList.add("hide");

创建二维数组

 

pow(x,y)    返回 x 的 y 次幂。

 

    //点击后 替换div区域3 为一个美女

    }

 

            position: fixed;

    var str = "hello world";

//RegExp对象

//splice的主要用途是对数组指定位置进行删除和插入

        console.log(city);

}else if (表达式2){

        console.log(arguments);//[1,2]

}

        return "0" num;

在以 Pascal 标记法命名的变量前附加一个小写字母(或小写字母序列),说明该变量的类型。例如,i 表示整数,s 表示字符串,如下所示“

             <td><input type="checkbox"></td>

 

toLocalString()

    语句2;

 

 

//==================

alert(arr1);

 

onmouseover    鼠标移到某元素之上。
onmouseleave   鼠标从元素离开

//返回x addstr字符串

        return year "年" changeNum(month) "月" day "日 " hour ":" min ":" sec " " parseWeek(week);

ret();

exp(x)    返回 e 的指数。

    y=y 1;

功能说明

 

<head>

location.replace(newURL)//注意与assign的区别

    }

onmouseout     鼠标从某元素移开。

    }

a.splice(1,0,2,3);

 

while (条件){

导航属性:

alert(arr1)

    for (var i in arr){

Date对象的方法—日期和时间的转换

</div>

 

 

        //-------------pow--------------------------------

//循环的是你获取的th一个DOM元素集,for in用来循环对象的所有属性,dom元素集包含了你上面输出的属性。

<script>

//如果你只要循环dom对象的话,可以用for循环:

 

    var arr = ["星期日","星期一","星期二","星期三","星期四","星期五","星期六"];

         //js中的数组特性1: js中的数组可以装任意类型,没有任何限制.

case 3:y="星期三";    break;

  • 核心 DOM - 针对任何结构化文档的标准模型
  • XML DOM - 针对 XML 文档的标准模型
  • HTML DOM - 针对 HTML 文档的标准模型

<input id="ID1" type="text" onclick="begin()">

Location 对象

 

字符串(String)

    <input class="add-all" type="button" value="====>" onclick="ADDall()"><br>

               

function 函数名 (参数){
    
函数体;
   return 返回值;
}
//another way:
var 函数名 = new Function("参数1","参数n","function_body");

        if (arguments.length!=3){

        //test方法  ==>  测试一个字符串是否复合 正则规则. 返回值是true 和false.

 

case 2:y="星期二";    break;

            top: 50%;

    var y = 2;

if-else基本格式

 

</script>

    alert(reg2.test(str));// true

 

//使用注解

 

 

控制语句

                //是 ==> 重复123步骤.

    }

        var ele2=document.getElementsByClassName("models")[0];

 

    }

 

a=1 b=2;------错误

onload 属性开发中 只给 body元素加.
这个属性的触发 标志着 页面内容被加载完成.
应用场景: 当有些事情我们希望页面加载完立刻执行,那么可以使用该事件属性.

    alert(str.replace(/o/g, "s")); // hells wsrld  对字符串按照正则进行替换.

        ele.value="请输入用户名";

             var option_city=document.createElement("option");

 

//shift是将数组x的第一个元素删除

 

另一种棘手的状况发生在比较两个字符串形式的数字时,比如:

 

            background-color: rebeccapurple;

    function func1(self){

        eleA.innerHTML = "百度";   

        }

    case 值1:语句1;break;

<button onclick="end()">停止</button>

while循环基本格式

 

//unshift是将value值插入到数组x的开始

getMinutes ()             获取分钟

函数执行前后的作用域链:

//利用数字对象获取可表示最大数

      setTimeout( function timer(){

}

 

x.setMinutes(12);    //设置分钟12

ret();    //beijing

            var city = 'shenzhen';

alert(arr1);

 

另一种只有一个值的类型是 Null,它只有一个专用值 null,即它的字面量。值 undefined 实际上是从值 null 派生来的,因此 ECMAScript 把它们定义为相等的。

//    alert(a);

 配合其他运算符形成的简化表达式

x.setFullYear (1997);    //设置年1997

History 对象是 window 对象的一部分,可通过 window.history 属性对其进行访问。

 

//   var ele2=div1.getElementsByClassName("div2");

<script>

4 变量命名,首字符只能是字母,下划线,$美元符 三选一,且区分大小写,x与X是两个变量

</div>

y="周末";

函数执行

</script>

//数组对象

             }

        //2.获得父亲

    //点击后 删除div区域2

alert("str1长度 " str1.length);

    alert(reg1.test(str));// true

 

 

         

    var ele=document.getElementById("id123").onclick=function(){

    function func(){

 

 

//                alert("验证失败 表单不会提交!");

</script>

}else if (表达式3){

//   var ele4=div1.getElementsByName("yuan");

        var z = 3;

<body>

 

         <tr>

    }

如果某个运算数不是原始的 Boolean 型值,逻辑 AND 运算并不一定返回 Boolean 值:

String数据类型的使用

创建数组对象

             c.appendChild(option_city);

连接数组-join方法

alert(a.toString());

简介

1 && 1 = 1  1 || 1 = 1
1 && 0 = 0  1 || 0 = 1
0 && 0 = 0  0 || 0 = 0

if 语句每一句都是独立的,看下面的语句:

// 匿名函数的应用

:

alert(arr3.toString());

  • 什么是 XML DOM?  ---->XML DOM 定义了所有 XML 元素的对象和属性,以及访问它们的方法。
  • 什么是 HTML DOM?---->HTML DOM 定义了所有 HTML 元素的对象和属性,以及访问它们的方法。

 

    function f(){

用 Function 类直接创建函数的语法如下:

.....

alert(nowd3.toLocaleString( ));

getMilliseconds ()        获取毫秒

7.4.2  修改 HTML DOM 

 

//返回1997年8月1日5点12分54秒

2.2 基础规范

        else if(userNum > num){

    //属性学习:

if (x==1){...}程序表示当x与1相等时

</script>

画dom树是为了展示文档中各个对象之间的关系,用于对象的导航。

 

        //1.获得 第一个div

按 Ctrl C 复制代码

 

 

ECMAScript 算数运算符

 

forward()    加载 history 列表中的下一个 URL。

    // var result = prompt("请输入一个数字!","haha");

            //open("");

//返回结果为1,2,3

比如,ECMAScript 定义的属性 length 声明了函数期望的参数个数。

location.reload()

function add(a,b){

        //3.获得父亲

//获取今天的星期值,0为星期天

 

    }

 //这里是对前面定义的函数进行调用

    </select>

8 实例练习

             <td><input type="checkbox"></td>

        alert('aaa');

    function bar() {

alert(arr1);

//   alert(ele.length);

    //Math是内置对象 , 与Global的不同之处是, 在调用时 需要打出 "Math."前缀.

    //-------------------------String 中与正则结合的4个方法------------------.

}

}

            citys=data[pro];

   

 

function Focus(){

    console.log(s);//12

    f() //----->OK

    // alert(result);

}

   

    /* var result = confirm("您确定要删除吗?");

W3C DOM 标准被分为 3 个不同的部分:

function intSort(a,b){

        var a = 123;

返回累计毫秒数(从1970/1/1午夜到国际时间)

        console.log(arr[i])

function getCurrentDate(){

    }

var o = new Object();

            //num=num*10;

1

2

比较运算符两侧如果一个是数字类型,一个是其他类型,会将其类型转换成数字类型.

比较运算符两侧如果都是字符串类型,比较的是最高位的asc码,如果最高位相等,继续取第二位比较.

    func1();

    //

    // 用户名 首字母必须是英文, 除了第一位其他只能是英文数字和_ . 长度最短不能少于6位 最长不能超过12位

    function f(){

    }

首字母是大写的,接下来的字母都以大写字符开头。例如:

<select id="province">

var ID = setTimeout(abc,2000); // 只调用一次对应函数.

    }

    }

按 Ctrl C 复制代码

//a变为 [1,4,5,6,7,8]

 

7.2 DOM 节点 

sayHello();

 b=2;

//------------------------------

 

 

ECMAScript 关系运算符(重要)

    }

    //-------------------------------正则对象的方法-------------------

}

    <style>

alert(str2);

强制类型转换函数

        // var city = "langfang";

于是 switch case 就出来了,把上面的改成 switch case 版本:

            clearTimeout(ID);

    document.write("<H" i ">hello</H " i "> ");

        }

Location 对象是 Window 对象的一个部分,可通过 window.location 属性来访问。

        //小了==> 提示用户小了,让用户重新输入(重复2,3步骤)

</form>

例如typeof(true-false)    "number"

 

//   alert(ele3.length);

Array对象的方法

Math对象

 

        console.log(arguments.length);//2

<!DOCTYPE html>

min(x,y)    返回 x 和 y 中的最低值。

 <button onclick="select('all');">全选</button>

</div>

访问 HTML 元素(节点),访问 HTML 元素等同于访问节点,我们能够以不同的方式来访问 HTML 元素:

 

逻辑 OR 运算符(||)

        //============max  min=========================

         c.options.length=0;

        console.log(arg);

}

History 对象方法

         <tr>

            height: 200px;

 

//方法1:不指定参数

练习:

下面的图片展示了节点树的一部分,以及节点之间的关系:

             if(option.selected==true){

 

 

 

Function 对象(重点)

获取数组元素的个数:length

    <title>Title</title>

a=1;

            var parent = div.parentNode;

 

    //----------------------------创建方式1

    document.write("<H" i ">hello</H " i "> ");

        // 2014年06月18日 15:40:30 星期三

    //alert(Math.PI);

 

var ret = func();

所有数字都采用64位浮点格式存储,相当于Java和C语言中的double格式

}

onkeyup        某个键盘按键被松开。

                break;

</script>

 

firstElementChild          // 第一个子标签元素

x.setHours(5);        //设置小时5

alert(y);

var num = Math.round(Math.random()*100);

    function updateNode(){

 

 

        //close方法  将当前文档窗口关闭.

function Bar(){

function foo() {

//alert(arr);

 

表达式中包含不同类型数据则在计算过程中会强制进行类别转换

注意:js的函数加载执行与python不同,它是整体加载完才会执行,所以执行函数放在函数声明上面或下面都可以:

     setTimeout( function timer(){

 

注意:

2 模态对话框

        else {

        clearInterval(clock);

alert(b.toString());

等于 ( == )  、不等于( != ) 、 大于( > ) 、 小于( < ) 
大于等于(>=) 、小于等于(<=)

alert(arr1.toString());

            width: 200px;

        <option>book</option>

    doms=document.getElementsByTagName("p");

  • 1992年Nombas开发出C-minus-minus(C--)的嵌入式脚本语言(最初绑定在CEnvi软件中).后将其改名ScriptEase.(客户端执行的语言)
  • Netscape(网景)接收Nombas的理念,(Brendan Eich)在其Netscape Navigator 2.0产品中开发出一套livescript的脚本语言.Sun和Netscape共同完成.后改名叫Javascript
  • 微软随后模仿在其IE3.0的产品中搭载了一个JavaScript的克隆版叫Jscript.
  • 为了统一三家,ECMA(欧洲计算机制造协会)定义了ECMA-262规范.国际标准化组织及国际电工委员会(ISO/IEC)也采纳 ECMAScript 作为标准(ISO/IEC-16262)。从此,Web 浏览器就开始努力(虽然有着不同的程度的成功和失败)将 ECMAScript 作为 JavaScript 实现的基础。EcmaScript是规范.

        //jquery下是$(this), 这种方式不需要this参数;

    nxAdd(1,2,3,4,5)

 

//使用注解

 

//setFullYear (year)               设置年

2 一行可以声明多个变量.并且可以是不同类型.

 

        p.appendChild(option_pro);

<!DOCTYPE html>

onmousemove    鼠标被移动。

var dd=new Array("星期一","星期二","星期三","星期四");

    //alert(str.split(/o/g)); // 按照正则表达式对字符串进行切割. 返回数组;

 

 

               ele.onclick=function(){

使用setAttribute();方法修改属性          

 

最基本的数据类型

    // macth search split replace

思考:onclick=function(event){};这个方法是谁调用的?

function Blurs(){

实例:              

 

        var ele=document.getElementsByClassName("shade")[0];

功能说明

 

 

alert(str2);

switch (a) {

            if(result){

从传统意义上来说,ECMAScript 并不真正具有类。事实上,除了说明不存在类,在 ECMA-262 中根本没有出现“类”这个词。ECMAScript 定义了“对象定义”,逻辑上等价于其他程序设计语言中的类。

        console.log(self.id)

//结果为"1,2,3,4,5"

 

按 Ctrl C 复制代码

         arr5[10] = "hahaha";

        }else if(userNum < num){

    </div>

 

abs(x)    返回数的绝对值。

 

if(x==“on”){…}程序表示当x与“on”相等时

函数的定义:

 

        例如:找x变量;bar函数在搜寻变量x的过程中,先从自身AO对象上找,如果bar.AO存在这个属性,那么会直接使用这个属性的值,如果不存在,则会转到父级函数的AO对象,也就是foo.AO

     }

 

back()    加载 history 列表中的前一个 URL。

 

    }

            height: 2000px;

    hellostr="您好," myname '先生,欢迎进入"探索之旅"!';

简单地说,ECMAScript 描述了以下内容:

HTML 4.0 的新特性之一是有能力使 HTML 事件触发浏览器中的动作(action),比如当用户点击某个 HTML 元素时启动一段 JavaScript。下面是一个属性列表,这些属性可插入 HTML 标签来定义事件动作。

                   var ele2=inputs[i];

</body>

比如onkeydown,我们想知道哪个键被按下了,需要问下event对象的属性,这里就时KeyCode;

 

1

length  返回浏览器历史列表中的 URL 数量。

        //4.为a标签添加内容 <a href=";

    function abc(){

        alert(Math.min(1,2));// 1 */

 

        改变元素内容的最简答的方法是使用 innerHTML ,innerText。

 

    var ele=document.getElementById("abc");

例2:

    func1(1,2,3);//3

x.setDate(1);        //设置日1

         </tr>

           temp.value=nowd2;

//结果为"4,5,1,2,3"

    }

5 变量还应遵守以下某条著名的命名规则:

 

    }

 

    function changeNum(num){

 //a变为[1,2,3,5,6,7,8]

    //             0      1      2      3 .............

        }else{

 

实现条件循环,当条件成立时,执行语句1,否则跳出循环体

        <option>book2</option>

 

<script>

        alert("hi");

//x代表数组对象

//   alert(ele4.length)

String对象的方法(4)——  查询字符串

函数typeof :查询数值当前类型
 (string / number / boolean / object )

//

# 2进制: 1 111 001 111 010 100 <-----> 8进制:0171724

<script language="javascript">

 

            margin-top: -100px;

//pop是将数组x的最后一个元素删除

    var city = 'shanghai';

闭包:

 

getHours ()               获取小时

 

         

var city = 'beijing';

    //只要函数名写对即可,参数怎么填都不报错.

    <input class="remove"  type="button" value="<---" onclick="remove();"><br>

     },1000 );

 

 

        }

      函数进入全局,创建VO对象,绑定x属性<入栈>

能表示的最大值是±1.7976931348623157 x 10308

 

sin(x)    返回数的正弦。

var nowd2=new Date("2004/3/20 11:12");

/* sayhello是定义的函数名,前面必须加上function和空格*/

var person=null

 

 

语句2;

 

}

function func(){

                //否==> 关闭窗口(close方法).

//x.unshift(value,...)

 

</script>

//将数字 0~6 转换成 星期日到星期六

getDay ()                 获取星期

   

 

onkeydown      某个键盘按键被按下。          应用场景: 当用户在最后一个输入框按下回车按键时,表单提交.

 

//x.concat(value,...)

 

go()    加载 history 列表中的某个具体页面。

 

////支持

    <input class="remove-all" type="button" value="<===" onclick="remall()">

//                alert(123)

         console.log(this.id);

        var city = 'shanghai';

    var hellostr;

Function 对象也有与所有对象共享的 valueOf() 方法和 toString() 方法。这两个方法返回的都是函数的源代码,在调试时尤其有用。

        //open方法 打开和一个新的窗口 并 进入指定网址.参数1 : 网址.

<div id="div1">

    <script>

全等号和非全等号

 

 

 

1

2

<p id="p2">Hello world!</p>

document.getElementById("p2").style.color="blue";<br>                             .style.fontSize=48px

 

getTime ()                返回累计毫秒数(从1970/1/1午夜)

逻辑 AND 运算符(&&)

        }

 

              ele.classList.add("hide");

  择执行哪一个case的语句块

getFullYear ()            获取完整年份

            top: 0;

  • 创建新的 HTML 元素 

    }

            }

}

 

 

 

}else{

        parent.replaceChild(img, div);

 

         

注:主动抛出异常 throw Error('xxxx')  

getMonth ()               获取月(0-11)

        <option>book9</option>

alert(arr4.toString());

 

var a = new Array(1,2,3);

 

ondblclick     当用户双击某个对象时调用的事件句柄。

 

    <option>请选择市:</option>

    <input class="add"     type="button" value="--->" onclick="add()"><br>

    <input id="ID2" type="button" value="cancel" onclick="action('hide')">

按 Ctrl C 复制代码

    })('123')

# 2进制: 1111 0011 1101 0100   <-----> 16进制:0xF3D4 <-----> 10进制:62420

 

ECMAScript 逻辑运算符

 

        

         <tr>

 

        }

......

var x=1;

 

    }

练习:分别用for循环和while循环计算出1-100的和?

 

 

 

//value表示在删除位置插入的数组元素

</script>

7.1 什么是 DOM?

    func1();     //NaN

    for (var i in doms){

    function parseWeek(week){

1

alert(func1.length)

返回本地时间与GMT的时间差,以分钟为单位

        //1 获得要替换的div区域3

document.write(x.toLocaleString( ) "<br>");

        //1. 创建Date对象

         //java中数组的特性,  规定是什么类型的数组,就只能装什么类型.只有一种类型.

var str2=str1.concat("efgh");

            if (choice=="all"){

alert(a.toString());

       在函数执行过程中,每遇到一个变量,都会检索从哪里获取和存储数据,该过程从作用域链头部,也就是从活

//x.reverse()

//------------------------------------------

<script>

 

    (function(){

//解决 自动补齐成两位数字的方法

//

//               var ele=document.getElementById("ppp");

1

2

3

var str1="hello world";

alert(str1.length);

alert(str1.substr(1,5));

在JavaScript中除了null和undefined以外其他的数据类型都被定义成了对象,也可以用创建对象的方法定义变量,String、Math、Array、Date、RegExp都是JavaScript中重要的内置对象,在JavaScript程序大多数功能都是通过对象实现的

日期和时间的转换:

 

        //alert(Math.round(1.5)); // 四舍五入

节点(自身)属性:

  一次。

 

一元加减法:

 

//setMinutes (minute)     设置分钟

 

        //4.添加

 

执行上下文。

 

 

            <input type="text"/>

 

    var c="10";
    alert(typeof (c));
    c= c;    //类型转换
    alert(typeof (c));
//    -------------------
    var d="yuan";
    d= d;
    alert(d);//NaN:属于Number类型的一个特殊值,当遇到将字符串转成数字无效时,就会得到一个NaN数据
    alert(typeof(d));//Number

     function add(){

    function deleteNode(){

 

        <option>book5</option>

            var ele=document.getElementById("form");

        var month = date.getMonth() 1;

        .hide{

 

按 Ctrl C 复制代码

        // var city = "langfang";

 

-------------------面试题-----------

 

 

    //f(); --->OK

}

<script>

 

1

var name="yuan", age=20, job="lecturer";

    //建议:少定义全局变量

</head>

  • attributes - 节点(元素)的属性节点
  • nodeType – 节点类型
  • nodeValue – 节点值
  • nodeName – 节点名称
  • innerHTML - 节点(元素)的文本值

String对象的方法(5) ——子字符串处理

 

        event.stopPropagation(); //阻止事件向外层div传播.

//如果就想按着数字比较呢?

    if (input.value=="请输入用户名"){

        function inner(){

//方法4:参数为年月日小时分钟秒毫秒

JavaScript 的基础学习(一)

思考题2:                                                                                                              

 

    <meta charset="UTF-8">

var myTestValue = 0, mySecondValue = "hi";

连接数组-concat方法

 

在代数中,我们使用字母(比如 x)来保存值(比如 5)。

 

 

alert(a.toString());

运行功能和for类似,当条件成立循环执行语句花括号{}内的语句,否则跳出循环

Array ,String , Date, Math, Boolean, Number  Function, Global, Error, RegExp , Object

注意:

:  使用之前介绍的方法.

}else{

 

使用{}来封装代码块

case 5:y="星期五";    break;

               

 

         var right=document.getElementById("right");

1

2

3

获得要删除的元素

获得它的父元素

使用removeChild()方法删除

        var parent = div.parentNode;

字符串常量首尾由单引号或双引号括起

    i ;

ToString() :  返回对象的原始字符串表示。
ValueOf()  : 返回最适合该对象的原始值。对于许多对象,该方法返回的值都与 ToString() 的返回值相同。

  • 语法 
  • 类型 
  • 语句 
  • 关键字 
  • 保留字 
  • 运算符 
  • 对象 (封装 继承 多态) 基于对象的语言.使用对象.

window对象

var nowd4=new Date(2004,2,20,11,12,0,300);

//等价于

  16进制和8进制数的表达
           16进制数据前面加上0x,八进制前面加0
           16进制数是由0-9,A-F等16个字符组成
           8进制数由0-7等8个数字组成
           16进制和8进制与2进制的换算

JavaScript属于松散类型的程序语言

    }

     </table>

  • 删除已有的 HTML 元素 

//结果为444,111,12,32

onsubmit      确认按钮被点击。

 

Null 类型

 

//

<div class="models hide">

switch  选择控制语句

    }

     foo.AO={y=underfind, bar:reference of function}

 

        //5.将a标签添加到div中

<input id="ID1" type="text" value="请输入用户名" onblur="Blurs()" onfocus="Focus()">

arr=[1,5,2,100];

 

截取子字符串

 

//结果为"二"

 

Array对象的属性

// 不推荐

//结果为"1,2,3,4,5"

//3.将用户输入的值与 随机数进行比较

 

不过,如果把某个运算数该为数字,那么结果就有趣了:

 

  • 特殊字符的使用方法和效果
  • Unicode的插入方法

   

History 对象属性

  • parentNode - 节点(元素)的父节点 (推荐)
  • firstChild – 节点下第一个子元素
  • lastChild – 节点下最后一个子元素
  • childNodes - 节点(元素)的子节点 

逻辑 AND 运算的运算数可以是任何类型的,不止是 Boolean 值。

var nowd1=new Date();

for  循环控制语句

//setMonth (month)                 设置月

能表示的最小值是±5 x 10 -324

        console.log(a b);//3

 

</script>

sqrt(x)    返回数的平方根。

 

</script>

            <input type="submit" value="点我!" />

 View Code

setInterval()      按照指定的周期(以毫秒计)来调用函数或计算表达式。

    a=1;

 

 

 

    add(1,2)

    (function(){

x.setMonth(7);        //设置月7

x.setTime(870409430000); //设置累计毫秒数

onclick        当用户点击某个对象时调用的事件句柄。

Boolean运算符(重要)

        alert("tony");

  • 核心(ECMAScript) 
  • 文档对象模型(DOM) Document object model (整合js,css,html)
  • 浏览器对象模型(BOM) Broswer object model(整合js和浏览器)
  • Javascript 在开发中绝大多数情况是基于对象的.也是面向对象的. 

Event 对象

         for (var i=0; i<options.length;i ){

 

 

字符串中部分特殊字符必须加上右划线

random()    返回 0 ~ 1 之间的随机数。

 

    function nxAdd(){

 

删除子数组

        createElement(name)

   

                     

 

        }

    if(temp){

总结js的数组特性:

 

    }

<body onload="fun1()">

作用域链(Scope Chain):

1 搜索框

        }

        //大了==> 提示用户大了,让用户重新输入(重复2,3步骤)

 

  • 可以使用变量、常量或表达式作为函数调用的参数
  • 函数由关键字function定义
  • 函数名的定义规则与标识符一致,大小写是敏感的
  • 返回值必须使用return

        <div id="abc_2" style="border:1px solid red;width:200px;height:200px;">

创建Date对象

            pro=(this.options[this.selectedIndex]).innerHTML;

        //3 由父亲操刀

tan(x)    返回角的正切。

这样 a 要被读入寄存器两次,1 和 2 分别被读入寄存器一次。于是你是否发现其实 a 读两次是有点多余的,在你全部比较完之前只需要一次读入寄存器就行了,其余都是额外开销。但是 if 语句必须每次都把里面的两个数从内存拿出来读到寄存器,它不知道你其实比较的是同一个 a。

 

          function fun1() {

 

 }

    //alert(str.match(/o/g)); //查找字符串中 复合正则的 内容.

            acceptInput();

事件通常与函数结合使用,函数不会在事件发生前被执行!event对象在事件发生时系统已经创建好了,并且会在事件函数被调用时传给事件函数.我们获得仅仅需要接收一下即可.

 

    //alert('aaa');

    //创建正则对象方式1  参数1 正则表达式  参数2 验证模式  g global / i 忽略大小写. //参数2一般填写g就可以,也有“gi”.

   

 

if (表达式1) {

    //Math对象

//

}

 

         var right=document.getElementById("right");

什么是AO,VO?

ret();    //beijing

        //4.获得父节点

    console.log(city);

             //var num=Math.random();

//   var ele= div1.getElementsByTagName("p");

按 Ctrl C 复制代码

Function 对象的方法

    if (x==1){

    var str = "bc123";

alert(nowd3.toUTCString());

z=x y

    <select multiple="multiple" size="10" id="left">

prompt()           显示可提示用户输入的对话框。

<a href="rrr.html">click</a>

       

 

按 Ctrl C 复制代码

Date对象的方法—获取日期和时间

var b=a.concat(4,5) ;

var y;

        //alert(Math.random()); // 获得随机数 0~1 不包括1.

                    

        var result=0;

是由Unicode字符、数字、标点符号组成的序列

例如,x=1表示给x赋值为1

 

    //推荐加tab

previousElementSibling  // 上一个兄弟标签元素

     */

y="工作日";

方法讲解:   

             i--;

 

     <button onclick="select('cancel');">取消</button>

推荐导航属性:

对象的概念与分类:

//setHours (hour)         设置小时

        //练习:获取1-100的随机整数,包括1和100

 

    var input=document.getElementById("ID1");

             <td><input type="checkbox"></td>

 a=1;b=2;

//x. splice(start, deleteCount, value, ...)

 

字符串  布尔值:布尔值转换为字符串true或false

实例:

     console.log( i );

        case 0:

    }

        /* alert(Math.max(1,2));// 2

 

      bar.AO={z:underfind}

简介

数字  字符串:数字转换为字符串

</script>

        var eleA =  document.createElement("a");

    }else {

 

JavaScript的基础

 

            right: 0;

3 (了解) 声明变量时 可以不用var. 如果不用var 那么它是全局变量.

arr.sort(intSort);

var bb=new String("hello JavaScript");

 

             <td>444</td>

var nowd3=new Date(5000);

if 可以单独使用

    function select(choice){

//创建字符串对象

2.switch-case只将表达式计算一次,然后将表达式的值与每个case的值比较,进而选

ECMAScript 运算符

函数的scope等于自身的AO对象加上父级的scope,也可以理解为一个函数的作用域等于自身活动对象加上父级作用域.

按 Ctrl C 复制代码

             var option=options[i];

ECMA对象

不区分整型数值和浮点型数值

        b=456

 

按 Ctrl C 复制代码

两种为元素附加事件属性的方式

 

 递增(++) 、递减(--)

与 (&&) 、或(||) 、非(!)

BOM对象

    for(var i in data){

arr1. unshift([6,7]);

            }

  • 整个文档是一个文档节点(document对象)
  • 每个 HTML 元素是元素节点(element 对象)
  • HTML 元素内的文本是文本节点(text对象)
  • 每个 HTML 属性是属性节点(attribute对象)
  • 注释是注释节点(comment对象)

var aa=Number.MAX_VALUE;

 

1

2

3

4

5

6

7

8

9

10

try {

    //这段代码从上往下运行,其中任何一个语句抛出异常该代码块就结束运行

}

catch (e) {

    // 如果try代码块中抛出了异常,catch代码块中的代码就会被执行。

    //e是一个局部变量,用来指向Error对象或者其他抛出的对象

}

finally {

     //无论try中代码是否有异常抛出(甚至是try代码块中有return语句),finally代码块中始终会被执行。

}

数字  布尔值:true转换为1,false转换为0

onkeypress     某个键盘按键被按下并松开。

confirm()          显示带有一段消息以及确认按钮和取消按钮的对话框。

        var div_copy = div.cloneNode(true);

    alert(a b);

    }

 

//push pop这两个方法模拟的是一个栈操作

}

                }else {

x.setMilliseconds(230);        //设置毫秒230

        

在比较时,该运算符还遵守下列规则:

//

var nowd3=new Date("04/03/20 11:12");

 

0 变量是弱类型的(很随便);

}

Undefined 类型只有一个值,即 undefined。当声明的变量未初始化时,该变量的默认值是 undefined。

floor(x)对数进行下舍入。

 

        }

<head>

getDate()                 获取日

返回累计毫秒数(从1970/1/1午夜到本地时间)

    document.write("<br>");

case 1:y="星期一";    break;

 

<button onclick="history.back()">back</button>

        .shade{

            var result = confirm("恭喜您!答对了,是否继续游戏?");

 

a.splice(1,1);

函数的调用

按 Ctrl C 复制代码

    }

<button onclick=" history.forward()">>>></button>

   

String对象的属性

格式编排方法返回值列表

等号和非等号的同类运算符是全等号和非全等号。这两个运算符所做的与等号和非等号相同,只是它们在检查相等性前,不执行类型转换。

    if(num < 10){

DOM 是 W3C(万维网联盟)的标准。DOM 定义了访问 HTML 和 XML 文档的标准:

     })();

    func();

#foo的作用域链: fooScopeChain=[foo.Ao, global.VO];

alert(arr);

String对象的方法(1) —— 格式编排方法

        //参数1 什么都不填 就是打开一个新窗口.  参数2.填入新窗口的名字(一般可以不填). 参数3: 新打开窗口的参数.

alert(a.toString());

        elementNode.getAttribute(name)<-------------->elementNode.value(DHTML)

alert()            显示带有一段消息和一个确认按钮的警告框。

加(+)、 减(-)、 乘(*) 、除(/) 、余数(% )  加、减、乘、除、余数和数学中的运算方法一样  例如:9/2=4.5,4*5=20,9%2=1

:

var arr1=[1,2,3];

//结果为"abcdefgh"

//end是结束位置下一数组元素索引编号

1

2

3

function 函数名 (参数){
函数体;

    return 返回值;

}

onchange       域的内容被改变。             应用场景:通常用于表单元素,当元素内容被改变时触发.(三级联动)

1 每行结束可以不加分号. 没有分号会以换行符作为每行的结束

练习实例:

 

虽然由于字符串的关系,第二种形式写起来有些困难,但有助于理解函数只不过是一种引用类型,它们的行为与用 Function 类明确创建的函数行为是相同的。

    var a=1;
    var b=1;
    a=-a;  //a=-1

 

             right.appendChild(option);

采用new创建字符串对象str1,全局有效

       动对象开始搜索,查找同名的标识符,如果找到了就使用这个标识符对应的变量,如果没有则继续搜索作用域

 View Code

    };

  • 改变 CSS 样式 

function sayHello(){

                    

        //3. 获得当前月份 js中月份是从0到11.

    }

 

//结果为"e,f,g,h"

            }else if(choice=="cancel"){

 

例如typeof(null)          "object "

             event.preventDefault();

window对象

 

open()             打开一个新的浏览器窗口或查找一个已命名的窗口。

onsubmit:

 

否则执行语句2

<div id="id123">事件绑定方式2</div>

节点树中的节点彼此拥有层级关系。

var arr1=['a','b','c','d','e','f','g','h'];

 

</div>

        var option_pro=document.createElement("option");

 

var a = [1,2,3,4,5,6,7,8];

clearTimeout()     取消由 setTimeout() 方法设置的 timeout。

包括:

round(x)    把数四舍五入为最接近的整数。

JavaScript的历史

     <button onclick="select('reverse');">反选</button>

 

              var ele=document.getElementById("ppp");

</html>

 

<div>

 

 

 

var arr1=[32, 12, 111, 444];

ECMAScript 赋值运算符

arr1.shift();

    ------------------arguments的用处1 ------------------

Var MyTestValue = 0, MySecondValue = "hi";

    <div id="div2"></div>

  • 值 null 和 undefined 相等。 
  • 在检查相等性时,不能把 null 和 undefined 转换成其他值。 
  • 如果某个运算数是 NaN,等号将返回 false,非等号将返回 true。 
  • 如果两个运算数都是对象,那么比较的是它们的引用值。如果两个运算数指向同一对象,那么等号返回 true,否则两个运算数不等。 

alert(nowd2.toLocaleString( ));

 

//   alert(ele2.length);

 

//push是将value值添加到数组x的结尾

</script>

    方法讲解:   

a.splice(1,2);

    作用域链和执行上下文都会保存在堆栈中,所以:

 

 

         for (var i in citys){

            };

getSeconds ()             获取秒

运算符void()作用:拦截方法的返回值 

JavaScript概述 

 

 

for (var i=1; i<=9; i ) {

Boolean类型仅有两个值:true和false,也代表1和0,实际运算中true=1,false=0

 

说到基本类型的数值比较,那当然要有两个数。然后重点来了——

        <option>book3</option>

  • 如果一个运算数是 Boolean 值,在检查相等性之前,把它转换成数字值。false 转换成 0,true 为 1。 
  • 如果一个运算数是字符串,另一个是数字,在检查相等性之前,要尝试把字符串转换成数字。 
  • 如果一个运算数是对象,另一个是字符串,在检查相等性之前,要尝试把对象转换成字符串。 
  • 如果一个运算数是对象,另一个是数字,在检查相等性之前,要尝试把对象转换成数字。 

按 Ctrl C 复制代码

            bottom: 0;

 

setTimeout clearTimeout

数组排序-reverse sort

            console.log(city);

    //----------------------------创建方式2  /填写正则表达式/匹配模式;

 

      var p=document.getElementById("province");

             <td>333</td>

   a(a,b)

    var reg2 = /^[a-zA-Z][a-zA-Z0-9_]{5,11}$/g;

while (i<=7) {

 

        img.setAttribute("src", "001.JPG");

首字母是小写的,接下来的字母都以大写字符开头。例如:

 

        //1.获取要克隆的div

    <div class="div2">i am div2</div>

 

 

//x代表数组对象

按 Ctrl C 复制代码

                if (ele2.checked){

b=2

    //点击后 将div区域4 克隆一份 添加到页面底部

alert(strArray[1]);

<script>

//          };

 

    var div=document.getElementById("div2");

default: y="未定义";
}

         alert(arr5[9]);// undefined */

            throw new Error("function f called with " arguments.length " arguments,but it just need 3 arguments")

var arr2=arr1.slice(2,4);

switch (表达式) {

 

        inner();

//方法3:参数为毫秒数

                ele2.checked=true;

alert(nowd3.toLocaleString( ));

     <table border="1" id="Table">

        }

//方法2:参数为日期字符串

        elementNode.setAttribute(name,value)

 

//x.slice(start, end)

 

        var inputs=ele.getElementsByTagName("input");

 

 

 

        var div = document.getElementById("div_1");

获取日期和时间

    function action(act){

1.switch用来根据一个整型值进行多路分支,并且编译器可以对多路分支进行优化

var userNum = prompt("请输入一个0~100之间的数字!","0");

if ( (x==6) || (x==0) ) {

             <td><input type="checkbox"></td>

</div>

ECMAScript  

        elementNode.classList.add

    }

 

 

         var options=document.getElementById("left").getElementsByTagName("option");

var a = [1,2,3];

//setDate(day_of_month)       设置日

   

 

  • 如果某个运算数是 null,返回 null。 
  • 如果某个运算数是 NaN,返回 NaN。 
  • 如果某个运算数是 undefined,返回undefined。 

alert("str2长度 " str2.length);

        for (var num in arguments){

 

History 对象包含用户(在浏览器窗口中)访问过的 URL。

           console.log( j );

setInterval clearInterval

按 Ctrl C 复制代码

 

注意:作用域链的非自己部分在函数对象被建立(函数声明、函数表达式)的时候建立,而不需要等到执行

                    

        global.VO={x=underfind; foo:reference of function}(这里只是预解析,为AO对象绑定声明的属性,函数执行时才会执行赋值语句,所以值是underfind)

分割字符串

//2.让用户输入(prompt)    并接受 用户输入结果

var x=new Date();

        var date = new Date(); //没有填入任何参数那么就是当前时间

arr1.unshift(4,5);

    }

            //阻止表单提交方式1().

Array对象

    document.getElementById("abc_1").onclick=function(){

 

1

2

3

4

5

6

7

8

9

10

11

12

alert(1);

function func1(){

    alert('hello yuan!');

    return 8

}

 

    ret=func1();

    alert(ret)

----------------

 

var func1=new Function("name","alert("hello" name);")

func1("yuan")

    func1(1,2);  //3

函数eval:       将字符串强制转换为表达式并返回结果 eval("1 1")=2 ; eval("1<2")=true

简介

        console.log("yuan")

        if (clock==undefined){

    //jquery下是$(self), 这种方式this参数必须填写;

//x代表数组对象

    <div id="div3">i am div2</div>

//deleteCount删除数组元素的个数

这里,字符串 "25" 将被转换成数字 25,然后与数字 3 进行比较,结果不出所料。

while  循环控制语句

 

        var week = date.getDay(); //没有getWeek

    <title>Title</title>

        //2创建img标签对象 <img />

与逻辑 AND 运算符相似,如果某个运算数不是 Boolean 值,逻辑 OR 运算并不一定返回 Boolean 值

</body>

                acceptInput();

    }else    {

        elementNode.classList.remove

        var div = document.getElementById("div_4");

        eleA.setAttribute("href", "");

</script>

    if(!val.trim()){

        if(isNaN( userNum)){

//          window.onload=function(){

 

常用的转义字符 n:换行  ':单引号   ":双引号  \:右划线

</select>

////不支持

 

x.setSeconds(54);    //设置秒54

            result =arguments[num]

    else if(a<b){

语句1;

  • 由ECMAScript定义的本地对象.独立于宿主环境的 ECMAScript 实现提供的对象.(native object)
  • ECMAScript 实现提供的、独立于宿主环境的所有对象,在 ECMAScript 程序开始执行时出现.这意味着开发者不必明确实例化内置对象,它已被实例化了。ECMA-262 只定义了两个内置对象,即 Global 和 Math (它们也是本地对象,根据定义,每个内置对象都是本地对象)。(built-in object)
  • 所有非本地对象都是宿主对象(host object),即由 ECMAScript 实现的宿主环境提供的对象。所有 BOM 和 DOM 对象都是宿主对象。

 

else if (a == 2) ...

//使用注解

}

            opacity: 0.4;

lastElementChild           // 最后一个子标签元素

}

//x.replace(findstr,tostr)

5 select左右移

 

 

}

<div onclick="alert(123)">点我呀</div>

    }

 

getYear ()                获取年

 

 

//setTime (allms)     设置累计毫秒(从1970/1/1午夜)

在上面的例子中,字符串 "Blue" 小于 "alpha",因为字母 B 的字符代码是 66,字母 a 的字符代码是 97。

 

        //3.为a标签添加属性 <a href=";

var city = 'beijing';

 

4 两级联动

    console.log(div.nextSibling.nodeName);  //思考:为什么不是P?

 

 

2.1 变量

 

<div id="choice">

 

</div>

        var temp=666;

         for (var i=0; i<options.length;i ){

    <option>请选择省:</option>

变量只有在赋值的时候才会确定数据类型

            // 阻止表单提交方式2 event.preventDefault(); ==>通知浏览器不要执行与事件关联的默认动作。

alert(nowd1.toLocaleString( ));

 

       执行时的环境。每个执行上下文都有自己的作用域链,用于标识符解析,当执行上下文被创建时,而它的作用

            //onsubmit 命名的事件函数,可以接受返回值. 其中返回false表示拦截表单提交.其他为放行.

常量 :直接在程序中出现的数据值

    }

 

 

回到顶部

1

2

3

4

5

6

{#1 直接编写#}

    <script>

        alert('hello yuan')

    </script>

{#2 导入文件#}

    <script src="hello.js"></script>  

    }

除了可以表示加法运算还可以用于字符串的连接  例如:"abc" "def"="abcdef"

 

 

String对象的方法(3) —— 获取指定字符

                        

1 声明变量时不用声明变量类型. 全都使用var关键字;

       要经历这样的搜索过程。

var strArray=str1.split(",");

alert(arr1);

    function ADDall(){

 

        console.log(city);

 

 

Window 对象方法

//x.push(value, ...)  压栈

    data={"河北省":["廊坊","邯郸"],"北京":["朝阳区","海淀区"]};

使 JavaScript 有能力与浏览器“对话”。 

var temp=new Object();// false;[];0; null; undefined;object(new Object();)

             showTime();

函数parseFloat: 强制转换成浮点数  parseFloat("6.12")=6.12

//start、end可为负数,-1代表最后一个数组元素

注意:

        var day = date.getDate();

        var min = date.getMinutes();

    }

<div id="box1">

}

1

2

var bResult = "25" < "3";

alert(bResult); //输出 "true"

<div id="abc_1" style="border:1px solid red;width:300px;height:300px;">

    //验证字符串

var i=1;

                   

         //js中的数组特性2: js中的数组,长度是随着下标变化的.用到多长就有多长.

    }

//结果为"6,7,4,5,1,2,3"

    //alert(str.search(/h/g));// 0  查找字符串中符合正则表达式的内容位置

 

        return num;

}

        }

        case 1:

var arr1=[1,2,3];

2.3 常量和标识符

</script>

arr1.reverse(); //颠倒数组元素

    return inner;

 

    /* var reg1 = new RegExp("^[a-zA-Z][a-zA-Z0-9_]{5,11}$","g");

            //num=Math.round(num);

 

             clock=setInterval(showTime,1000);

回到顶部

       //console.log(doms[i])

Event 对象代表事件的状态,比如事件在其中发生的元素、键盘按键的状态、鼠标的位置、鼠标按钮的状态。

    var city = 'shanghai';

Camel 标记法

    <select multiple="multiple" size="10" id="right">

         alert(arr5.length); //11

 

 

-除了可以表示减号还可以表示负号  例如:x=-y

switch基本格式

        <option>book6</option>

            margin-left: -100px;

//结果为111,12,32,444

              ele2.classList.remove("hide");

        alert('111');

var arr4=arr1.slice(2,-1);

        如果找到x属性则使用,找不到继续 在global.VO对象查找,找到x的属性,返回属性值。如果在global.VO中没有找到,则会抛出异常ReferenceError

    }

例如typeof("test" 3)      "string"

             <td>222</td>

    }

 

        input.value="";

 a=1;

        }

Location 对象包含有关当前 URL 的信息。

            left: 50%;

返回国际标准时间字符串

            //close();

//    alert(b);

 for (var i=1; i<=9; i ) {

2 注释 支持多行注释和单行注释. /* */  //

JavaScript中=代表赋值,两个等号==表示判断是否相等

 

 

 

     p.onchange=function(){

    <input id="ID1" type="button" value="click" onclick="action('show')">

   

<script type="text/javascript">

            display: none;

 function func1(){

            ele.onsubmit=function(event) {

#bar的作用域链: barScopeChain=[bar.AO, foo.AO, global.VO];

 

1

2

createElement(name)创建元素

appendChild();将元素添加

按 Ctrl C 复制代码

//结果为"4,5,1,2,3"

    return inner;

 

         </tr>

//在第一个div中动态增加一个a标签. 该a标签点击之后跳转到百度首页.

 

if 控制语句

 

 

匿名函数

 

var str2="";

//addstr为添加字符串

    return a-b;

 

                 

//value可以为字符串、数字、数组等任何值

var cc=new Date();

            left:0;

 

        }

    f(1,2,3,4,5)

} else{

  • BOM对象
  • DOM对象(DHTML)
  • 8 实例练习

 

    //prompt 参数1 : 提示信息.   参数2:输入框的默认值. 返回值是用户输入的内容.

        var div = document.getElementById("div_3");

y="工作日";

例如typeof(true 1)        "number"

//end省略则相当于从start位置截取以后所有数组元素

    alert(hellostr);

var arr3=arr1.slice(4);

 

 

7.4 增删改查演示

 

    所有浏览器都支持 window 对象。

object对象:ECMAScript 中的所有对象都由这个对象继承而来;Object 对象中的所有属性和方法都会出现在其他对象中

 

           var nowd2=new Date().toLocaleString();

arr1.pop();

 

 

toUTCString()

自动创建字符串对象:

数据类型转换

JavaScript的引入方式

<div class="shade hide"></div>

 

scrollTo()         把内容滚动到指定的坐标。

 //a变为[1,5,6,7,8]

          }

思考题1:

   

 

返回本地格式时间字符串

 

 

                num = Math.round(Math.random()*100);

 

      使用上面增和删结合完成修改

        console.log(i) ; // 0 1 2

 

Boolean值主要用于JavaScript的控制语句,例如

            acceptInput();

setTimeout()       在指定的毫秒数后调用函数或计算表达式。

页面查找:

1

alert(void(fun1(1,2)))

 

        //答对了==>提示用户答对了 , 询问用户是否继续游戏(confirm).

<p id="abc">试一试!</p>

 

例1:

        alert('222');

function func(){

String对象的方法(2)——  大小写转换

//setSeconds (second)     设置秒

    var ele=document.getElementById("ID1");

 

      var c=document.getElementById("city");

           

 

         </tr>

 

        //5. 获得当前小时

log(x)    返回数的自然对数(底为e)。

<select id="city">

var ret = func();

        return -1;//1

         </tr>

                 i--;

    document.write("<br>");

//推荐

         }

alert(arr1);

2.4 数据类型

//

function Bar(){

alert(nowd4.toLocaleString( ));

        var ele=document.getElementById("Table");

x=5

//                return false;

var str1="abcdefgh";

        elementNode.className

 

nextElementtSibling       // 下一个兄弟标签元素

 

 

History 对象

    }

    </script>

</select>

 

        //5.替换

 

case 6:y="星期六";    break;

   

Function 对象的 length 属性

 

ret();

             alert("验证失败 表单不会提交!");

//start表示开始位置索引

交互方法:

    var clock;

arr1.sort();    //排序数组元素

String对象

 

        .back{

    var myname=prompt("请问您贵姓?","苑");

 

    function addNode(){

    func1(1);    //NaN

 

//            };

 

 

 

 

        var sec = date.getSeconds();

switchelse if结构更加简洁清晰,使程序可读性更强,效率更高。

        alert(result)

        .models{

//value可以为字符串、数字、数组等任何值

}

    //NaN特点:
   
    var n=NaN;
   
    alert(n>3);
    alert(n<3);
    alert(n==3);
    alert(n==NaN);
   
    alert(n!=NaN);//NaN参与的所有的运算都是false,除了!=

    return arr[week];

for (初始化;条件;增量){

    function end(){

y="周末";

    语句3;

 

 

getTimezoneOffset():8个时区×15度×4分/度=480;

Var iMyTestValue = 0, sMySecondValue = "hi";

   // ----------------------

       

    console.log(temp);//Uncaught ReferenceError: temp is not defined

数组的进出栈操作(2)

var str1="String对象";

    var city = "shanghai";

 

 

            background-color: gold;

 

  • 在节点树中,顶端节点被称为根(root)
  • 每个节点都有父节点、除了根(它没有父节点)
  • 一个节点可拥有任意数量的子
  • 同胞是拥有相同父节点的节点

 

 

 

                ele2.checked=false;

case 4:y="星期四";    break;

        //console.log(doms[i])

    }

location.assign(URL)

 

 

1

var a;

回到顶部

            else {

                alert(123)

Date对象

7.3 HTML DOM Event(事件)

1

2

获取字符串长度

length

        var s=12;

    function showTime(){

        //1 获得要删除的div区域

//x.shift()

    case 值3:语句3;break;

 

    var city = "shanghai";

var str1="一,二,三,四,五,六,日";

...

第一种方式:

 

       函数在执行时会创建一个称为“执行上下文(execution context)”的内部对象,执行上下文定义了函数

             <td>111</td>

//循环输出H1到H7的字体大小

    </select>

    //理由:因为作用域链是栈的结构,全局变量在栈底,每次访问全局变量都会遍历一次栈,//这样会影响效率

    //方法学习:

!0=1
!1=0

执行类型转换的规则如下:

function acceptInput(){

//x代表字符串对象

        option_pro.innerHTML=i;

 

{

onselect      文本被选中。

功能说明

        if(act=="show"){

            acceptInput();

 

var city = 'beijing';

 

是当表单在提交时触发. 该属性也只能给form元素使用.应用场景: 在表单提交前验证用户输入是否正确.如果验证失败.在该方法中我们应该阻止表单的提交.

//毫秒并不直接显示

作用域

    function f(a,b,c){

            open('','','width=200,resizable=no,height=100'); // 新打开一个宽为200 高为100的窗口

 

按 Ctrl C 复制代码

 

parentElement              // 父节点标签元素

 

    语句4;

    }else{

尽管 ECMAScript 是一个重要的标准,但它并不是 JavaScript 唯一的部分,当然,也不是唯一被标准化的部分。实际上,一个完整的 JavaScript 实现是由以下 3 个不同部分组成的:

}

        //4. 获得当前日

创建作用域链的过程

               

本文由时时app平台注册网站发布于web前端,转载请注明出处:javascript彩世界网址

关键词: