诶西，JavaScript学习记录。。。。。。
由于大学课程缘故，老师巨爱叫人问问题，还记分呢，随便记录一下Js的学习情况，以后复习什么的也比较方便吧。。。。。。
开始咯,就按照C语言学习那样的方法来吧！
==================================割割割==================================
1.数据类型（这里只是大概提一下）
/*
我认为Js里没有明显的数据类型，仅有 字符串、数字、布尔、数组、对象、Null、Undefined
*/ var temp = 'legth' var temp = 1
var temp = -3.14159
var temp = 1e9 var temp = false var person {
name : 'lwc'
sex : 'male'
age : 20
} var name = null //undefined
var name
log(name)
2.变量声明
var ans
var mark = false
var i = 0,j = 0,k = 0
var t
log(t)
//这种情况t是undefined
var name = 'Volvo'var name
//这种情况name依然是Volvo
var name = 'Volvo'var name = 'ben'//这种情况name就会被重新赋值
3.数组
//方法1
var ans = [] //方法2
var ans = new Array()
原地址：http://www.w3school.com.cn/jsref/jsref_obj_array.asp
4.函数
//JavaScript的函数的传参并不需要类型声明
function log(a) {
console.log(a)
} function functionname(param1, param2, ...)
{
/* code here */
}
//其实我一直用的是另一种方法来声明调用一个函数
var imageFromPath = function(path) {
var img = new Image()
img.src = path
return img
}
这里我感觉js的规定有点太自由了，类用函数也能定义......
var Ball = function() {
var image = imageFromPath('ball.png')
var o = {
image: image,
x: 100,
y: 200,
speedX: 10,
speedY: 10,
fired: false,
}
o.fire = function() {
o.fired = true
}
o.move = function() {
if (o.fired) {
// log('move')
if (o.x < 0 || o.x > 400) {
o.speedX = -o.speedX
}
if (o.y < 0 || o.y > 300) {
o.speedY = -o.speedY
}
// move
o.x += o.speedX
o.y += o.speedY
}
}
return o
}
var ball = Ball()
基础语法就到这里吧，接下来写一下常见对象的常用方法
5.String
其实常用的也就那么几个
1.indexOf()
stringObject.indexOf(searchvalue, fromindex)返回值为匹配串的起始位置
searchvalue为字符或字符串
fromindex是起始位置
如果找不到返回-1 2.replace()
stringObject.replace(regexp/substr, replacement)
3.str.split(a, [b])以'a'为标识切割str，
返回一个元组并保留前b个
4.match()
该方法可在字符串内检索指定的值，或找到一个或多个正则表达式的匹配。
该方法类似 indexOf() 和 lastIndexOf()，但是它返回指定的值，而不是字符串的位置。
stringObject.match(searchvalue) searchvalue必需。规定要检索的字符串值。只检索一次，返回一个字符串，找不到返回null stringObject.match(regexp) regexp必需。规定要匹配的模式的 RegExp 对象。如果该参数不是 RegExp 对象，则需要首先把它传递给 RegExp 构造函数，将其转换为 RegExp 对象。返回一个元组，找不到返回null
var str = "1 plus 2 equal 3"
console.log(str.match(/\d+/g))
// ["1", "2", "3"]
6.Math
7.Date
8.Events
*9.之前是把Js当做一门语言来讲，接下来比较重要的就是，Js和html的对接了！
⑴首先，最常用的就是验证某些信息是否合法
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<div id="body">
<form class="from-group" action="index.html" method="post" id="form">
<label for="">name</label>
<input type="text" name="username" value="">
<label for="">password</label>
<input type="password" name="password" value="">
<input type="submit" name="" value="click me" onclick="return check();">
</form>
</div>
<script type="text/javascript">
function check() {
var re = /^[a-zA-Z0-9]{6,20}$/g
var message = document.getElementById('form').username.value
console.log(message)
if(!re.test(message)){
alert('用户名或密码格式不正确')
return false
}
else {
alert('Ok!')
return true
}
}
</script>
</body>
</html>
⑵插入、删除一些元素，并修改他们的样式
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<div class="active">
<select id="selector" required="required">
<option value="red">red</option>
<option value="green">green</option>
<option value="black">black</option>
<option value="blue">blue</option>
</select>
<button type="button" name="button" class='btn'>add</button>
<button type="button" name="button" class='btn'>remove</button>
</div>
<script type="text/javascript">
var p = document.getElementsByClassName('btn')
p[0].addEventListener('click', function(event){
var s = document.querySelector('#selector')
var addP = new function(){
var para = document.createElement('p')
var node = document.createTextNode('这是一个新段落。')
para.appendChild(node)
para.style.color = s.value
document.querySelector('#body').appendChild(para)
}
})
p[1].addEventListener('click', function(event){
var b = document.querySelector('#body')
var arrayp = document.getElementsByTagName('p')
console.log(arrayp);
while(arrayp.length != 0) {
b.removeChild(arrayp[0])
}
})
</script>
</body>
</html>
evermore更多请参照http://www.w3school.com.cn/jsref/dom_obj_window.asp
诶西，JavaScript学习记录。。。。。。的更多相关文章
- JavaScript学习记录二
title: JavaScript学习记录二 toc: true date: 2018-09-13 10:14:53 --<JavaScript高级程序设计(第2版)>学习笔记 要多查阅M ...
- JavaScript学习记录四
title: JavaScript学习记录四 toc: true date: 2018-09-16 20:31:22 --<JavaScript高级程序设计(第2版)>学习笔记 要多查阅M ...
- JavaScript学习记录三
title: JavaScript学习记录三 toc: true date: 2018-09-14 23:51:22 --<JavaScript高级程序设计(第2版)>学习笔记 要多查阅M ...
- JavaScript学习记录一
title: JavaScript学习记录一 toc: true date: 2018-09-11 18:26:52 --<JavaScript高级程序设计(第2版)>学习笔记 要多查阅M ...
- Javascript学习记录——原生JS实现旋转木马特效
昨天学习到了JS特效部分,然后老师讲了旋转木马特效的实现,如上图.不过只是讲了通过点击箭头实现图片的切换,对于点击图片本身以及二者联动却是没有讲解. 本着一颗追求完美的心,今天花费了一个中午终于将整个 ...
- JavaScript学习记录总结（七）——dom对象应用之用户简单管理
<!DOCTYPE html><html><head><title>users.html</title> <meta name=&qu ...
- html+css+javascript学习记录1
<p> 最近在学一部分前端,知识点很多,却没怎么系统地应用过,因而理解可能不够深吧.所以我想做点片段似的东西,不懂的再在网上搜一搜,这样可能会更有意思点,所以做了这个记录,希望自己坚持下去 ...
- JavaScript学习记录总结（九）——移动添加效果
<!DOCTYPE html><html><head><title>moveOption.html</title> <meta nam ...
- JavaScript学习记录总结（十）——几个重要的BOM对象
一.弹出框 <script type="text/javascript"> window.onload=function(){ window.al ...
随机推荐
- 自己实现数据结构系列三---Stack
一.代码部分 1.定义接口 public interface Stack<E> { int getSize(); boolean isEmpty(); void push(E e); E ...
- tomcat redis 集群 session共享
jcoleman/tomcat-redis-session-manager: Redis-backed non-sticky session store for Apache Tomcathttps: ...
- 一条SQL语句执行得很慢的原因有哪些？(转)
一条 SQL 语句执行的很慢,那是每次执行都很慢呢?还是大多数情况下是正常的,偶尔出现很慢呢?所以我觉得,我们还得分以下两种情况来讨论. 1.大多数情况是正常的,只是偶尔会出现很慢的情况. 2.在数据 ...
- springboot 如何操作redis
1.首先应该引入 依赖 <dependency> <groupId>org.springframework.boot</groupId> <artifactI ...
- Centos6.8 安装git
1.下载安装包 wget https://mirrors.edge.kernel.org/pub/software/scm/git/git-2.8.0.tar.gz 2.安装依赖 sudo yum - ...
- 【转】Git 代码行统计命令集
查看git上个人代码量 git log --author="username" --pretty=tformat: --numstat | awk '{ add += $1; su ...
- 在eclipse中spring的xml配置文件标签中class路径全限定名自动提示设置
这个自动提示其实很简单,没有网上说的那些要在help下的Install中输入网址来下载更新一堆东西那么复杂. 只需要打开Help — — >Eclipse Marketplace... 然后在该 ...
- python3文字转语音
#安装库(必须先安装pywin32) pip3 install pyttsx3 简单测试 import pyttsx3 engine = pyttsx3.init() text='name' engi ...
- iview render bug & vue namespace bug
iview render bug https://codepen.io/xgqfrms/pen/gyGjKP https://codepen.io/xgqfrms/full/gyGjKP bug &l ...
- Serialize a Long as a String
今天在写接口的时候,用postman测试,返回数据与数据库一一对应,但是给前端返回的结果,除了主键id以外,其他都一样,如下 postman: { "unitPrice": nul ...