由于大学课程缘故，老师巨爱叫人问问题，还记分呢，随便记录一下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学习记录。。。。。。的更多相关文章

  1. JavaScript学习记录二

    title: JavaScript学习记录二 toc: true date: 2018-09-13 10:14:53 --<JavaScript高级程序设计(第2版)>学习笔记 要多查阅M ...

  2. JavaScript学习记录四

    title: JavaScript学习记录四 toc: true date: 2018-09-16 20:31:22 --<JavaScript高级程序设计(第2版)>学习笔记 要多查阅M ...

  3. JavaScript学习记录三

    title: JavaScript学习记录三 toc: true date: 2018-09-14 23:51:22 --<JavaScript高级程序设计(第2版)>学习笔记 要多查阅M ...

  4. JavaScript学习记录一

    title: JavaScript学习记录一 toc: true date: 2018-09-11 18:26:52 --<JavaScript高级程序设计(第2版)>学习笔记 要多查阅M ...

  5. Javascript学习记录——原生JS实现旋转木马特效

    昨天学习到了JS特效部分,然后老师讲了旋转木马特效的实现,如上图.不过只是讲了通过点击箭头实现图片的切换,对于点击图片本身以及二者联动却是没有讲解. 本着一颗追求完美的心,今天花费了一个中午终于将整个 ...

  6. JavaScript学习记录总结（七）——dom对象应用之用户简单管理

    <!DOCTYPE html><html><head><title>users.html</title> <meta name=&qu ...

  7. html+css+javascript学习记录1

    <p> 最近在学一部分前端,知识点很多,却没怎么系统地应用过,因而理解可能不够深吧.所以我想做点片段似的东西,不懂的再在网上搜一搜,这样可能会更有意思点,所以做了这个记录,希望自己坚持下去 ...

  8. JavaScript学习记录总结（九）——移动添加效果

    <!DOCTYPE html><html><head><title>moveOption.html</title> <meta nam ...

  9. JavaScript学习记录总结（十）——几个重要的BOM对象

    一.弹出框 <script type="text/javascript">    window.onload=function(){         window.al ...

随机推荐

  1. 福州大学软件工程1816 | W班 第10次作业[软件工程实践总结]

    作业链接 个人作业--软件工程实践总结 评分细则 本次由五个问题(每个十分)+创意照片(五分)+附加题(十分)组成 评分统计图 千帆竞发图 汇总成绩排名链接 汇总链接

  2. 分布式文件系统FastDFS

    fastdfs_百度百科https://baike.baidu.com/item/fastdfs/5609710 用FastDFS一步步搭建文件管理系统 - bojiangzhou - 博客园http ...

  3. Jmeter监控服务器笔记

    Jmeter监控服务器-CPU,Memory,Disk,Network性能指标 本文主要说一下如何通过JMeter插件来监控服务器CPU.内存.磁盘.网络等相关资源. 一.下载 首先进入网址https ...

  4. Tomcat Windows 系统下安装及注意事项

    1 获取Tomcat 安装包  http://tomcat.apache.org/ tar.gz 文件是Linux系统下的安装版本 exe文件是 Windows系统下的安装版本 zip 文件是Wind ...

  5. Oracle Flashback 详解

    Oracle flashback 是一种方便快捷的数据库恢复技术,它不使用备份文件,通过闪回日志可以使数据库恢复到过去的某个状态,当用户发生逻辑错误时(误删表数据.表.表空间等)需要快速恢复数据库,可 ...

  6. [转帖]全国产 台式机/笔记本/服务器都有 方正龙芯3A3000整机三连发

    台式机/笔记本/服务器都有 方正龙芯3A3000整机三连发 2019年03月29日 17:17 4171 次阅读 稿源:快科技 7 条评论 https://www.cnbeta.com/article ...

  7. MySQL 单个表锁死 对查询语句无响应

    这个时候应该怀疑读取都被加锁,应该尝试使用 show processlist 查看每一个正在运行的进程. 可以看到这样一个列表,里面有使用者即用户,正在使用数据库的 host, 使用的 db 目前的 ...

  8. APP test

    在讲APP测试之前,先讲一下,目前APP的操作系统以及APP相关基础知识. 一.APP基础知识 1.操作系统# 现在移动端的操作系统主流的分为两种:(1)安卓系统 (2)IOS系统. 2.安卓系统# ...

  9. maven（win10）配置完环境变量后无法识别mvn -v命令

    第一步:http://maven.apache.org/download.cgi官网下载 第二步:把压缩包解压缩到不含中文和空格的目录下 第三步:新建MAVEN_HOME环境变量,值为maven解压缩 ...

  10. 一、Dev

    一.获取选中的表格 // MessageBox.Show(gridview_Parent.GetFocusedDataRow()["series"].ToString());//获 ...