序,学习前端页面编程技术,JS是不得不学的一门技术,目前JS不仅可以作为前端编程语言,在服务器端也有了一定发展,例如NodeJS。废话不多书,本篇博客主要介绍JS作为前端语言,怎样获得和改变HTML标签。

另外,这篇文章是基础知识的总结,相当于学习笔记,请高手绕行,哈哈。。。

一、编程基础知识

1、一个网页一般由三层组成:内容层:html文件,展现层:css文件,行为层:js文件。

2、编程中,最好将JS放置在单独的文件中。而不要把JS和HTML混合在一起。

3、JS大小写敏感

二、JS基础指令

1、变量

定义变量 var quantity = 5;

变量命名:不能以数字开头,变量名中,不能使用连字符(-)或点(.)号。

2、数据类型

JS中数据类型有数字类型、字符串类型、布尔类型、数组、对象、undefined、null。JS是弱类型语言。

3、算术操作符

加(+) - * / ++ -- %

三、函数、方法与对象

函数声明、函数表达式、匿名函数

对象:包括属性(变量)和方法(函数)

通过点标记语法使用属性和方法hotel.name;hotel.checkAvailability();

数组:

var hotels = ['Quay','Park','Beach']

创建对象:构造函数语法

var hotel = new Object();

hotel.name = 'Quary';

hotel.checkAvailability = function(){

return this.rooms - this.booked;

}

内置对象:

浏览器对象模型(BOM):

示例:

window.print();产生一个浏览器对话框

window.screen.width;screen对象的width属性告诉我们设备的像素宽带。

文档对象模型(DOM)

示例:

<>的为标签,不含<>的为属性

常用对象和方法

window.alert() 创建含有消息的对话框(需要单击OK才能关闭)

window.open()新的浏览器窗口中打开参数中指定的URL(如果浏览器安装了阻止窗口弹出的软件,这个操作可能会失败)

window.print()告诉浏览器用户想要打印当前页的内容(其行为就像用户单击了浏览器界面中的打印选项)

document.title当前文档的标题

document.lastModified 文档最后一次被修改的日期

document.URL 返回包含当前文档URL的字符串

document.domain 返回当前文档的域

document.write()将文本写入文档

document.getElementById()返回与id属性值相匹配的元素

document.querySelectorAll()返回一组元素,这些元素都符合参数中定义的CSS选择器

document.createElement()创建新元素

document.createTextNode()创建新的文本节点

String.length

toUpperCase()

toLowerCase()

charAt() 返回索引编号的字符

indexOf()

lastIndexOf()

subString()

split() 将字符串分隔,然后将它们存储在一个数组中

trim() 删除字符串开始和结尾的空格

replace()  只替换第一个查找的项

JS是弱类型的语言

Math对象

Math.PI

Math.round()

Math.sqrt() 返回平方根

Math.ceil()

Math.floor()

Math.random() 从0到1的苏技术

Date()对象和Time()对象

getDate() setDate()

getDay()

getFullYear() setFullYear()

getHours() setHours()

getMilliseconds() setMilliseconds()

getMinutes() setMinutes()

getMonth() setMonth()

getSeconds() setSeconds()

getTime() setTime()

getTimezoneOffset()

toDateString()

toTimeString()

toString()

四、判断和循环

和java类似

五、文档对象模型

当浏览器加载Web页面时,会在内存中创建页面的模型。

p178页面

六、事件

七、JQuery

八、Ajax与JSON

