中国临海建设规划局网站,广东seo推广公司,站长之家的作用,双鸭山建设网站一文入门HTMLCSSJS#xff08;样例后续更新#xff09;前言HTML#xff0c;CSS和JS的关系HTMLhead元素titlelinkmetabody元素设置网页正文颜色与背景颜色添加网页背景图片设置网页链接文字颜色设置网页边框文字与段落标记普通文字的输入对文字字体的设置 font使用文字的修饰…
一文入门HTMLCSSJS样例后续更新前言HTMLCSS和JS的关系HTMLhead元素titlelinkmetabody元素设置网页正文颜色与背景颜色添加网页背景图片设置网页链接文字颜色设置网页边框文字与段落标记普通文字的输入对文字字体的设置 font使用文字的修饰标记设置文字格式标题字设置 h1段落标记 p换行标记 br预格式化标记 pre剧中标记 conter水平线标记 hr设置滚动字幕列表标记有序列表有序列表的前导符设置无序列表图片标记框架结构左右分割窗口上下分割窗口嵌入浮动框架标记超链接创建超链接书签链接文件下载在网页中使用表格表格标记tr标记td和th标记在网页中创建表单表单标记包括文本域标记CSS基础语法选择器CSS常用属性常用字体属性常用文本属性常用列表属性常用颜色背景属性HTML中引入CSS方式内联方式嵌入方式连接方式CSSDIV布局盒子模型盒子border属性盒子padding属性盒子margin属性盒子的浮动盒子的定位Div标记与Span标记JS基础变量常量数据类型Html中引入JS脚本方式事件驱动事件处理脚本函数JavaScript常用对象string对象Math对象:Date对象Document 对象方法window对象延时函数前言
23年2月27号刚刚入学奥克兰大学PGD of CS Semester One选了CS732这门课本来以为用Django水水就能过去的课程老师却开始教ReactReact作为最新的前端框架在国内的使用率本身就不高再加上自己之前前端完全没有受过系统的训练之前写的全栈项目基本都是复制粘贴现成的CSS和JS模板然后用Bootstrap现成的网页模板做的。但是这门课期中有一个20%总成绩的测试所以还是需要好好学一学前端的一些基础。
此文不用于任何商业用途完全是个人学习过程以及资料的汇总侵必删。
HTMLCSS和JS的关系
HTML、CSS、JSJavaScript共同构建了我们看到的所有网页展示和交互。
HTMLHyperText Markup Language是超文本标记语言。CSSCascading Style Sheets是级联样式表。JavaScript 是一种脚本语言主要用于前端页面的 DOM 处理。
文本的意思大家应该都明白随手在桌面上建立一个 .txt 文件就是一个文本文件。
那什么是 HTML 超文本标记语言呢超文本就是超越文本的意思表示它不仅仅是简单的文本它比普通的 .txt 文件还要高级。那到底高级在哪里呢第二个词 Markup 标记就是对一个普通的 .txt 文件里的文字进行标记标记其中的一段为 title标记另一段应该另起一行标记任意一段为某个意思等。
最后这些记号超越了普通文本的标记它们对普通文本的修饰构成了一套规则这套规则就是 HTML。
以盖房子类比必须定义这个房子有多长、多宽每一块面积如何规划例如哪里是卫生间、哪里是饭厅、哪里是卧室。将这些定义好网页也就有了最基本的样子。总之HTML 就是用来布局网页中的每一个元素的。
CSS 中的“样式”就是指外观。还以盖房为例定义好了各个空间房子也盖起来了但还要装修例如给客厅贴壁纸、给卧室铺地板。CSS 就是起装修作用的要和 HTML —起配合使用。
JavaScript 是一种脚本语言它在网页中的作用是控制 HTML 中的每一个元素有时要删除元素有时要添加新元素。
大家可能遇到过这样的场景单击网页上的一个按钮会有一个网页上从没有过的元素显示出来这就是利用 JavaScript 实现的。
房子已经装修好贴上了墙纸铺上了地板桌子、板凳、沙发都已经摆好一切都很完美。可是一个有生活情趣的住户时常要买些新家具或者把茶几换个位置这时移动、添加、减少物件就只能靠 JavaScript 实现。
当前互联网上的任何一个网页都是由它们三个构建起来的虽然简单但不可不知。
HTML
head元素
head元素是所有头部元素的容器指示浏览器再何处可以找到样式表提供元素信息等 以下标签都可以添加到head部分
标签描述head定义关于文档的信息title定义文档标题base定义页面上所有链接的默认地址或默认目标link定义文档与外部资源之间的关系meta定义关于HTML文档的元数据script定义客户端脚本style定义文档的样式信息
表格上我们可以先掌握, , , /link
title
title元素可定义浏览器窗口的标题比如我现在用CSDN写文章的窗口标题 link
link元素可以设置网页的logo比如CSDN的logo的引用 通常情况下代码如下
link relicon href./images/图标图片.ico typeimage/x-icon /
link hrefimg/divcss5.css relstylesheet typetext/css /meta
指定网页的描述关键词文件的最后修改时间作者以及其他元数据。 元数据不会显示在客户端但是会被浏览器解析。
meta charsetUTF-8
meta namedescription content定义web页面描述
meta namekeywords content用于搜索引擎识别关键词
meta nameauthor content定义页面作者指定时间自动刷新这里设置的是2秒
meta http-equivrefresh content2 /指定时间跳转道指定页面
meta http-equivrefresh content5;URLhttp://www.baidu.com /下面这两个一个在JS会讲一个在CSS会讲后面再学习现在可以先跳过
script
stylebody元素
设置网页正文颜色与背景颜色
网页正文的颜色默认是黑色的背景颜色是白色的。 网页背景颜色可以使用bgcolor属性。 text指定文本颜色
body bgcolor#336699 textwhite 设定页面背景颜色为深蓝色添加网页背景图片
body background“背景图⽚的URI” bgproperties“images/moon.png bgpropertfixed设置网页链接文字颜色
alink#bbded6 vlink#6b48ffalink属性设置正在访问中的链接文字颜色。 vlink属性设置访问过后的链接文字颜色 未 访问状态下的链接文字颜色
center
pa hrefhttp://www.csdn.netcsdn链接颜⾊/a/p
pa hrefhttp://www.baidu.com百度链接颜⾊/a/p
pa hrefhttp://www.microsoft.com微软链接颜⾊/a/p
/center设置网页边框
body leftmargin“边距值” rightmargin“边距值” topmargin“边距值” bottommargin边距值
body leftmargin52px topmargin38px页面的上边距为38个像素左边距为52个像素
文字与段落标记
普通文字的输入
普通文字的输入
普通文字包括英文和汉字等字符
body/body标记对之间的输入即可
空格的输入
注意通过空格键输入的多个空格在浏览器浏览时将只保留一个空格其余空格都会被自动截掉
故为了在网页中增加空格可以在网页源代码中使用空格对应的字符代码
nbsp;特殊文字的输入 注释语句
基本语法!-- 注释内容 --对文字字体的设置 font
默认—黑色、宋体、3号字
font face字体名称 size字号 color颜色值文字内容/font使用文字的修饰标记设置文字格式
使用文字的修饰标记设置文字格式 标题字设置 h1
基本语法
h1标题字/h1字号的大小可分为六级分别用标记h1~h6表示字号的大小随数字增大而递减 同时标题字的align属性可以设置标题字的对齐方式
基本语法h2 align对⻬⽅式标题字/h2
align属性值 》 left、center、right段落标记 p
基本语法
p align对⻬⽅式段落内容/p换行标记 br
单标记基本语法 br/语法说明 一个换行使用一个,多个换行可以连续使用多个
预格式化标记 pre
所谓预格式化指的是某些格式可以在源代码中预先设置这些预先设置好的格式在浏览器解析代码是被保留下来。
剧中标记 conter
center标记可以设置对象相对于浏览器窗⼝在⽔平⽅向上的居中对⻬
center.../center水平线标记 hr
设置滚动字幕
marquee hello /marquee列表标记
有序列表
基本语法
ol
li列表项⼀/li
li列表项⼆/li
/ol有序列表的前导符设置
ol type前导符 type可以修改有序列表的前导符无序列表 图片标记
目前图片格式有GIF、JPEG、PNG 基本语法
img src图⽚⽂件路径设置图片大小
img src图⽚⽂件路径 width宽度 height⾼度设置图片提示文本
img src图⽚路径 alt提示⽂本设置图片与周围对象的间距
img src图⽚⽂件路径 hspace⽔平间距 vspace垂直间距设置图片对齐方式
img src图⽚⽂件路径 align对⻬⽅式框架结构
框架的作用是把浏览器窗口划分为若干个小窗口每个小窗口可以分别显示不同的网页
框架的基本结构主要分为 框架集 和 框架 两个部分
framesetframe/frame/...
/frameset框架集标记frameset 左右分割窗口
左右分割也叫水平分割表示在水平方向将浏览器窗口分割成多个窗口
frameset cols40px,140px,...frameframe...
frameset/上下分割窗口
上下分割也叫垂直分割表示在垂直方向将浏览器窗口分割成多个窗口这种方式的分割需要使用frameset标记的rows属性
frameset rows40px,140px,...frameframe...
/framesetframeset frameborder0|1 framespacing边框间距 border边框宽度 bordercolor边框颜色
/framesetframeset frameborder1 framespacing2px border4px bordercolor#FF6600frame srctest1.htmlframe srctest1.html
/frameset嵌入浮动框架标记
bodyhjeloiframe srctest1.html/iframe
/body超链接
创建超链接 a href⽬标端点源端点/a
a href⽬标端点 target⽬标窗⼝名称源端点/a书签链接
a name书签名[⽂字/图⽚]/a #[]”表示⽂字或图⽚可有可⽆(1) 链接到同⼀⻚⾯中的书签称为内部书签链接
a href#书签名源端点/a(2) 链接到其他⻚⾯中的书签称为外部书签链接
a hreffile_url#书签名源端点/a文件下载
当链接的目标文档类型属于.doc、.Rar、.cab、.zip、.exe 等时可以获得文件下载链接.
a hreffile_url链接内容/a在网页中使用表格
tabletrtd单元格内容/td.../trtrtd单元格内容/td.../tr
/table表格标记
table border边框宽度 bordercolor边框颜⾊
table width表格宽度 height表格⾼度
table align对⻬⽅式
table bgcolor背景颜⾊
table background背景图⽚路径单元格内容与单元格边框之间的间距
table cellpadding边距值单元格与单元格之间的间距。
table cellspacing间距值设置表格的标题
caption align⽔平对⻬⽅式 valign垂直对⻬⽅式表格标题
/caption
tr标记
单独对表格中的某一行进行属性设置。
tr height⾏⾼ align⽔平对⻬⽅式 valign垂直对⻬⽅式 bordercolor颜色td和th标记
td --⼀般单元格 --默认居左并以普通格式显示
th --标题单元格 -- 默认居中并且加粗显示单元格的跨⾏和跨列设置 跨⾏ 》 rowspan 跨列 》 colspan
在网页中创建表单
表单标记包括
form name表单名称 method提交⽅法 action处理程序input type元素类型 name表单元素名称 下⾯有他的type取值
/forminput typetext name⽂本框名称
input typepassword name密码框名称
input typehidden name域名称 value域值
input typeradio name域名称 value域值 checkedchecked
input typecheckbox name域名称 value域值 checkedchecked
input typefile name域名称
input typesubmit name按钮名称 value按钮显示⽂本
input typebutton value按钮显示⽂本 onclickjavascript函数名 name按钮名称
input typereset name按钮名称 value按钮显示⽂本文本域标记
textarea name⽂本区域名称 rows⾏数 cols字符数
...(此处输⼊的为默认⽂本)
/textarea
rows属性设置可⻅⾏数当⽂本内容超出这个值时将显示垂直滚动条cols属性设置⼀⾏可以输入多少个字符CSS
什么是CSS
层叠样式表 提供了丰富的功能如字体、颜⾊、背景的控制及整体排版等
基础语法
选择器{属性1:值1;属性2:值2;属性3:值3;}举例h1,h2 {color: green;
}选择器
在{}之前的部分就是“选择器”。 “选择器”指明了{}中的“样式”的作⽤对象
标签选择器元素选择器 HTML标签名称作为选择器
p {
font-size: 30px;
backgroud-color: gray;
}
h2 {
background-color: red;
}ID选择器唯⼀性⼀次引⽤ id 选择器以 “#” 来定义。
#red{colorred}类选择器单类选择器多类选择器 然后使⽤.进⾏标识
.important {
font-weight:bold;
}属性选择器简单属性选择具体属性选择 ⑴简单属性选择 例⼦ 2:只对有 href 属性的锚a 元素应⽤样式 a[herf] {color:red;} 例⼦ 3:根据多个属性进⾏选择只需将属性选择器链接在⼀起即可。 为了将同时有 href 和 title 属性的 HTML 超链接的⽂本设置为红⾊可以这样写 a[herf] [title] {color:red;} ⑵根据具体属性值选择 将指向 Web 服务器上某个指定⽂档的超链接变成红⾊可以这样写 a [href“http://www.baidu.com”] {color:red;} 派⽣选择器 只有 li 元素中的 strong 元素的样式为斜体字 li strong {font-style: italic;font-weight: normal;
}CSS常用属性
常用字体属性
font-family 字体类型 宋体、⿊体、⾪书、楷体font-size 22pxfont-style 字体的⻛格 normal | intalic | oblique | inherit 默认值、斜体、倾斜、继承font-weight 粗细程度 100-900 | bold | bolder | lighter | normal 数值、粗体、更粗、更细、默认
常用文本属性
text-align left(左对⻬) center right justify(两端对⻬)text-decoration overline(上划线) underline(下划线) line-through(删除线)line-height ⾏间距letter-spacing 字符间距
常用列表属性 list-style-type disc |circle | square |decimal 列表项前加 · ⭕ 实⼼方块 数字 常用颜色背景属性
color 设置颜⾊background-color 背景颜⾊background-image 背景图⽚background-repeat no-repeat | repeat-x|repeat-y 不重复 横向重复 纵向重复 横向重复
HTML中引入CSS方式
内联方式
直接在 HTML 标签中的 style 属性中添加 CSS。
示例
div stylebackground: red/div嵌入方式
在 HTML 头部中的 style 标签下书写 CSS 代码。
headstyle.content {background: red;}/style
/head连接方式
使⽤ HTML 头部的 head 标签引⼊外部的 CSS ⽂件。
示例
headlink relstylesheet typetext/css hrefxxxx.css
/headCSSDIV布局
盒子模型
Margin(外边距) - 清除边框外的区域外边距是透明的。Border(边框) - 围绕在内边距和内容外的边框。Padding(内边距) - 清除内容周围的区域内边距是透明的。Content(内容) - 盒子的内容显示文本和图像。 盒子border属性
边框有三个要素 粗细 线性样式 颜色
border :solid 5px red;线性样式 粗细 颜⾊!DOCTYPE html
html langen
headmeta charsetUTF-8meta http-equivx-ua-compatible contentIEedgemeta nameviewport contentwidthdevice-width, initial-scaletitleTitle/titlestyle typetext/css.box{width: 200px;height: 200px;border:solid 5px red;}/style
/head
body
div classbox/div
/body
/html盒子padding属性
padding 属性定义元素边框与元素内容之间的空白区域
padding-top 上内边距的宽度padding-left 左内边距的宽度padding-right 右内边距的宽度padding-bottom 下内边距的宽度
style
#box1{
padding-top:10px;
padding-left:20px;
padding-right:30px;
padding-bottom:40px;
overflow: hidden;
width: 100px;
height: 150px;
background-color#bcf
border:20px skyblue solid;
}
/style
div idbox1
/div盒子margin属性 如果margin只有⼀个值 表示上右下左的margin同为这个值。 例如margin:10px; 就等于 margin:10px 10px 10px 10px; 如果 margin 只有两个值 第⼀个值表示上下margin值第⼆个值为左右margin的值。 例如margin:10px 20px; 就等于 margin:10px 20px 10px 20px; 如果margin有三个值 第⼀个值表示上margin值第⼆个值表示左右margin的值第三个值表示下margin的值 例如margin:10px 20px 30px; 就等于 margin:10px 20px 30px 20px; 如果margin有四个值 那这四个值分别对应上右下左这四个margin值。 例如margin:10px 20px 30px 40px;
盒子的浮动
在标准流中⼀个块级元素在⽔平⽅向会⾃动伸展默认为none也就是标准流通常的情况。如果将float属性的值设置为left或right
html xmlnshttp://www.w3.org/1999/xhtml
head
style typetext/css
body {margin:15px;font-family:Arial; font-size:12px;
}
.father {background-color:#ffff99;border:1px solid #111111;padding:5px;
}
.father div {padding:10px;margin:15px;border:1px dashed #111111;background-color:#90baff;
}
.father p {border:1px dashed #111111;background-color:#ff90ba;
}
.son1 {
/* 这⾥设置son1的浮动⽅式*/
}
.son2 {
/* 这⾥设置son1的浮动⽅式*/
}
.son3 {
/* 这⾥设置son1的浮动⽅式*/
}
/style
/head
bodydiv classfatherdiv classson1Box-1/divdiv classson2Box-2/divdiv classson3Box-3/divp这⾥是浮动框外围的⽂字这⾥是浮动框外围的⽂字这⾥是浮动框外围的⽂字/div
/body
/html设置第⼀个浮动的div
.son1 {float: left;
}盒子的定位
盒子的定位包括静态定位相对定位绝对定位和固定定位
static : 称为静态定位这是默认的属性值也就是该盒⼦按照标准流进⾏布局。relative称为相对定位使⽤相对的盒⼦的位置常以标准流动排版⽅式为基础然后使盒子相对于它在原来的为之偏移指定的距离。它后⾯的盒⼦仍以标准流的⽅式对待它。absolute : 称为绝对定位绝对定位的盒⼦从标准流中脱离。这意味着它们对其后的兄弟盒⼦的定位没有影响其他盒子就好像这个盒子不存在一样。fixed : 称为固定定位它和绝对定位类似只是以浏览器窗⼝为基准进⾏定位也就是当拖动浏览器窗口的移动滚动条时已然保持对象的位置不变。
!DOCTYPE html
html
head
titleposition属性/title
style typetext/css
body{margin:20px;font :Arial 12px;
}
#father{background-color:#a0c8ff;border:1px dashed #000000;padding:15px;
}
#son{background-color:#D2B48C;border:1px dashed #000000;padding:10px;
}
/style
/head
bodydiv idfatherdiv idsonBox盒⼦/div/div
/body
/htmlstatic (静态定位) 正常的那种relative (相对定位)
#son{background-color:#D2B48C;border:1px dashed #000000;padding:10px;position:relative;right:28px;bottom:28px;
}上图可以看出Box盒⼦和原来的位置相⽐它向左和向上分别移动了28像素“bottom:28px” 的作⽤就是使Box盒⼦的新位置在原来位置的下边框上侧28像素的地⽅
absolute (绝对定位)
!DOCTYPE html
html
head
title三个⼦块绝对定位的情况/title
style typetext/css
body{
margin:20px;
font :Arial 12px;
}
#father{
background-color:#a0c8ff;
border:1px dashed #000000;
padding:15px;
}
#father div{
background-color:#D2B48C;
border:1px dashed #000000;
padding:10px;
}
#son2{
}
/style
/head
body
div idfather
divBox盒⼦1/div
div idson2Box盒⼦2/div
divBox盒⼦2/div
/div
/body
/html尝试使⽤绝对定位,对#son2的CSS设置位置⽬前它还是空⽩的下⾯将它改为
#son2{
position: absolute;
top: 28px;
right: 28px;
}上图是以浏览器窗⼝为基准从右上⻆开始向下和向左各移动28像素。 如果我们在#father中增加⼀个 position: relative; 再试⼀下呢 可以看到是以⽗div开始向下和向左各移动28像素。 使⽤绝对定位的盒⼦以它的“最近” 的⼀个“已经定位”的“祖先元素”为基准进⾏偏移如过没有已经定位的元素那么会以浏览器为基准进行定位。
fixed 固定定位
⽽是浏览器窗⼝,其他跟absolute很像,不再展示
Div标记与Span标记
div与span标记的区别在于
div是⼀个块级元素它周围的元素会⾃动换⾏
⽽span仅仅是⼀个⾏内元素在它的前后不会⾃动换⾏。JS基础
HTML提供网页的结构提供网页中的内容CSS: 用来美化网页JavaScript: 可以用来控制网页内容给网页增加动态的效果
JavaScript是⼀种运⾏在客户端 的脚本语⾔ 由游览器解释执⾏ , 基于对象的脚本语⾔ , 弱类型语⾔:可以不声明直接使⽤
变量 var x 7;
var y 8;
var z x y;常量
const PI 3.14; //不可以修改值数据类型
基本类型字符串String、数字(Number)、布尔(Boolean)、空Null、未定义U 引⽤数据类型对象(Object)、数组(Array)、函数(Function)。 示例: 字符串String
var authorauthor数字(Number)
var x134.00; //使⽤⼩数点来写
var x234; //不使⽤⼩数点来写布尔(Boolean)、
var xtrue;
var yfalse;空Null未定义Undefined undefined 是没有定义的null 是定义了但是为空。 对象(Object)、
var person{
firstname : xuanji,
lastname : zx,
id : 345680
};数组(Array)、
var carsnew Array(Saab,Volvo,BMW);函数(Function)。
function name(参数 1, 参数 2, 参数 3) {
要执⾏的代码
}JavaScript 拥有动态类型
var x; // x 为 undefined
var x 5; // 现在 x 为数字
var x John; // 现在 x 为字符串Html中引入JS脚本方式 事件驱动事件处理
常用事件
(1)单击事件:onclick。⽤户单击⿏标按键时产⽣的事件同时。nclick指定的事件处理程序或代码将被调用执行。(2)改变事件:onchange。当text或textarea元素内的字符值改变或select表格选项状态发生改变时发生该事件。(3)选中事件:onselect。当text或textarea对象中的⽂字被选中时会引发该事件。如
ipnut typetext value默认信息” οnselectalert(”您选中T⽂本框中的文字)(4)获得焦点事件:onfocus。⽤户单击text或textarea以及select对象即光标落在
select name zhengjian onfocusalert(”我成为焦点”)(5)失去焦点事件:onblur.失去焦点事件正好与获得焦点事件相对当text或textarea以及select对象不再拥有焦点而退出后台时引发该事件。(6)载⼈⽂件事件:onload,’当⻚⾯⽂件载⼈时产⽣该事件。onload的⼀个作⽤就是在⾸次载入一个页面文件时检测cookie的值并用一个变量为其赋值
body onloadalert(”正在加载⻚⾯请等待⼀”)(7)⿏标镇盖事件:onmouseover, onmouseover是当⿏标位于元素上⽅时所引发的事件。如
input type boutton value”按钮” onmouseover window. status请注意您下面的状态栏. return true(8)⿏标离开事件:onmouseout, onmouseout是当⿏标离开元素时引发的事件。如果和鼠标事件同时使用可以创建动态按钮的效果。(9)⼀般事件。 ondbclick:⿏标双击事件。 onkeypress:当键盘上的某个键被按下并且释放时触发的事件要求⻚⾯内必须有激活的对象 onkeydown:当键盘上某个键被按下时触发的事件要求⻚⾯内必须有激活的对象。 onkeyup:当键盘上某个键被放开时触发的事件要求⻚⾯内必须有激活的对象。
!DOCTYPE html
html langen
headmeta charsetUTF-8meta http-equivX-UA-Compatible contentIEedgemeta nameviewport contentwidthdevice-width, initial-scaletitleDocument/title
/headbodyinput typetext onchangefun1()
/bodyscriptfunction fun1() {alert(我改变了);}
/script
/html脚本函数
function 函数名(参数1, 参数2, ... , 参数3) {
// 需要执⾏的代码块
}案例: 把填写进的表单的数据打印出来 !DOCTYPE html
html langen
headmeta charsetUTF-8meta http-equivX-UA-Compatible contentIEedgemeta nameviewport contentwidthdevice-width, initial-scaletitleDocument/title
/headbodyform methodPOSTinput idaccount typetext brinput idpassword typepasswordbrinput typesubmit onclickshow()/form
/bodyscriptfunction show() {var account document.getElementById(account).value;var pwd document.getElementById(password).value;alert(账号 account 密码: pwd);}
/script/html
JavaScript常用对象
string对象
charAt()返回在指定位置的字符。 charCodeAt()返回在指定的位置的字符的 Unicode 编码。 concat()连接字符串。 fromCharCode()从字符编码创建⼀个字符串。 String indexOf()检索字符串返回字符串出现的位置如果没有找到返回-1。 lastIndexOf()从后向前搜索字符串返回字符串出现的位置如果没有找到返回-1 。 split()把字符串分割为字符串数组。 substr()从起始索引号提取字符串中指定数⽬的字符。 substring()提取字符串中两个指定的索引号之间的字符。 toLowerCase()把字符串转换为⼩写。 toUpperCase()把字符串转换为⼤写。
Math对象: Date对象 Document 对象方法 window对象
1. window.open(url,name); 打开新窗⼝ 注window.open(url,name); name取值: _blank - URL加载到⼀个新的窗⼝。这是默认 _self - URL替换当前⻚⾯
window.open(https://www.runoob.com,_blank);2. window.close(); 关闭当前窗⼝
alert(); //提示框
confirm(“请输⼊”); //带确认,取消按钮的提示框
prompt(“请输⼊”,“2”); //带输⼊⽂本的提示框还有延时函数
延时函数
function test() {
alert(test);
}
var time1setTimeout(test, 1000);
var time2setInterval(test,1000);清除定时器
window.clearInterval(time2)
window.clearTimeout(time1)
