js学习笔记

1.js对事件的响应

2.改变html元素内容

test




3.x=document.getElementById("some id")//查找html页面元素
x.innerHTML="wdada"//改变内容
4.匹配字符串
.match("abcd")
5.改变样式
x.style.color="#ff0000";
6.获取输入框的值,验证用户输入
.value
document.getElementById("test").value
7.判断是否为数字
isNaN(x)方法,true表示不是数字,false表示是数字
8.标签表示js脚本,html脚本别虚位于此标签之间,脚本可被放置于或中,通常放在中方便管理
9.引用外部js文件,文件以.js结尾(外部脚本不能包含
10.js输出
js木有打印或输出的函数
但可通过以下方式输出数据
window.alert()/alert()弹出警告框
document.write() 方法将内容写到 HTML 文档中
innerHTML 写入到 HTML 元素
console.log() 写入到浏览器的控制台
11.document.write()直接输出,无需id
innerHTML用于改变元素值
12.通过js获取当前时间
Date()方法
13.如果在文档已完成加载后执行 document.write,整个 HTML 页面将被覆盖。
14.js通过//进行单行注释,通过/* 内容 */进行多行注释
15.js数据类型
字符串(String)、数字(Number)、布尔(Boolean)、数组(Array)、对象(Object)、空(Null)、未定义(Undefined)
16.数组定义形式
一般形式
var arr = new Array();
arr[0] = "a";
document.write(arr[0]);

以键值对形式
    var arr = {a:"a",b:"b"};
    document.write(arr.a);

17.通常认为 js对象是键值对的容器,键值对通常写法为 name : value (键与值以冒号分割)。
18.如果变量在函数内没有声明(没有使用 var 关键字),该变量为全局变量
19.修改自身内容用this

20.常用html事件
鼠标事件
onclick ondbclick onmouseover onmouseout onmouseup(鼠标按键松开)
键盘事件
onkeydown onkeypress onkeyup
表单事件
onblur(元素失去焦点) onchange(表单元素内容改变时)
onfocus(元素获取焦点时) oninput(元素获取用户输入时)
onreset(表单重置时) onsearch(用户向搜索域输入文本时)
onselect(用户选取文本时) onsubmit(表单提交时)
21.反斜杠:转义字符,将特殊字符转换为字符串字符
22.=== 为绝对相等,即数据类型与值都必须相等
23.字符串方法
charAt() 返回指定索引位置的字符
concat() 连接两个或多个字符串,返回连接后的字符串
indexOf()返回字符串中检索指定字符第一次出现的位置
lastIndexOf()返回字符串中检索指定字符最后一次出现的位置
match() 找到一个或多个正则表达式的匹配
replace()替换与正则表达式匹配的子串
search() 检索与正则表达式相匹配的值
split() 把字符串分割为子字符串数组
toString() toLowerCase() toUpperCase() trim() valueOf()
24.break 语句用于跳出循环
continue 用于跳过循环中的一个循环
25.typeof 操作符:检测变量的数据类型
26.js中的5种不同的数据类型
string number boolean object function
3种对象类型
Object Date Array
2种不含任何值的类型
null undefined
27.使用 constructor 属性来查看是对象是否为日期 (包含字符串 "Date"):
var myDate = new Date();
document.getElementById("demo").innerHTML = isDate(myDate);
function isDate(myDate) {
return myDate.constructor.toString().indexOf("Date") > -1;
}
28.toString():转为字符串
Number("222"):将字符串转换为数字
29.js正则表达式
语法:/pattern/modifiers;
实例:var patt = /w3cschool/i
实例解析:/w3cschool/i 是一个正则表达式,w3cschool是一个模式 (用于检索),i 是一个修饰符 (搜索不区分大小写)。
js中通常用于以下两个方法:search() replace()
var str = "Visit W3cSchool!";
var n = str.search(/w3cSchool/i);

    var str = document.getElementById("demo").innerHTML; 
    var txt = str.replace(/microsoft/i,"W3cSchool");
修饰符:i(忽略大小写) g(全局匹配) m(多行匹配)
正则表达式模式:
    方括号用于查找某个范围内的字符:
        [abc]   查找方括号之间的任何字符。
        [0-9]   查找任何从 0 至 9 的数字。
        (x|y)   查找任何以 | 分隔的选项。
    元字符是拥有特殊含义的字符
        \d      查找数字
        \s      查找空白字符。
        \b      匹配单词边界
    test() 方法用于检测一个字符串是否匹配某个模式,如果字符串中含有匹配的文本,则返回 true,否则返回 false。
        /e/.test("The best things in life are free!")

30.js中不支持直接使用enter键换行,字符串断行需要使用反斜杠()
31.表单数据
document.forms["myForm"]["fname"].value
32.JSON 语法规则
数据为 键/值 对。数据由逗号分隔.大括号保存对象,方括号保存数组
33.键/值对包括字段名称(在双引号中),后面一个冒号,然后是值:
{"firstName":"John", "lastName":"Doe"}
34.JavaScript 内置函数 JSON.parse() 将字符串转换为 JavaScript 对象:var obj = JSON.parse(text);(eval()方法作用类似)

35.JSON.stringify() 方法用于将 JavaScript 值转换为 JSON 字符串。
36.javascript:void(0)
void关键字,指定要计算一个表达式但是不返回值。
37.查找 HTML 元素
通过 id 找到 HTML 元素 document.getElementById("intro")
通过标签名找到 HTML 元素 getElementsByTagName("p")
通过类名找到 HTML 元素 getElementsByClassName("intro")
38.绝对不要在文档加载完成之后使用 document.write()。这会覆盖该文档。
39.改变 HTML 元素的属性:document.getElementById(id).attribute=新属性值
40.改变 HTML 元素的样式:document.getElementById(id).style.property=新样式
41.隐藏:onclick="document.getElementById('p1').style.visibility='hidden'"
显示:
onclick="document.getElementById('p1').style.visibility='visible'"
42.onfocus()(与之对应的是onblur()失去焦点事件)
名字:

43.获取年份
new Date().getFullYear()
获取月份
new Date().getMonth()(注意:月份从0-11)
获取几日
new Date().getDate()
获取星期几
new Date().getDay()
44.js math对象
Math.round(2.5) 四舍五入 3
Math.random() 返回0-1之间的随机数
Math.max(1,5,33,555) 返回较大数 555
Math.min(1,5,33,555) 返回较小数 1
45.widow(以下属性可以不用添加window)
widow.location.hostname 主机域名
location.pathname 返回当前页面的路径和文件名
location.port 返回 web 主机的端口 (80 或 443)
location.protocol 返回所使用的 web 协议(http:// 或 https://)
location.href 属性返回当前页面的 URL。
46.history.back() - 与在浏览器点击后退按钮相同
history.forward() - 与在浏览器中点击按钮向前相同
47.JavaScript 弹窗
三种消息框:警告框、确认框、提示框
警告框 alert("sometext");
确认框 当你点击 "确认", 确认框返回 true, 如果点击 "取消", 确认框返回 false,confirm("提示信息")
提示框 prompt("sometext","defaultvalue");
48.JavaScript 计时事件
setInterval() - 间隔指定的毫秒数不停地执行指定的代码。
语法:setInterval("function",milliseconds);
clearInterval()
setTimeout() - 暂停指定的毫秒数后执行指定的代码
语法:setTimeout("javascript 函数",毫秒数);
clearTimeout()
49.JavaScript Cookies
Cookies 用于存储 web 页面的用户信息。
Cookies 的作用就是用于解决 "如何记录客户端的用户信息":
Cookies 以名/值对形式存储 username=John Doe
document.cookie 属性来创建 、读取、及删除 cookies。
document.cookie="username=tom;expires=Thu, 18 Dec 2013 12:00:00 GMT;"(exprires:过期时间)

创建 cookie 来存储访问者名称
    1).设置 cookie 值的函数
    2).获取 cookie 值的函数
    3).检测 cookie 值的函数
        
        
        
            
        

50.引用jQuery

js数据类型转换
转String .toString()
转数字 parseInt() parseFloat()

你可能感兴趣的:(js学习笔记)