第0讲 内容概述
Javascript有以下三部分组成:
ECMAScript (Flash:actionscript, Silverlight)
DOM
BOM
document.getElementById('mydiv').style.left
第1讲 JavaScript背景知识
结构(Structure) HTML XHTML
表现(Presentation) CSS
行为(Behavior) ECMAScript, DOM, BOM
第2讲 JavaScript基础
Camel标记法
Pascal标记法
匈牙利标记法
数组: a
布尔值: b
浮点数: f
函数: fn
整数: i
对象: o
正则表达式: re
字符串: s
变型: v
未定义: Undefined
空: Null
对象: Object
1. 字符串函数(String):
length属性
charAt(i)
indexOf()
lastIndexOf() 找不到返回-1
slice, substring, substr
slice支持负数,并且支持数组操作
substring可以倒置序号,负数为0
substr起始位置,长度
document.write可以直接写html网页
2. 数值型(Number)
9e5 科学计数法
toExponential()
3. 布尔型 (Boolean)
true,false
typeof(true)
数值类型转换为字符串,可以用toString(2,8,16)进行进制转换。
boolean
number
string
object
4. 数组
var arr = new Array(1,"1",true);
var arr = [1,2,3];
join()方法,改变连接数组项的“,”分隔符
split()方法,字符串风格成数组
reverse()方法,数组反序,可以用来进行字符串反转
sort()方法,数组元素排序
push(),pop实现栈的功能
var iNumber = Number(prompt("请输入一个数字", ""));
if (isNaN(iNumber)) {
}
日期对象
var myDate = new Date();
date1 - date2 毫秒数
new Date("month dd,yyyy hh:mm:ss")
new Date("month dd,yyyy")
new Date(yyyy,mth,dd,hh,mm,ss);
new Date(yyyy,mth,dd);
new Date(ms);
Math Object
ceil() floor(), round()
Math.floor(Match.random()*total + firstnumber)
Window对象
var win = window.open(url,"_blank","height=300,width=400,resizable=yes");
oWin.close();
oWin.opener
if (window.confirm("xxx")) {}
document Object
anchors
applets
embeds
forms
images
links
Location Object
location.href = url
location.replace(url) 不可以使用后退
location.reload(true,false) 默认是false
Navigator 对象
userAgent属性可以检测浏览器版本及操作系统版本
Screen 对象
window.moveTo(0,0);
window.resize(screen.availWidth,screen.availHeight);
第3讲 CSS基础
行内样式 style
内嵌式 <style></style>
链接式
导入式 @import url(1.css);
标记选择器 <p>
类别选择器
.class
ID选择器
#id
p b {} b标记嵌套p才有效
子选择器 ul.myList > li > a
属性选择器 a[title=CSS] {};
CSS设置文字效果
(1)文字样式
font-family 字体
font-size 字号
color
font-weight 粗细
font-style 斜体
text-decoration 下划线,删除线,顶划线
(2)段落文字
(3)首字放大
参见 project CSS基础 首字放大.jsp
CSS设置图片效果
(1)图片的边框
参见 project CSS基础 图片的边框样式.jsp
(2)图文混排
参见 project CSS基础 图文混排.jsp
CSS页面背景设置
(1) 设定背景颜色实现页面分块
参见 project CSS基础 背景颜色实现页面分块.jsp
(2) 设定背景图片
参见 project CSS基础 背景图片.jsp
(3) 设定超链接效果
参见 project CSS基础 设定超链接效果.jsp
第4讲 CSS进阶
1. <div>与<span>
<div>是段落标记
<span>是行标记
2. 盒子模型
content,border,padding和margin四个部分组成
浏览器兼容性:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
IE:height+width指content + padding + border
Firefox:content
3. 元素的定位
float定位
float:left;
position定位 absolute 四个属性:left,rigth,top,bottom
position: absolute;
父块采用position时,则子块相对与父块
若子块采用position:relative,则父块设置的padding起作用
若不希望div大小充满屏幕,自己设置float或width
Z-index: 页面垂直管理
CSS排版观念
<div id="container">
<div id="banner">
<div id="content">
<div id="links">
<div id="footer">
</div>
分享到:
相关推荐
精通JavaScript+Jquery视频教程(共16讲)(15)
提供的“精通 Javascript+jQuery 视频下载地址.txt”文件很可能是视频课程的链接列表,通过这些视频教程,学习者可以按照章节逐步学习,理论结合实践,从而全面提高自己的 JavaScript 和 jQuery 技能。 总之,精通 ...
在学习过程中,配合教程提供的文本资料《2010年北风网CJ讲师JavaScript+Ajax+jQuery视频教程.txt》,可以加深对课程内容的理解,巩固所学知识。该文档可能包含了课件笔记、代码示例、练习题和解决方案,是学习过程中...
**jQuery视频教程及详细说明** 本教程旨在深入探讨jQuery这一强大的JavaScript库,它极大地简化了网页的DOM操作、事件处理、动画制作以及Ajax交互。jQuery以其简洁的语法和丰富的插件,成为前端开发者不可或缺的...
《一头扎进 JQUERY 视频教程》是由java1234出品的系列教程,旨在帮助初学者快速理解和掌握jQuery这一强大的JavaScript库。jQuery是Web开发中的一个关键工具,它简化了JavaScript的许多复杂操作,使得DOM操作、事件...
《JQuery实战》视频教程源码及PPT是一套针对前端开发者精心编排的课程资源,旨在深入浅出地教授如何高效使用JQuery这一强大的JavaScript库。本教程通过丰富的实例和PPT讲解,帮助学习者从基础到进阶,全面掌握JQuery...
《精通JavaScript+jQuery》是针对Web前端开发人员的一本深入学习指南,主要涵盖了JavaScript语言的基础与高级特性,以及jQuery库的广泛使用。JavaScript是一种广泛应用于客户端网页开发的脚本语言,它赋予网页动态...
在动力节点的这套视频教程中,你将学习如何整合SSM框架,创建高效的数据访问层,以及如何在前端使用JavaScript、jQuery和Ajax进行交互。这包括但不限于以下内容: 1. Spring框架的基本概念,如IoC容器、bean的生命...
《妙味视频+JavaScript+jQuery+HTML5+CSS3视频教程(88GB)+项目实战》是一套全面而深入的Web前端技术学习资源,旨在帮助学员掌握JavaScript、jQuery、HTML5和CSS3的核心概念和实战技能。这个压缩包包含了大量的教学...
妙味课堂的这个原创JavaScript视频教程,旨在帮助初学者系统地学习和掌握JS的基础知识。 教程共分为5课,涵盖了JavaScript的基础内容,以下是每一课可能涉及的关键知识点: **第1课:JavaScript入门** - ...
这个“精通javascript+jquery(源代码)”的压缩包显然包含了一个教学资源,提供了源代码实例,帮助学习者深入理解这两种技术。 JavaScript 是一种轻量级的解释型编程语言,主要用于客户端的网页开发。它允许开发者...
在《JQuery教程全集》的第一章中,作者首先阐述了为何选择 JQuery 这个 JavaScript 库。随着 Web 开发技术的发展,JavaScript 的使用变得越来越普遍。然而,在没有库或框架的支持下,编写复杂的 DOM 操作和 AJAX ...
【标题】"artech-javascript-jquery-15" 暗示了这是一个关于JavaScript和jQuery的第15个主题的教程或者讲座内容,可能是视频形式。Artech可能是一个教育机构或个人,专注于IT技术的教学。 【描述】"artech-...
5. 下载技巧:文档中提到了如何下载视频教程的技巧,指出可以使用特定的软件嗅探并下载flv格式的视频文件,这说明了在无法在线直接观看教程的情况下,用户也可以通过其他途径获取教学资源。 综上所述,文件内容所...
HTML+CSS+JavaScript+JQuery+JSP学习笔记为本人看各种教程视频记录下来的,希望对大家有帮助。
**jQuery实战视频教程中需要使用的JQuery文件** 在学习JavaScript库和框架的过程中,jQuery是一个非常重要的工具,尤其对于初学者来说,它简化了许多DOM操作、事件处理和Ajax交互。本教程将聚焦于jQuery的核心概念...
### jQuery EasyUI视频教程知识点概览 #### 一、jQuery EasyUI简介 - **定义**:jQuery EasyUI是一种简化Web开发的工具集,它通过整合jQuery框架与一系列UI组件,帮助开发者快速创建出功能丰富且视觉效果良好的用户...
通过以上步骤,我们便能实现一个基本的jQuery视频弹出效果。在实际项目中,可能还需要考虑其他因素,如防止页面滚动、阻止视频自动播放等,以提供更完善的用户体验。此外,除了YouTube,还可以集成其他视频平台(如...
【描述】"artech-javascript-jquery-11"的描述简洁,但我们可以推测这是ArtTech系列教程的一部分,专注于jQuery的深入学习。这个系列可能已经涵盖了基础概念,现在正向更专业或特定的主题发展,比如高效的选择器、...