JavaScript W3学习笔记

发现《HeadFirst JavaScript》这本书对于有编程基础想要快速入门了解JavaScript和脚本语言的我并不足够好,停止对该书的继续学习。

通过W3School JavaScript教程继续重新学习,并会把个人认为的入门知识点更新在此博客中。

同时推荐两个APP 进行学习

1. W3 学习语言神器,简单明了,适合各种语言入门学习。与PC端浏览相比没有亲自实践功能,但更加方便,可以随时随地学习。

2.Learn JavaScript          Solo learn 出品,基本是把英文版的W3 编辑成教程与小测试的形式,适合有英语基础,想了解CS编程语言基础学习。


在开始记录之前,再描述下自己的情况。

条条大路通CS,个人决定入坑1个月。有C,C++,JAVA编程语言基础,做过安卓课程设计项目。目前还是学生,非计算机专业。在课程中学过网络编程语言HTML,CSS,PHP并了解数据库和简单的SQL语句。对数据结构、算法、设计模式等暂时一无所知。目前出去基础编程语言学习阶段,进行JavaScript学习是想先通过另一种语言了解脚本语言是什么,可以做什么。所学习的只是简单入门的知识点,并不深入了解与实践。博客中只会一一列出我认为JavaScript语言与其他语言不同或者有趣的地方。希望通过博客与大家分享交流。


正文开始,


JavaScript 是一种基于浏览器的客户端脚本语言。

在HTML中使用<script></script>标签 插入JavaScript代码

通过id 访问HTML元素

document.getElementById("demo").innerHTML="My First JavaScript";

 document.write() 仅仅向文档输出写内容。

如果在文档已完成加载后执行 document.write,整个 HTML 页面将被覆盖:


JavaScript对大小写敏感

变量关键字 var   未声明的变量为 undefined

重新声明JavaScript 变量,变量值不会丢失

var carname="Volvo";
var carname;

JavaScript中所有事物都是对象,对象拥有属性和方法

函数关键字 function  直接return 返回变量,如果未有返回值,则默认返回 undefined

全局变量会在页面关闭后被删除,如果未声明标量,则变量默认为全局变量

carname="Volvo";

+ 运算符还可以用于字符串连接

=== 全等运算符 (值与类型)

for/in 循环 遍历对象的所有属性

var person={fname:"John",lname:"Doe",age:25};

for (x in person)
  {
  txt=txt + person[x];
  }

抛出错误捕捉 err 关键字

try
  {
  //在这里运行代码
  }
catch(err)
  {
  //在这里处理错误
  }

HTML DOM (Document Object Model)

JavaScript可以访问所有HTML元素、属性和CSS样式,可以对页面中的事件作出反应

更改元素内容用 innerHTML 

document.getElementById(id).innerHTML=new HTML


更改元素属性

document.getElementById(id).attribute=new value

更改HTML样式

document.getElementById(id).style.property=new style

HTML 事件的例子:

  • 当用户点击鼠标时
  • 当网页已加载时
  • 当图像已加载时
  • 当鼠标移动到元素上时
  • 当输入字段被改变时
  • 当提交 HTML 表单时
  • 当用户触发按键时

使用HTML DOM 分配事件

<script>
document.getElementById("myBtn").οnclick=function(){displayDate()};
</script>

可以创建删除HTML元素

找到您希望删除的子元素,然后使用其 parentNode 属性来找到父元素:

var child=document.getElementById("p1");
child.parentNode.removeChild(child);


JavaScript 中的所有事物都是对象:字符串、数值、数组、函数.


把方法添加到JavaScript对象中

this.changeName=changeName;
function changeName(name)
{
this.lastname=name;
}

JavaScript 是面向对象的语言,但 JavaScript 不使用类

JavaScript 基于 prototype,而不是基于类的

JavaScript for...in 语句循环遍历对象的属性

如果逻辑对象无初始值或者其值为 0、-0、null、""、false、undefined 或者 NaN,那么对象的值为 false。否则,其值为 true

当您检索某个文本时,可以使用一种模式来描述要检索的内容。RegExp 就是这种模式

浏览器对象模型BOM(Browser Object Model)

所有浏览器都支持 window 对象。它表示浏览器窗口。

所有 JavaScript 全局对象、函数以及变量均自动成为 window 对象的成员。

全局变量是 window 对象的属性。

全局函数是 window 对象的方法。


window.navigator 对象包含有关访问者浏览器的信息。

window.navigator 对象在编写时可不使用 window 这个前缀。

JavaScript (helper) 库  这些JavaScript 库常被称为 JavaScript 框架。 


  • jQuery
  • Prototype
  • MooTools


    总结:基础学习结束,可能会继续深入学习ECMAScript 、jQuery框架、AJAX等

    对于脚本语言有了一点点的认知,脚本语言是与客户端(浏览器等)进行交互操作的语言,是用户可以通过客户端使用的应用程序。

    框架是为了更好的使用某种编程语言存在的库,通过库封装函数是编程更有效率。

    JS是面向对象的编程语言,却没有类。所有都为对象封装,使用其属性和方法。

    JS并没有像C++一样严谨的语法,但带来了更加灵活的操作与使用的同时也降低了安全性。

    希望像我一样想做前端开发的小白们有更深入的学习与理解。

    今天看到句英语 与大家共勉。

    I am a slow walker , but I never walk back.

    Bon courage!


  • jQuery
  • Prototype
  • MooTools
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值