JavaScript初级教程(Jquery)的更多相关文章

  1. JavaScript强化教程——jQuery AJAX 实例

    什么是 AJAX?AJAX = 异步 JavaScript 和 XML(Asynchronous JavaScript and XML).简短地说,在不重载整个网页的情况下,AJAX 通过后台加载数据 ...

  2. JavaScript强化教程——jQuery UI API 类别

    ---恢复内容开始--- 主要介绍:JavaScript强化教程​—— jQuery UI API 类别 jQuery UI 在jQuery 内置的特效上添加了一些功能.jQuery UI 支持颜色动 ...

  3. Yeoman+Bower+gulp web前端自动化工作流程(初级教程)

    Yeoman包括了三个部分yo(脚手架工具).grunt/gulp(构建工具).bower(包管理器).听说gulp更容易上手,所以我就没用grunt而选的gulp 什么是开发流程? 在我看来一个完整 ...

  4. JavaScript强化教程——JavaScript 总结

    本教程中我们向您讲授了如何向 html 页面添加 JavaScript,使得网站的动态性和交互性更强. 你已经学习了如何创建对事件的响应,验证表单,以及如何根据不同的情况运行不同的脚本. 你也学到了如 ...

  5. JQuery强化教程 —— jQuery Easing

    从jQuery API 文档中可以知道,jQuery自定义动画的函数.animate( properties [, duration] [, easing] [, complete] )有四个参数: ...

  6. 《JavaScript基础教程(第8版)》PDF

    简介:JavaScript基础教程(第8版)循序渐进地讲述了JavaScript及相关的CSS.DOM.Ajax.jQuery等技术.书中从JavaScript语言基础开始,分别讨论了图像.框架.浏览 ...

  7. Web前端-JavaScript基础教程上

    Web前端-JavaScript基础教程 将放入菜单栏中,便于阅读! JavaScript是web前端开发的编程语言,大多数网站都使用到了JavaScript,所以我们要进行学习,JavaScript ...

  8. 极客技术专题【011期】:EasyUI初级教程

    来源:GBin1.com 技术专题:EasyUI初级教程 分享人:极客标签技术编辑 - html580(请站内关注分享人) 资深Web前端工程师,HTML580创始人,目前就职于广州一间软件公司.多年 ...

  9. jquery教程-Jquery 获取标签个数 size()函数用法

    jquery教程-Jquery 获取标签个数 size()函数用法,size() 方法返回被 jQuery 选择器匹配的元素的数量. 语法 $(selector).size()     jQuery ...

随机推荐

  1. python selenuim使用代理的方式

    一.FireFox浏览器 myProxy = "60.195.250.55:80" proxy = Proxy({ 'proxyType': ProxyType.MANUAL, ' ...

  2. [wikioi2926][AHOI2002]黑白瓷砖(Polya定理)

    小可可在课余的时候受美术老师的委派从事一项漆绘瓷砖的任务.首先把n(n+1)/2块正六边形瓷砖拼成三角形的形状,右图给出了n=3时拼成的“瓷砖三角形”.然后把每一块瓷砖漆成纯白色或者纯黑色,而且每块瓷 ...

  3. 理解C#事件

    前面文章中介绍了委托相关的概念,委托实例保存这一个或一组操作,程序中将在某个特定的时刻通过委托实例使用这些操作. 如果做过GUI程序开发,可能对上面的描述会比较熟悉.在GUI程序中,单击一个butto ...

  4. angular_form

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

  5. Java web 学习之旅

    java web学习之旅 来公司十天了,感觉已经慢慢地融入了这个环境中,几个学长人都很好,都是在他们帮助下,我才能比较顺利的开始了学习java web的旅途. 来这里学习的第一个阶段是做一个简单的用户 ...

  6. WebView与JavaScript的交互

    目录: 一.整体思路 二.简单例子实现过程        1.打开项目的asset目录,创建新的文件test.html        2.补充html代码:添加供本地调用的js方法.调用本地方法的js ...

  7. Ibatis对日期的处理

    最近在项目中出现两种情况(因为项目比较早,经历各个版本的改动,所有设计不一致),第一种:数据库中某一字段为Date类型,对应的bean中的类型为java.util.Date,所有在对应的映射中会出现字 ...

  8. spring aop开发常见错误

    1. Exception in thread "main" org.springframework.beans.factory.BeanDefinitionStoreExcepti ...

  9. 获取request的变量

    由于IP代码未实现,先注释掉. package com.helloweenvsfei.servlet; import java.io.IOException; import java.io.Print ...

  10. ajax使用post提交中文

    Ajax使用POST提交中文乱码问题 前段时间写JSP,使用AJAX以POST方式提交数据,如果是中文字符提交就会乱码,后来写ASP时用到AJAX以POST方式提交数据,中文一样是乱码.搜索一下相关资 ...