标签定义)。 字母td指表格数据(table data),即数据单元格的内容。数据单元格可以包含文本、图片、列表、段落、表单、水平线、表格等等。 三个元素必须一起使用,否则无法定义表格。
DOCTYPE html >
< html lang = " cn" >
< head>
< meta charset = " UTF-8" >
< title> Document title>
head>
< body>
< table border = " 3" >
< section> 乘法表 section>
< th> 1 th>
< th> 2 th>
< th> 3 th>
< tr>
< td> 1*1=1 td>
< td> td>
< td> td>
tr>
< tr>
< td> 1*2=2 td>
< td> 2*2=4 td>
< td> td>
tr>
< tr>
< td> 1*3=3 td>
< td> 2*3=6 td>
< td> 3*3=9 td>
tr>
table>
body>
html>
运行结果如下: section为表格的标题,th可以看做td的加粗形式,tr为行标识,td为表格内容。在td标签中还有bgcolor属性和align属性。
1.1.4 表单(重点)
HTML表单用于搜集不同类型的用户输入。最常见最典型的表单即注册页面。 表单是一个包含表单元素的区域。 表单元素是允许用户在表单中(比如:文本域、下拉列表、单选框、复选框等等)输入信息的元素。 表单使用表单标签(
)定义。 基本格式如下 :
< FORM Action = " url" Method = " *" >
< input> input>
FORM>
表单的三个要点 表单控件(Form Controls) 动作属性(Action) 方法属性(Method)
表单控件(Form Controls) 通过HTML表单的各种控件,用户可以输入文字信息,或者从选项中选择,以及做提交的操作。 from标签中有input标签、select标签和textarea标签。
form标签中有action属性和method属性。 action属性 当用户单击确认按钮(即提交表单)时,表单的内容会被传送到另一个文件。表单的动作属性定义了目的文件的文件名。由动作属性指向的这个文件通常会对接收到的输入数据进行相关的处理。 method属性 method属性告诉浏览器如何将编码后的数据发给服务器。其值为get或者post。 get属性值,浏览器会将数据直接附在表单的 action url之后。这两者之间用问号进行分隔 post属性值,直接连接服务器,然后将html表单中的值发送给web服务器。这种方式是没有字符长度限制的。
< form action = " " method = " get" > form>
action属性作用是提交表单之后跳转的页面,可以是项目内部的页面,也可以是外部链接;method属性为提交方式,get属性值在提交之后表单的属性值会显示在地址栏,地址后先接?,然后接各个控件的值,如下图:
而post属性值则不会。
input标签有name属性和value属性,根据tpye属性还可以有checked属性,checked作用是默认选项。 input标签中type属性可分为几个属性值:
< input tpye = " text" >
< input tpye = " password" >
< input tpye = " radio" >
< input tpye = " checkbox" >
< input tpye = " button" >
< input tpye = " reset" >
< input tpye = " submit" >
例子如下:
DOCTYPE html >
< html lang = " cn" >
< head>
< meta charset = " UTF-8" >
< title> Document title>
head>
< body>
< form action = " " method = " get" >
用户名< input type = " text" name = " userame" maxlength = " 20" size = " 10px" > < br>
密 码< input type = " password" maxlength = " 20" size = " 10px" > < br>
性别 < input type = " radio" name = " sex" value = " man" checked > 男
< input type = " radio" name = " sex" value = " woman" > 女< br>
选择你喜欢的动漫是:< br>
< input type = " checkbox" name = " cb01" value = " 1" > 海贼王
< input type = " checkbox" name = " cb02" value = " 2" > 火影
< input type = " checkbox" name = " cb03" value = " 3" > 死神
< input type = " checkbox" name = " cb04" value = " 4" > 刃牙< br>
选择你喜欢的食物:
< select name = " sel" >
< option value = " miketea" > 奶茶 option>
< option value = " chocolate" > 巧克力 option>
< option value = " cake" selected > 蛋糕 option>
select>
< br>
大声说出你的想法: < br>
< textarea name = " text" id = " teext1" cols = " 30" rows = " 20" > textarea> < br>
< input type = " button" name = " but" value = " 普通按钮" >
< input type = " reset" name = " resetbutton" value = " 重置按钮" >
< input type = " submit" name = " sub" value = " 提交按钮" >
form>
body>
html>
分析: input标签中的type属性的属性值为text时,maxlength属性为文本框最多输入的数字的容量。 在input标签中添加checked属性,将该选项设置为默认选项。 想要实现单选的效果,第一,type属性的属性值为radio;第二,各个选项的name属性的属性值必须保持一致 。 相反,想要实现复选的效果,第一,tyoe属性的属性为checkbox,各个选项的name属性的属性值必须不一致。 select标签表示下拉框,在select标签中的option标签中添加selected属性,表示默认选项,若选择中没有添加selected属性,则第一个为默认选项。 textarea标签表示文本域,其中的cols属性控制列,rows控制行。
表单小结
拓展 HTML5表单新的input标签的属性值 color 用于选取颜色 date选择一个日期 datetime-local选择一个日期和时间(无时区) email包含e-mail地址的输入域 month选择一个月份 number包含数值的输入域 time选择一个时间 url包含URL地址的输入域,在提交表单时,会自动验证url域的值 week选择周
DOCTYPE html >
< html lang = " cn" >
< head>
< meta charset = " UTF-8" >
< title> type新属性值 title>
head>
< body>
< form action = " success.html" method = " get" >
选取颜色:< input type = " color" > < br> < br>
日期: < input type = " date" > < br> < br>
日期: < input type = " datetime-local" > < br> < br>
时间: < input type = " time" > < br> < br>
周: < input type = " week" > < br> < br>
月: < input type = " month" > < br> < br>
输入数字: < input type = " number" max = " 20" min = " 0" step = " 2" value = " 2" > < br> < br>
邮件: < input type = " email" > < br> < br>
地址: < input type = " url" > < br> < br>
< input type = " submit" name = " sub" value = " 提交" >
form>
body>
html>
运行并填入数据,效果如下图: number属性值还有其他的属性。max规定的最大值,min规定的最小值,step规定的步长,value规定默认值。
HTML小结
HTML常用基本标签分为有块元素和行内元素。 表单使用表单标签(
)定义。form标签有两个重要属性action属性和method属性,action属性作用是当用户单击确认按钮(即提交表单)时,表单的内容会被传送到另一个文件。method属性告诉浏览器如何将编码后的数据发给服务器。其值为get或者post。表单中用input标签设置文本框、密码框、单选框和复选框,用select标签设置下拉框,用textarea标签设置文本域。 HTML5表单新的input标签的属性值。是关于颜色、日期、时间、邮箱和url的属性值。
2 CSS样式表
CSS就是层叠样式表,网页实际上是一个多层的结构,通过CSS可以分别为网页的每一个层来设置样式,而最终我们能看到只是网页的最上边一层。总之,CSS用来设置网页中元素的样式。
CSS样式表的基本结构
< style type = " text/css" >
选择器 {
属性1 : 属性值;
属性2 : 属性值;
属性3 : 属性值;
……
}
style>
2.1 三种格式修改样式
CSS有3种格式修改元素的样式:行内修改样式、内部样式表和外部样式表。
2.1.1 行内样式(尽量不用)
如下例子:
DOCTYPE html >
< html lang = " cn" >
< head>
< meta charset = " UTF-8" >
< title> Document title>
head>
< body>
< p style = " color : red; font-size : 20px; " > 今天天气很好 p>
body>
html>
在标签内部通过style属性来设置元素的样式。 缺点:使用内联样式,样式只能对一个标签生效。如果希望影响多个元素必须在每一个元素都要复制一遍,并且当样式发生变化时,我们必须要一个一个的修改,非常不方便,所以在开发时绝对不要使用内联样式!
2.1.2 内部样式
将样式编写到head中的style标签里,然后通过CSS选择器来选中元素并为其设置各种样式,可以同时为多个标签设置样式,并且修改时只需要修改一处即可。内部样式表更加方便对样式进行复用。 缺点:内部样式表只能对一个网页起作用 ,它里边的样式不能跨页面进行复用。 如下例子:
DOCTYPE html >
< html lang = " cn" >
< head>
< meta charset = " UTF-8" >
< title> Document title>
< style type = " text/css" >
p {
color : red;
font-size : 20px;
}
style>
head>
< body>
< p> 今天天气很好 p>
body>
html>
2.1.3 外部样式(最佳办法)
可以将CSS样式编写到一个外部的CSS文件中,然后通过link标签来引入外部的文件。 外部样式表需要通过link标签进行引入,意味着只要想使用这些样式都可以对其进行引用,样式就可以在不同的网页之间进行复用。 将样式编写到外部的CSS文件中,可以使用到浏览器的缓冲机制,从而加快网页的加载速度。 首先,新建css文件,如下图: 然后,在网页中用link标签将网页和CSS文件关联起来,
DOCTYPE html >
< html lang = " cn" >
< head>
< meta charset = " UTF-8" >
< title> Document title>
< link rel = " stylesheet" href = " ./css/CSS外部样式表.css" >
head>
< body>
< p> 今天天气很好 p>
body>
html>
运行结果如下: 此外,还可以使用import关键字导入CSS样式表,比较少用,例子如下:
DOCTYPE html >
< html lang = " cn" >
< head>
< meta charset = " UTF-8" >
< title> Document title>
< style type = " text/css" ; >
@import "css/CSS外部样式表.css" ;
style>
head>
< body>
< p> 今天天气很好 p>
body>
html>
结论:在html文件写结构,在CSS文件写样式,在html用link标签将CSS样式表引入。或者通过import导入CSS样式表。
2.2 常见的选择器
常见的选择器有元素选择器,class选择器,id选择器,类选择器,通配选择器,伪类选择器。
DOCTYPE html >
< html lang = " cn" >
< head>
< meta charset = " UTF-8" >
< title> Document title>
< style type = " text/css" >
ins {
color : red;
font-size : 20px;
}
.underline {
color : blue;
}
style>
head>
< body>
< ins class = " underline" > 今天心情很好 ins>
body>
html>
运行结果如下:
结论:class选择器的优先级大于标签选择器的优先级。class选择器样式用“.”来引用。
2.3 常见的背景样式属性
backgroud-color属性。设置背景颜色。 backgroud-image属性。设置背景图像。url值填入照片的路径。 backgroud-repeat属性。repeat-x属性值图片向左右重叠,repeat-y属性值图片向上下重叠,no-repeat属性值图片不重叠,保持照片原始大小。repeat属性值照片重复重叠。
DOCTYPE html >
< html lang = " cn" >
< head>
< meta charset = " UTF-8" >
< title> Document title>
< style type = " text/css" >
body {
background-image : url ( picture/1.png) ;
background-repeat : repeat-x;
}
style>
head>
< body>
body>
html>
运行效果如下:
CSS样式表小结
CSS样式表有三种修改样式方法:行内样式、内部样式和外部样式。 常见的选择器有:元素选择器,class选择器,id选择器,类选择器,通配选择器,伪类选择器。 常见的背景样式属性有:backgroud-color属性、backgroud-image属性和backgroud-repeat属性。
3 JavaScript
基本语法是:在网页中写JavaScript代码、JavaScript的语法与关键字、JavaScript的数据类型、变量的定义与使用和运算符的应用。
3.1 JavaScript基本概念
JavaScript 是属于HTML 和Web的编程语言。
3.1.1 什么是JavaScript?
JavaScript诞生于1995年。它当时的目的是为了验证表单输入的验证 。因为在JavaScript问世之前,表单的验证都是通过服务器端验证的。而当时都是电话拨号上网的年代,服务器验证数据是一件非常痛苦的事情。经过许多年的发展,JavaScript 从一个简单的输入验证成为一门强大的编程语言。
JavaScript是一种具有面向对象能力的、解释型的程序设计语言。 更具体一点,它是基于对象 和事件驱动 并具有相对安全性的客户端脚本语言 。因为他不需要在一个语言环境下运行,而只需要支持它的浏览器即可。它的主要目的是,验证发往服务器端的数据、增加Web互动、加强用户体验度等。 基于对象:提供好了很多对象,可以直接拿过来使用。 事件驱动:html做网站静态效果,javaScript实现动态效果。 客户端:专门指的是浏览器。 JS的作用:操作HTML和CSS。
3.1.2 JavaScript特点
松散型:JavaScript语言核心与C、C++、Java相似,比如条件判断、循环、运算符等。但,它却是一种松散类型的语言,也就是说,它的变量不必具有一个明确的类型。 解释型:不需要编译。浏览器直接解释执行。 基于对象:我们可以直接使用JS已经创建的对象。Math String 安全性:不允许访问本地硬盘,不能将数据写入到服务器上。 跨平台:js依赖于浏览器本身,与操作系统无关。
3.1.3 js和java的区别
JavaScript和Java没有任何关系,属于两门编程语言。 开发公司 Java是sun公司开发的,现在是oracle公司。 JS是Netscape(网景公司)公司开发的 对象 Java是面向对象的 new JS是基于对象的 数据类型 Java是强类型语言(每种变量都有确定的数据类型)例如:int i = “10” JS是弱类型语言【变量的类型由值决定】例如:vari = 10,varj = “10” 执行过程 Java需要现编译成字节码文件,然后再执行 JS只需解析就可以执行
3.1.4 JavaScript核心
一个完整的JavaScript应该由下列三个不同的部分组成。 1 核心(ECMAScript) ECMA:欧洲计算机协会,由ECMA组织制定的js语法,语句,函数等 2 文档对象模型(DOM) Document Object Model:文档对象模型 3 浏览器对象模型(BOM) Broswer Object Model:浏览器对象模型
3.2 JavaScript基础语法
JavaScript 语法是一套规则,它定义了 JavaScript 的语言结构。
3.2.1 如何在网页中写JavaScript(重点)
方法1 在html页面中直接嵌入JavaScript
< script>
js程序
script>
js代码可以插入在
标签中间,也可以放在
标签中间。 最常用的是放在
。
例子:
DOCTYPE html >
< html lang = " cn" >
< head>
< meta charset = " UTF-8" >
< title> Document title>
< script>
alert ( "hello,world01~" ) ;
script>
head>
< body>
< script>
alert ( "hello,world02~" ) ;
script>
body>
html>
运行结果如下: 点击确定,
结论:如果同时在head标签和body标签写JS,则会先运行head标签里面的JS,然后再运行body标签里面的JS。
方法2 引用外部的JavaScript(最常用的方法)
首先,新建.js文件,在.js文件中,不需要
标签对括起来,例子如下:
然后在html文件中链接js文件,使用如下语法:
< script src = " .js文件路径" > script>
具体例子如下:
运行结果如下:
此方法优点是js文件可以被很多页面使用,提高复用率。
分析下列代码:
DOCTYPE html >
< html lang = " cn" >
< head>
< meta charset = " UTF-8" >
< title> Document title>
< script src = " js/js01.js" >
alert ( "test" ) ;
script>
head>
< body>
body>
html>
问题:会不会弹出test文字提示框? 答:不会。当一个script标签一旦引用了外部的js文件,如果在这个标签还有js代码,是不会执行的。
分析下列代码:
DOCTYPE html >
< html lang = " cn" >
< head>
< meta charset = " UTF-8" >
< title> Document title>
< script src = " js/js01.js" >
script>
< script>
alert ( "今天天气很好" ) ;
script>
head>
< body>
< script>
alert ( "今天心情很好" ) ;
script>
body>
html>
问题:会弹出什么提示框? 答:首先执行外部链接的script语句,弹出“hello,world~”提示框。然后执行head标签的script语句,弹出“今天天气很好”提示框。最后执行body标签的script语句,弹出“今天心情很好”提示框。
3.2.2 JavaScript语法(重点)
1 js变量区分大小写。 2 每一行的分号可有可无。 3 标识符 所谓标识符,就是指变量、函数、属性的名字,或者函数的参数。标识符可以是下列格式规则组合起来的一或多个字符: 第一字符必须是一个字母、下划线或一个美元符号($)。 其他字符可以是字母、下划线、美元符号或数字。 不能把关键字、保留字、true、false和null作为标识符。 例如: myname,book123_,_123,$123都是合法的标识符。 123,true,null,@123,abc!都不是合法的标识符。 4 注释 单行注释
多行注释
注释的内容在代码执行过程中不起作用。 5 定义变量时,使用var运算符。声明变量的格式:var 变量名=值;
比如: var username=“tom”; 正确 var age=30; 正确
6 使用大括号标签代码块 {}被封装在大括号内的语句按照顺序执行。
{
语句块1 ;
语句块2 ;
语句块3 ;
}
7 JavaScript中的关键字 关键字不能用作变量名。函数名以及循环标签。 关键字有如下:
abstract continue finally instanceof private this boolean default float
int public throw break do for interface return typeof byte double function
long short true case else goto native static var
catch extends implements new super void char false import null
switch while class final in package with synchronized
3.2.3 JavaScript的数据类型
(1)数值型有整型和浮点型 整型
123
0123
0x123
浮点型 整数部分假小数部分组成,只能用十进制表示,不过可以使用科学记数法。
3.1415926
3.14E9
如下例子:
var x= 123 ;
var y= 123.4567 ;
var z= 3.14E2 ;
(2)字符串型 字符串型数据是使用单引号或者双引号括起来的一个或者多个字符。
'a' 'Hello World'
"a" "Hello World"
JavaScript与Java不一样,js没有char数据类型,如果要表示单个字符,必须使用长度为1的字符串。 单引号包含双引号:'大家好,我叫"tom""
双引号包含单引号:"大家好,我叫'tom'"
如下例子:
var a= "test" ;
var b= 'testing' ;
(3)布尔型 布尔型数据只有true或者false。在js中也可以使用整数0代表false,使用非0的整 数来代表true。
var m= true ;
var bor= false ;
var ye= 7 > 1 ;
(4)转义字符 以反斜杠开头的不可显示的特殊字符通常称为控制字符,也被称为转义字符。
\b
\n
\t
\r
\'
\"
\\
js文件如下:
alert ( "hello,world~\n ab\tc\n a\rbc\n a\'b\"c\\" ) ;
运行效果如下图: (5)空值 null,用于定义空的或者不存在的引用。
var a= null ;
(6)未定义值 已经声明但是没有赋值的的变量。
var a;
alert ( a) ;
注: 查看一个数据类型的格式
typeof ( 变量名)
type 变量名
var n= "大家好,我是‘叶大叔’" ;
var m= true ;
alert ( typeof ( n) ) ;
alert ( typeof m) ;
运行效果如下图:
3.2.4 变量的定义与使用
(1)变量的命名规则 与标识符规则一致!因为变量是标识符的一种。 (2)变量的声明
var variable;
可以使用一个var声明多个变量,比如
var a, b, c, d;
可以在声明变量的同时对它进行赋值,也就是初始化。
var a= 1 , b= true , c= "123" , d= 3.14 ;
如果只是声明了变量,没有赋值,那么该变量的默认值是undefined。 JavaScript是弱类型,声明的时候不需要指定变量的类型,变量的类型将根据变量的值来确定。
函数就是方法,为了解决问题。也可以称为功能。
function 函数名 ( ) {
函数体;
}
(3)全局变量的声明 在函数体外声明的都是全局变量。 在函数体内部不使用var声明直接赋值的变量是全局变量。??自己验证时出错,在函数内定义全局变量,无法引用该全局变量。
(4)变量的作用域 变量的作用域是指变量在程序中的有效范围。 全局变量:定义在所有函数之外,作用于整个代码的变量。 局部变量:定义在函数体内,只作用于函数体内的变量。
3.2.5 赋值运算符
var suername= "Bass" ;
a+= b;
a-= b;
a*= b;
a/= b;
a%= b;
a&= b;
a|= b;
a^= b;
& | ^ 计算两个布尔值 ( true , false )
& 一假全为假
| 一真全为真
^ 不相同为真,相同为假
&,例子如下:
var a= true ;
var b= false ;
alert ( a& b) ;
运行结果如下: 结果是false,0表示false。 |,例子如下:
var a= true ;
var b= false ;
alert ( a| b) ;
结果是true,1表示true。
^,例子如下:
var a= true ;
var b= false ;
alert ( a^ b) ;
结果是true,1表示true。
此外还有自增和自减。
i= 1 ; j= ++ i;
i= 1 ; j= i++ ;
i= 10 ; j= -- i;
i= 10 ; j= i-- ;
3.3 JavaScript流程控制
JavaScript流程控制有if语句、switch语句、for语句、while语句和do-while语句。
3.3.1 if语句
if ( 表达式) {
}
if ( 表达式) {
} else {
}
if ( 表达式1 ) {
} else if ( 表达式2 ) {
} else if ( 表达式3 ) {
} else {
}
例子如下:
var a= 20 ;
if ( a< 50 ) {
alert ( "条件成立" ) ;
}
var a= 200 ;
if ( a< 50 ) {
alert ( "条件成立" ) ;
} else {
alert ( "条件不成立" ) ;
}
3.3.2 switch语句
switch语句的语法结构
switch ( 表达式) {
case 1 : 语句块1 ; break ;
case 2 : 语句块2 ; break ;
case 3 : 语句块3 ; break ;
……
default : 语句块n;
}
break作用强制退出流程。 例子如下:
var day= "5" ;
switch ( day) {
case "1" : alert ( "星期一" ) ; break ;
case "2" : alert ( "星期二" ) ; break ;
case "3" : alert ( "星期三" ) ; break ;
case "4" : alert ( "星期四" ) ; break ;
case "5" : alert ( "星期五" ) ; break ;
case "6" : alert ( "星期六" ) ; break ;
case "7" : alert ( "星期日" ) ; break ;
default : alert ( "请输入合法数据" ) ;
}
结果会弹出“星期五”的提示框。 如果改写上述例子,删除一些break,如下:
var day= "5" ;
switch ( day) {
case "1" : alert ( "星期一" ) ; break ;
case "2" : alert ( "星期二" ) ; break ;
case "3" : alert ( "星期三" ) ; break ;
case "4" : alert ( "星期四" ) ; break ;
case "5" : alert ( "星期五" ) ;
case "6" : alert ( "星期六" ) ;
case "7" : alert ( "星期日" ) ;
default : alert ( "请输入合法数据" ) ;
}
会弹出“星期五”、“星期六”、“星期日”和“请输入合法数据”的提示框。如果字啊语句块后面没有break语句,switch则会一直执行下去。
3.3.3 for语句
语法格式: for(①initialize;②test;④increment){ ③statement } ①->②(true)->③->④->②(true)->③->④->… ①->②(true)->③->④->②(false) for循环结束 例子如下:
var sum= 0 ;
for ( var i= 1 ; i<= 10 ; i++ ) {
sum= sum+ i;
}
alert ( "1-10的整数和为" + sum) ;
3.3.4 while语句
语法格式:while(①expression){ ②statement } ①(true)->②->①(true)->②…①(false)直接退出while循环。
var sum= 0 ;
var i= 1 ;
while ( i<= 10 ) {
sum= sum+ i;
i++ ;
}
alert ( "1-10的整数和为" + sum) ;
3.3.5 do-while语句
语法格式:do{ ①statement }while(②expression);
var sum= 0 ;
var i= 1 ;
do {
sum= sum+ i;
i++ ;
} while ( i<= 10 ) ;
alert ( "1-10的整数和为" + sum) ;
while循环是先判断条件是否成立,然后再根据判断的结果是否执行循环体。也就是说循环体有可能一次都执行不了。 do-while循环是先执行一次循环体,然后再判断条件是否成立。所以不管条件是否成立,至少能够执行一次。
3.4 函数
函数就是方法,解决某个问题,实现某个功能。
3.4.1 函数的定义
function 函数名字([参数1,参数2,参数3,……]){ 函数体; [return 返回值;] } 注:[ ]为可选项。 例如:定义两数相乘的函数,如下:
function multiplication ( x, y ) {
var result= x* y;
return result;
}
3.4.2 函数的调用
格式:函数名 (实参); 例如:调用multiplication函数,实参为3,4,如下:
var a= multiplication ( 3 , 4 ) ;
alert ( "相乘结果为" + a) ;
运行结果如下:
3.4.3 匿名函数
作用:用一个变量来接收函数。 格式: var 变量名=function([参数1,参数2,参数3,……]){ 函数体; [return 返回值;] }
匿名函数例子,如下:
var a = function ( x, y ) {
var z= x+ y;
alert ( "z的值为" + z) ;
}
a ( 3 , 3 ) ;
运行结果如下:
3.4.4 全局函数
全局函数不属于任何一个对象,直接写名称使用即可。 (1)encodeURI函数 作用:对字符进行编码
var str= "测试testing123!"
var encode01= encodeURI ( str) ;
document. write ( encode01) ;
运行效果如下图: 所以,“测试”的编码为%E6%B5%8B%E8%AF%95。
(2)decodeURI函数 作用:对字符进行解码
var str= "%E6%B5%8B%E8%AF%95" ;
var decode01= decodeURI ( str) ;
document. write ( decode01) ;
运行效果如下图: 所以,%E6%B5%8B%E8%AF%95解码为“测试”。
(3)encodeURIComponent函数 作用:对URI组件进行编码。
var uri = "https://w3school.com.cn/my test.asp?name=ståle&car=saab" ;
var res = encodeURIComponent ( uri) ;
alert ( res) ;
(4)decodeURIComponent函数 作用:解码 URI 组件。 语法:decodeURIComponent(uri) uri参数为必须参数,为要解码的URI。 返回值:字符串,表示解码后的 URI。
var uri= "https%3A%2F%2Fw3school.com.cn%2Fmy%20test.asp%3Fname%3Dst%C3%A5le%26car%3Dsaab" ;
var rui_dec= decodeURIComponent ( uri) ;
alert ( rui_dec) ;
该结果就是上题的uri。
(5)eval函数 作用:识别字符串中的js代码
var str= "alert('123')" ;
eval ( str) ;
document. write ( " " ) ;
运行效果如下图:
(6)isFinite函数 作用:可确定数字是否是有限的合法数字。 如果值为 +infinity、-infinity 或 NaN(非数字),则此函数返回 false,否则返回 true。 返回值为布尔值。如果值为 +infinity、-infinity 或 NaN,则返回 false,否则返回 true。 注: JavaScript 全局属性
属性
描述
Infinity
表示正/负无穷大的数值
NaN
“非数字”(Not-aNumber)
undefined
表示变量尚未赋值
alert ( isFinite ( 123 ) ) ;
上述代码运行结果返回true,因为123是合法数字。如果输入NaN,NaN为非法字符,则返回false。
(7)isNaN函数 作用:确定值是否为非数字(Not-a-Number) 不是数字返回true,是数字返回false
var str= '123' ;
alert ( isNaN ( str) ) ;
上述代码运行结果返回为false。
(8)Number函数 作用:函数将对象参数转换为表示对象值的数字。
语法:Number(object) object 可选。JavaScript 对象。如果未提供该参数,则返回 0。
返回值:数值。将不同的对象值返回为数字。 如果该值无法转换为合法数字,则返回 NaN。如果未提供参数,则返回 0。 如果参数是 Date 对象,则 Number() 函数返回自 UTC 1970 年 1 月 1 日午夜以来的毫秒数。
alert ( Number ( true ) ) ;
上述代码运行结果返回为1。
alert ( Number ( false ) ) ;
上述代运行码结果返回为0。
var x = new Date ( ) ;
alert ( Number ( x) ) ;
上述代码运行结果返回自 UTC 1970 年 1 月 1 日午夜以来的毫秒数。
alert ( Number ( "999" ) )
上述代码运行结果返回999数值。
alert ( Number ( "999 888" ) ) ;
上述代码运行结果返回NaN,999 888无法转换为合法数字。
alert ( Number ( ) ) ;
上述代码运行结果返回0,未提供参数,则返回 0。
(9)parseFloat函数 作用:解析字符串并返回浮点数。 此函数确定指定字符串中的第一个字符是否为数字。如果是,它会解析字符串直到到达数字的末尾,并将数字作为数字而不是字符串返回 。 注意: 只返回字符串中的第一个数字! 允许前导和尾随空格。 如果第一个字符不能转换为数字,parseFloat() 返回 NaN。
alert ( parseFloat ( "10" ) ) ;
上述代码运行结果返回数值10。
alert ( parseFloat ( "10.00" ) ) ;
上述代码运行结果返回数值10。若小数后为0,则省略小数位。
alert ( parseFloat ( "34 56 78" ) ) ;
上述代码运行结果返回数值34。parseFloat函数只返回字符串中的第一个数字,即34。
alert ( parseFloat ( " 60 " ) ) ;
上述代码运行结果返回数值60,parseFloat函数允许前导和尾随空格。
alert ( parseFloat ( "40 years" ) ) ;
上述代码运行结果返回数值40,parseFloat函数解析字符串直到到达数字的末尾,years不是数字,所以不能返回。
alert ( parseFloat ( "hello" ) ) ;
上述代码运行结果返回数值NaN,第一个字符不能转换为数字,parseFloat() 返回 NaN。
(10)parselnt函数 作用:函数解析字符串并返回整数。 parseInt(string,radix) string 必需。要解析的字符串。如果第一个字符不能转换为数字,parseInt() 返回 NaN。 radix 可选参数。代表要使用的数字系统的数字(从 2 到 36)。 如果 radix 参数被省略,JavaScript 假定如下: 如果字符串以 “0x” 开头,则基数为 16(十六进制) 如果字符串以 “0” 开头,则基数为 8(八进制)。此特性已弃用 如果字符串以任何其他值开头,则基数为 10(十进制) 返回值: 数值。如果第一个字符不能转换为数字,则返回 NaN。 注意:只返回字符串中的第一个数字!
var a= parseInt ( "10" ) ;
alert ( a) ;
上述代码运行结果为10,说明parselnt函数函数解析字符串并返回整数。
var a= parseInt ( "hello" ) ;
alert ( a) ;
上述代码运行结果为返回值为NaN,第一个字符不能转换为数字,parselnt函数返回 NaN。
var a = parseInt ( "3 4 45 66" ) ;
alert ( a) ;
上述代码运行结果为3,说明只返回字符串中的第一个数字。
(11)String函数 作用:将对象的值转换为字符串。 注释:String() 函数返回与单个对象的 toString() 相同的值。 语法:String(object) object 必需。JavaScript 对象。
var x1 = Boolean ( 0 ) ;
var res = String ( x1) ;
alert ( res) ;
上述代码就行结果返回false。String函数将x1的值转为为字符串false。
var x2 = Boolean ( 1 ) ;
var res = String ( x2) ;
alert ( res) ;
上述代码就行结果返回true。String函数将x2的值转为为字符串true。
var x3 = new Date ( ) ;
var res = String ( x3) ;
alert ( res) ;
上述代码就行结果返回Fri Apr 01 2022 21:31:26 GMT+0800 (中国标准时间)。
var x4 = "12345" ;
var res = String ( x4) ;
alert ( res) ;
上述代码就行结果返回字符串12345。
var x5 = 12345 ;
var res = String ( x5) ;
alert ( res) ;
上述代码就行结果返回字符串12345,String函数将整型12345转换为字符串12345。
3.5 事件
当在 HTML 页面中使用 JavaScript 时,JavaScript 能够“应对”这些事件。
3.5.1 常见的事件
事件
描述
onabort
对象载入被中断时触发
onablur
元素或窗口本身失去焦点时触发
onchange
改变
元素中的选项或其他表单元素失去焦点,并且在其获取焦点后内容发生过改变时触发
onerror
出现错误时触发
onfocus
任何元素或窗口本身获得焦点时触发
onkeydown
键盘键(包括Shift、Alt等)被按下时触发
onkeypress
键盘被按下,并生成一个字符时触发。也就是说按下Shift或Alt等键不会触发
onkeyup
释放键盘上的按键时触发
onload
页面完全载入后触发
onclick
页面完全卸载后触发
onclick
单击鼠标邮件时触发。当光标的焦点在按钮上,并按Enter键是也会触发
ondblclick
双击鼠标左键时触发
onmousedown
单击任何一个鼠标按键时触发
onmousemove
鼠标在某个元素上移动时持续触发
onmouseout
鼠标从指定的元素上移开时触发
onmouseover
鼠标移动到某个元素时触发
onmouseup
释放任意一个鼠标按键时触发
onrest
单击充值按钮时,在
上触发
onresize
窗口或框架的大小发生改变时触发
onscroll
在任何带滚动条的元素或窗口上滚动时触发
onselect
选中文本时触发
onsubmit
单击提交按钮时,在
上触发
3.5.2 事件处理
时间出程序是用于响应某个时间而执行的处理程序。时间处理程序可以是任意的JavaScript语句,通常使用函数来对事件进行处理 。 第一种方式,事件处理在html中绑定:
< ! DOCTYPE html>
< html lang= "cn" >
< head>
< meta charset= "UTF-8" >
< title> 事件< / title>
< script>
function save ( ) {
alert ( "按钮被点击" ) ;
}
function fun ( ) {
alert ( "双击左键成功!" ) ;
}
< / script>
< / head>
< body>
< input type= "button" value= "按钮1" onclick= "save()" >
< input type= "button" value= "按钮2" ondblclick= "fun()" >
< / body>
< / html>
上述代码运行结果为:页面有两个按钮,一个按钮1,一个按钮2。鼠标左键单击按钮1,弹出“按钮被点击”窗口。鼠标左键双击按钮2,弹出“双击左键成功!”窗口。
第二种方式,事件处理在JavaScript中绑定:
< ! DOCTYPE html>
< html lang= "cn" >
< head>
< meta charset= "UTF-8" >
< title> Document< / title>
< / head>
< body>
< form>
< input type= "button" value= "按钮" id= "btn" >
< / form>
< script>
var temp= document. getElementById ( "btn" ) ;
temp. onclick = function ( ) {
alert ( "点击成功!" ) ;
}
< / script>
< / body>
< / html>
上述代码运行结果为:点击按钮,弹出“点击成功!”的提示框。
3.6 正则表达式
定义 正则表达式是构成搜索模式的字符序列。该搜索模式可用于文本搜索和文本替换操作。 当搜索文本中的数据时,您可使用搜索模式来描述您搜索的内容。 正则表达式可以是单字符,或者更复杂的模式。 正则表达式可用于执行所有类型的文本搜索 和文本替换 操作。
语法
/ pattern/ modifiers;
例子
var patt = / hello / i ;
例子解释: /hello/i 是一个正则表达式。 hello是模式(pattern)(在搜索中使用)。 i 是修饰符(把搜索修改为大小写不敏感)。
在字符串方法search() 中使用正则表达式
var str = "hello" ;
var n = str. search ( / o / i ) ;
n 中的结果将是:4
在字符串方法replace() 中使用正则表达式 例子 使用大小写不明的正则表达式以hello来替换字符串中的Bass:
var str = "Visit Bass" ;
var res = str. replace ( / hello / i , "Bass" ) ;
res 的结果将是:
Visit hello
正则表达式修饰符 修饰符可用于大小写不敏感的更全局的搜素:
修饰符
描述
i
执行对大小写不敏感的匹配
g
执行全局匹配(查找所有匹配而非在找到第一个匹配后停止)
m
执行多行匹配
正则表达式模式 括号用于查找一定范围的字符串:
表达式
描述
[abc]
[0-9]
`(x
y)`
元字符(Metacharacter)是拥有特殊含义的字符:
元字符
描述
\d
查找数字
\s
查找空白字符
\b
匹配单词边界
\uxxxx
查找以十六进制数 xxxx 规定的 Unicode 字符
定义量词:
量词
描述
n+
匹配任何包含至少一个 n 的字符串
n*
匹配任何包含零个或多个 n 的字符串
n?
匹配任何包含零个或一个 n 的字符串
使用 test() test() 是一个正则表达式方法。 它通过模式来搜索字符串,然后根据结果返回 true 或 false。
例子
var patt = / e / ;
patt. test ( "The best things in life are free!" ) ;
由于字符串中有一个 “e”,以上代码的输出将是:
true
上面的两行可缩短为一行:
/ e / . test ( "The best things in life are free!" ) ;
使用 exec() exec()方法返回值不是true或者false。而是当没有搜索到匹配的字符时,返回null,否则返回一个数组 ,这个数组的第一个元素包含与正则表达式相匹配的字符串,其他元素包含的是匹配的各个分组 (用括号括起来的子表达式)。
例子
/ e / . exec ( "The best things in life are free!" ) ;
由于字符串中有一个 “e”,以上代码的输出将是:
e
身份证例子
< ! DOCTYPE html>
< html lang= "cn" >
< head>
< meta charset= "UTF-8" >
< title> Document< / title>
< / head>
< body>
< form name= "f" >
身份证:< input type= "text" name= "id" size= "20" >
< input type= "button" value= "提取" onclick= "grep()" >
< / form>
< script>
function grep ( ) {
var id_value= f. id. value;
var pattern= / (\d{6})(\d{8})(\d{4}) / ;
var judge= pattern. exec ( id_value) ;
if ( judge!= null ) {
alert ( "出生日期" + judge[ 2 ] ) ;
} else {
alert ( "请输入合法的身份证" ) ;
}
}
< / script>
< / body>
< / html>
将上述代码运行,在页面上的身份证文本框输入“441222199712121234”,弹出“出生日期19971212”提示框。
3.7 Cookies
Cookie 让您在网页中存储用户信息。 Cookie 是在您的计算机上存储在小的文本文件中的数据。 当 web 服务器向浏览器发送网页后,连接被关闭,服务器会忘记用户的一切。 Cookie 是为了解决“如何记住用户信息”而发明的: 当用户访问网页时,他的名字可以存储在 cookie 中。 下次用户访问该页面时,cookie 会“记住”他的名字。
Cookie 保存在名称值对 中,如:
username= bass
当浏览器从服务器请求一个网页时,将属于该页的 cookie 添加到该请求中。这样服务器就获得了必要的数据来“记住”用户的信息。
如果浏览器已关闭本地 cookie 支持,则以下实例均无法工作。
3.7.1 创建cookie
JavaScript 可以用 document.cookie 属性创建、读取、删除 cookie。 通过 JavaScript,可以这样创建 cookie:
doucument. cookie= "username=bass" ;
还可以添加有效日期(UTC 时间)。默认情况下,在浏览器关闭时会删除 cookie:
document. cookie = "username=bass; expires=Sat Apr 02 2022 22:32:29 UTC" ;
通过 path 参数,您可以告诉浏览器 cookie 属于什么路径。默认情况下,cookie 属于当前页。
document. cookie = "username=bass; expires=Sat Apr 02 2022 22:32:29 UTC" ; path= / ";
3.7.2 读取 cookie
通过 JavaScript,可以这样读取 cookie:
var x = document. cookie;
3.7.3 改变 cookie
通过使用 JavaScript,你可以像你创建 cookie 一样改变它:
document. cookie = "username=bass; expires=Sat Apr 02 1970 22:32:29 UTC" ; path= / ";
旧 cookie 被覆盖。
3.7.4 删除 cookie
删除 cookie 时不必指定 cookie 值。 直接把 expires 参数设置为过去的日期即可:
document. cookie = "username=bass; expires=Sat Apr 02 2022 22:32:29 UTC" ; path= / ";
您应该定义 cookie 路径以确保删除正确的 cookie。 如果你不指定路径,一些浏览器不会让你删除 cookie。
3.7.5 cookie 字符串
document.cookie 属性看起来像一个正常的文本字符串。但它不是。 即使你向 document.cookie 写一份完整的 cookie 字符串,当再次读取时,你只能看到它的名称-值对。 如果设置了新 cookie,则旧的 cookie 不会被覆盖。新的 Cookie 会被添加到 document.cookie,所以如果你读取 document.cookie,你得到的东西会像这样:
cookie1 = value; cookie2 = value;
如果你想找到一个指定 cookie 的值,你必须编写 JavaScript 函数来搜索 cookie 字符串中的 cookie 值。 这里需要结合下面的实例!!!!!!!!!!!!
3.7.6 JavaScript Cookie 实例
创建一个 cookie 来存储访问者的名称。 访客第一次到达网页时,会要求他填写姓名。然后将该名称存储在 cookie 中。 下次访客到达同一页时,他将收到一条欢迎消息。 例如,我们将创建 3 个JavaScript函数: (1)设置cookie的函数 (2)获取 cookie 的函数 (3)检测 cookie 的函数
(1)设置cookie的函数 创建一个函数,将访问者的名字存储在 cookie 变量中:
function setCookie ( cname, cvalue, exdays ) {
var d= new Date ( ) ;
d. setTime ( d. getTime ( ) + ( exdays* 24 * 60 * 60 * 1000 ) ) ;
var expires= "expires" + d. toUTCString ( ) ;
document. cookie= cname+ "=" + cvalue+ ";" + expires+ ";path=/" ;
}
分析上述代码, cookie 的名字(cname),cookie 的值(cvalue),以及知道 cookie 过期的天数(exdays)。 通过把 cookie 名称、cookie 值和过期字符串相加,该函数就设置了 cookie。
(2)获取 cookie 的函数 创建一个函数返回指定 cookie 的值:
function getCookie ( cname ) {
var name = cname + "=" ;
var decodedCookie = decodeURIComponent ( document. cookie) ;
var ca = decodedCookie. split ( ';' ) ;
for ( var i = 0 ; i < ca. length; i++ ) {
var c = ca[ i] ;
while ( c. charAt ( 0 ) == ' ' ) {
c = c. substring ( 1 ) ;
}
if ( c. indexOf ( name) == 0 ) {
return c. substring ( name. length, c. length) ;
}
}
return "" ;
}
分析上述代码,把 cookie 作为参数(cname)。 创建变量(name)与要搜索的文本(CNAME”=”)。 解码 cookie 字符串,处理带有特殊字符的 cookie,例如 “$”。 用分号把 document.cookie 拆分到名为 ca(decodedCookie.split(‘;’))的数组中。 遍历 ca 数组(i = 0; i < ca.length; i++),然后读出每个值 c = ca[i]。 如果找到 cookie(c.indexOf(name) == 0),则返回该 cookie 的值(c.substring(name.length, c.length)。 如果未找到 cookie,则返回 “”。
(3)检测 cookie 的函数 我们创建检查 cookie 是否设置的函数。 如果已设置 cookie,将显示一个问候。 如果未设置 cookie,会显示一个提示框,询问用户的名字,并存储用户名 cookie 365 天,通过调用 setCookie 函数:
function checkCookie ( ) {
var username = getCookie ( "username" ) ;
if ( username != "" ) {
alert ( "Welcome again " + username) ;
} else {
username = prompt ( "Please enter your name:" , "" ) ;
if ( username != "" && username != null ) {
setCookie ( "username" , username, 365 ) ;
}
}
}
JavaScript小结
JavaScript是基于对象 和事件驱动 并具有相对安全性的客户端脚本语言 。 JavaScript特点:松散型、解释型、基于对象、安全性、跨平台。 JavaScript可以写在html文件的head标签里面,可以写在body标签,也可以写在外部js文件。 JavaScript的数据类型有数值型、字符串型、布尔型、空值、未定义值。 赋值运算符有+,-,*,/,%,&,|,^ JavaScript流程控制有if语句、switch语句、for语句、while语句和do-while语句。 函数定义用function关键字定义。匿名函数用一个变量来接受函数,不用写函数名。 全局函数可直接写名称使用即可。直接写名称使用即可。全局函数有encodeURI函数、decodeURI函数、encodeURIComponent函数、decodeURIComponent函数、eval函数、isFinite函数、isNaN函数、Number函数、parseFloat函数、parselnt函数、String函数。 JavaScript负责事件。通常使用函数来对事件进行处理。 正则表达式是构成搜索模式的字符序列,简单理解为模板。 Cookie 是在您的计算机上存储在小的文本文件中的数据。对cookie操作有:操作cookie、读取cookie、改变cookie、删除cookie。
总结
html负责框架,css负责样式,js负责动作。
你可能感兴趣的:(测试,前端开发,html5,css3,javascript,正则表达式)
华为OD机试 - 单向链表中间节点(Java & JS & Python & C & C++)
华为OD题库
华为od 链表 java
须知哈喽,本题库完全免费,收费是为了防止被爬,大家订阅专栏后可以私信联系退款。感谢支持文章目录须知题目描述输出描述解析代码题目描述给定一个单链表L,请编写程序输出L中间结点保存的数据。如果有两个中间结点,则输出第二个中间结点保存的数据。例如:给定L为1→7→5,则输出应该为7;给定L为1→2→3→4,则输出应该为3;输入描述每个输入包含1个测试用例。每个测试用例:第一行给出链表首结点的地址、结点总
【转载】SSD测试第一神器——FIO
running_sheep
转自:[http://www.ssdfans.com]对于SSD性能测试来说,最好的工具莫过于FIO了。FIO是Jens开发的一个开源测试工具,功能非常强大,本文就只介绍其中一些基本功能。线程,队列深度,Offset,同步异步,DirectIO,BIO使用FIO之前,首先要有一些SSD性能测试的基础知识。线程指的是同时有多少个读或写任务在并行执行,一般来说,CPU里面的一个核心同一时间只能运行一个
谷歌浏览器驱动Chromedriver(114-120版本)文件以及驱动下载教程
pigerr杨
Python python chrome drivers
ChromeDriver官方网站GitHub||GoogleChromeLabs/chrome-for-testingChromeDriver113-125_JSONChromeforTestingavailability123-125zip白月黑羽Python基础|进阶|Qt图形界面|Django|自动化测试|性能测试|JS语言|JS前端|原理与安装
虚拟 DOM 的优缺点有哪些
咕噜签名分发
前端 javascript 开发语言
虚拟DOM(VirtualDOM)技术作为现代前端开发中的重要组成部分,已经成为了众多流行前端框架的核心特性。它的引入为前端开发带来了诸多优势,同时也需要我们认真思考其潜在的考量。下面简单的介绍一下虚拟DOM技术的优势与缺点,深入探讨其在实际应用中的影响。提升性能虚拟DOM的最大优势之一是提升页面性能。通过比较前后两次虚拟DOM树的差异,最小化实际DOM操作,从而减少页面重渲染时的性能消耗。这种优
3、JavaWeb-Ajax/Axios-前端工程化-Element
所谓远行Misnearch
# JavaWeb 前端 ajax elementui java 前端框架
P34Ajax介绍Ajax:AsynchroousJavaScriptAndXML,异步的JS和XMLJS网页动作,XML一种标记语言,存储数据,作用:数据交换:通过Ajax给服务器发送请求,并获取服务器响应的数据异步交互:在不重新加载整个页面的情况下,与服务器交换数据并实现更新部分网页的技术,例如:搜索联想、用户名是否可用的校验等等。同步与异步:同步:服务器在处理中客户端要处于等待状态,输入域名
网络安全(黑客)——自学2024
小言同学喜欢挖漏洞
web安全 安全 网络 学习 网络安全 信息安全 渗透测试
01什么是网络安全网络安全可以基于攻击和防御视角来分类,我们经常听到的“红队”、“渗透测试”等就是研究攻击技术,而“蓝队”、“安全运营”、“安全运维”则研究防御技术。无论网络、Web、移动、桌面、云等哪个领域,都有攻与防两面性,例如Web安全技术,既有Web渗透,也有Web防御技术(WAF)。作为一个合格的网络安全工程师,应该做到攻守兼备,毕竟知己知彼,才能百战百胜。02怎样规划网络安全如果你是一
黑客(网络安全)技术自学30天
一个迷人的黑客
web安全 安全 网络 笔记 网络安全 信息安全 渗透测试
01什么是网络安全网络安全可以基于攻击和防御视角来分类,我们经常听到的“红队”、“渗透测试”等就是研究攻击技术,而“蓝队”、“安全运营”、“安全运维”则研究防御技术。无论网络、Web、移动、桌面、云等哪个领域,都有攻与防两面性,例如Web安全技术,既有Web渗透,也有Web防御技术(WAF)。作为一个合格的网络安全工程师,应该做到攻守兼备,毕竟知己知彼,才能百战百胜。02怎样规划网络安全如果你是一
2.5 项目讲解流程
王守谦26
项目资料 数据库
一、项目讲解1、自我介绍2、项目流程-===============================二、自我介绍(一)、学员自我介绍,讲解存在的问题比如:讲解年份、卡顿、重点学历、忘记(二)自我规则内容1、开场白:礼貌用语2、时间:自我介绍1-2分钟以内3、内容:姓名、籍贯、毕业院校、(拉进面试官距离)4、技能:功能测试、接口测试、自动化测试、app测试、性能测试、安全测试黑盒测试、白盒测试、灰盒
Python dict字符串转json对象,小数精度丢失问题
朝如青丝 暮成雪
json python
一前言JSON(JavaScriptObjectNotation)是一种轻量级的数据交换格式,dict是Python的一种数据格式。本篇介绍一个float数据转换时精度丢失的案例。二问题描述importjsontest_str1='{"π":3.1415926535897932384626433832795028841971}'test_str2='{"value":10.00000}'print
15:00面试,15:06就出来了,问的问题有点变态。。。
爱学习的执念
面试 软件测试 软件测试面试 面试 职场和发展
从小厂出来,没想到在另一家公司又寄了。到这家公司开始上班,加班是每天必不可少的,看在钱给的比较多的份上,就不太计较了。没想到9月一纸通知,所有人不准加班,加班费不仅没有了,薪资还要降40%,这下搞的饭都吃不起了。还在有个朋友内推我去了一家互联网公司,兴冲冲见面试官,没想到一道题把我给问死了:如果模块请求http改为了https,测试方案应该如何制定,修改?感觉好简单的题,硬是没有答出来,早知道好好
自动化测试 —— Pytest fixture及conftest详解
咖啡加剁椒③
软件测试 pytest 功能测试 软件测试 自动化测试 程序人生 职场和发展
前言fixture是在测试函数运行前后,由pytest执行的外壳函数。fixture中的代码可以定制,满足多变的测试需求,包括定义传入测试中的数据集、配置测试前系统的初始状态、为批量测试提供数据源等等。fixture是pytest的精髓所在,类似unittest中setup/teardown,但是比它们要强大、灵活很多,它的优势是可以跨文件共享。一、Pytestfixture1.pytestfix
自学黑客(网络安全)技术——2024最新
九九归二
web安全 安全 学习 笔记 网络 网络安全 信息安全
01什么是网络安全网络安全可以基于攻击和防御视角来分类,我们经常听到的“红队”、“渗透测试”等就是研究攻击技术,而“蓝队”、“安全运营”、“安全运维”则研究防御技术。无论网络、Web、移动、桌面、云等哪个领域,都有攻与防两面性,例如Web安全技术,既有Web渗透,也有Web防御技术(WAF)。作为一个合格的网络安全工程师,应该做到攻守兼备,毕竟知己知彼,才能百战百胜。02怎样规划网络安全如果你是一
电商打单ERP必备API列表-API调用指南
懂电商API接口的Jennifer
淘宝API接口 spring java 后端 爬虫 数据挖掘 网络爬虫
1、打开淘宝开放平台API文档,查看API参数。2、选择需要的API,进行测试对接。注册账号获取APIkey3、进入API测试页,开始测试taobao.customcustom-自定义API操作公共参数名称类型必须描述keyString是调用key(必须以GET方式拼接在URL中)secretString是调用密钥api_nameString是API接口名称(包括在请求地址中)[item_sear
史上最详细的测试用例写作规范
心软小念
测试用例
软件测试用例得出软件测试用例的内容,其次,按照软件测试写作方法,落实到文档中,两者是形式和内容的关系,好的测试用例不仅方便自己和别人查看,而且能帮助设计的时候考虑的更周。一个好的测试用例必须包含足够的内容,将这些内容可以拆分为八个要素:用例编号、测试项目、测试标题、重要级别、预置条件、测试输入、操作步骤、预期输出。1、用例编号1)规则:是由字符和数字组成的字符串,具有唯一性、易识别性。2)不同阶段
PaperWeekly
sapienst
Papers PaperwithCode General ML
1.Python软件包解决DL在未见过的数据分布下性能差的问题:(1)神经网络和损失分离的模块化设计(2)强大便捷的基准测试能力(3)易于使用但难以修改(4)github:https://github.com/marrlab/domainlabTrainer和Models之间是什么关系Trainer和Models是DomainLab中的两个核心概念。Trainer是一个用于指导数据流向模型并计算S
javascript 日期转换为时间戳,时间戳转换为日期的函数
cdcdhj
javascript学习日记 javascript 开发语言 ecmascript
日期转化为时间戳,主要用valueOf()来进行转化为毫秒时间戳,getTime()IOS系统无法解析转换,所以都有valueOf()letgetTimestampOrDate=function(timestamp){lettimeStamp='';constregex=/^\d{4}(-|\/)\d{2}(-|\/)\d{2}$/;constregex2=/^\d{4}(-|\/)\d{2}(-
COMP315 JavaScript Cloud Computing for E Commerce
zhuyu0206girl
javascript 开发语言 ecmascript
Assignment1:Javascript1IntroductionAcommontaskincloudcomputingisdatacleaning,whichistheprocessoftakinganinitialdatasetthatmaycontainerroneousorincompletedata,andremovingorfixingthoseelementsbeforeform
JSON与AJAX:网页交互的利器
入冉心
json ajax 前端
在现代Web开发中,JSON(JavaScriptObjectNotation)和AJAX(AsynchronousJavaScriptandXML)是两项不可或缺的技术。它们共同为网页提供了动态、实时的数据交互能力,为用户带来了更加流畅和丰富的体验。本文将详细介绍JSON和AJAX的概念、原理,并通过代码示例展示它们在实际开发中的应用。一、JSON:轻量级的数据交换格式JSON是一种轻量级的数据
Flink算子通用状态应用测试样例
公子乂
flink java servlet
Flink算子通用状态应用测试样例1.获取Flink执行环境finalStreamExecutionEnvironmentenv=StreamExecutionEnvironment.getExecutionEnvironment();env.setParallelism(1);2.创建数据源,生成随机数据DataStream>source=env.addSource(newSourceFunct
javascript的数据类型及转换
田小田txt
一、JavaScript数据类型:共有string,number,boolean,object,function五种数据类型;其中Object,Date,Array为对象型;2个不包含任何值的数据类型:null,undefined。二、Typeof查看数据类型:typeof"John"//返回stringtypeof3.14//返回numbertypeofNaN//返回numbertypeoffa
Python自动化测试web常见框架汇总
自动化测试薰儿
软件测试 技术分享 python 前端 开发语言
1、前言目前,有非常多的Python框架,用来帮助你更轻松的创建web应用。这些框架把相应的模块组织起来,使得构建应用的时候可以更快捷,也不用去关注一些细节(例如socket和协议),所以需要的都在框架里了。接下来我们会介绍不同的选项。经过初期的不起眼,Python已经成为互联网最流行的服务端编程语言之一。根据W3Techs的统计,它被用于很多的大流量的站点很多的大流量的站点很多的大流量的站点,超
零基础机器学习(5)之线性回归模型的性能评估
一只特立独行猪
机器学习 机器学习 线性回归 人工智能
文章目录线性回归模型的性能评估1.举例1-单一特征2.举例2-多特征线性回归模型的性能评估评估线性回归模型时,首先要建立评估的测试数据集(测试集不能与训练集相同),然后选择合适的评估方法,实现对线性回归模型的评估。回归任务中最常用的评估方法有均方误差、均方根误差和预测准确率(确定系数)。1.举例1-单一特征分别对两个模型进行评估,输入的测试集如表所示。面积/(m2)售价/(万元)面积/(m2)售价
外包干了10天,技术倒退明显
程序员 二 黑
软件测试 自动化测试 python
先说情况,大专毕业,18年通过校招进入湖南某软件公司,干了接近6年的功能测试,今年年初,感觉自己不能够在这样下去了,长时间呆在一个舒适的环境会让一个人堕落!而我已经在一个企业干了四年的功能测试,已经让我变得不思进取,谈了2年的女朋友也因为我的心态和工资和我分手了。于是,我决定要改变现状,冲击下大厂。刚开始准备时,自己都蒙了,6年的功能测试让我的技术没有一丝的进步,提升的只有我的年龄…没办法,我找到
网络安全(黑客技术)—自学
德西德西
web安全 安全 网络安全 学习 python 开发语言 php
1.网络安全是什么网络安全可以基于攻击和防御视角来分类,我们经常听到的“红队”、“渗透测试”等就是研究攻击技术,而“蓝队”、“安全运营”、“安全运维”则研究防御技术。2.网络安全市场一、是市场需求量高;二、则是发展相对成熟入门比较容易。3.所需要的技术水平需要掌握的知识点偏多(举例):4.国家政策环境对于国家与企业的地位愈发重要,没有网络安全就没有国家安全更有为国效力的正义黑客—红客联盟可见其重视
C# CsvHelper 使用
GeGe&YoYo
工具类 c# 开发语言
C#CsvHelper使用1.简介CsvHelper是一个用于读写CSV文件的.NET库。极其快速,灵活且易于使用。CsvHelper建立在.NETStandard2.0之上,几乎可以在任何地方运行。Github地址:https://github.com/joshclose/csvhelper2.模块3.读取测试类publicclassFoo{publicintID{get;set;}public
javascript实现SM2加密解密
人生在勤,不索何获
javascript 前端 jquery
前提JavaWeb环境前端代码window.sm2=function(t){functioni(e){if(r[e])returnr[e].exports;varn=r[e]={i:e,l:!1,exports:{}};returnt[e].call(n.exports,n,n.exports,i),n.l=!0,n.exports}varr={};returni.m=t,i.c=r,i.d=fu
Vue:为什么要使用v-cloak
刻刻帝的海角
vue.js 前端 javascript
Vue.js是一种流行的JavaScript框架,它使我们能够构建交互性强大的用户界面。在Vue.js中,v-cloak是一个指令,用于解决在页面加载时出现的闪烁问题。本文将介绍如何使用v-cloak及代码来优化Vue.js应用程序的渲染效果。引言当我们使用Vue.js构建应用程序时,有时会遇到一个问题:在页面加载时,由于Vue.js需要一定的时间来解析和渲染模板,会导致页面上显示出未经处理的Mu
python在ui自动化中的一些常见用法
loveyena
http://cn.python-requests.org/zh_CN/latest可以查看requests库的说明,pprint(res.json(),width=30)可以对请求的返回值按照json格式化形式进行打印。常见的content-type有application/x-www-form-urlencoded、application/json、application/xml。自动化测试操
基于 JMeter API 开发性能测试平台
咖啡加剁椒⑦
软件测试 jmeter 功能测试 软件测试 自动化测试 程序人生 职场和发展
背景:JMeter是一个功能强大的性能测试工具,若开发一个性能测试平台,用它作为底层执行引擎在合适不过。如要使用其API,就不得不对JMeter整个执行流程,常见的类有清楚的了解。常用的JMeter类和功能的解释:TestPlan类:代表一个测试计划,它是性能测试的顶级元素。您可以使用它来设置全局的测试属性,如测试名称、线程组、监听器等。ThreadGroup类:代表线程组,它定义了并发执行的线程
15:00面试,15:06就出来了,问的问题有点变态。。。
程序员油条
自动化测试 软件测试 面试 面试 职场和发展
从小厂出来,没想到在另一家公司又寄了。到这家公司开始上班,加班是每天必不可少的,看在钱给的比较多的份上,就不太计较了。没想到9月一纸通知,所有人不准加班,加班费不仅没有了,薪资还要降40%,这下搞的饭都吃不起了。还在有个朋友内推我去了一家互联网公司,兴冲冲见面试官,没想到一道题把我给问死了:如果模块请求http改为了https,测试方案应该如何制定,修改?感觉好简单的题,硬是没有答出来,早知道好好
异常的核心类Throwable
无量
java 源码 异常处理 exception
java异常的核心是Throwable,其他的如Error和Exception都是继承的这个类 里面有个核心参数是detailMessage,记录异常信息,getMessage核心方法,获取这个参数的值,我们可以自己定义自己的异常类,去继承这个Exception就可以了,方法基本上,用父类的构造方法就OK,所以这么看异常是不是很easy
package com.natsu;
mongoDB 游标(cursor) 实现分页 迭代
开窍的石头
mongodb
上篇中我们讲了mongoDB 中的查询函数,现在我们讲mongo中如何做分页查询
如何声明一个游标
var mycursor = db.user.find({_id:{$lte:5}});
迭代显示游标数
MySQL数据库INNODB 表损坏修复处理过程
0624chenhong
tomcat mysql
最近mysql数据库经常死掉,用命令net stop mysql命令也无法停掉,关闭Tomcat的时候,出现Waiting for N instance(s) to be deallocated 信息。查了下,大概就是程序没有对数据库连接释放,导致Connection泄露了。因为用的是开元集成的平台,内部程序也不可能一下子给改掉的,就验证一下咯。启动Tomcat,用户登录系统,用netstat -
剖析如何与设计人员沟通
不懂事的小屁孩
工作
最近做图烦死了,不停的改图,改图……。烦,倒不是因为改,而是反反复复的改,人都会死。很多需求人员不知该如何与设计人员沟通,不明白如何使设计人员知道他所要的效果,结果只能是沟通变成了扯淡,改图变成了应付。
那应该如何与设计人员沟通呢?
我认为设计人员与需求人员先天就存在语言障碍。对一个合格的设计人员来说,整天玩的都是点、线、面、配色,哪种构图看起来协调;哪种配色看起来合理心里跟明镜似的,
qq空间刷评论工具
换个号韩国红果果
JavaScript
var a=document.getElementsByClassName('textinput');
var b=[];
for(var m=0;m<a.length;m++){
if(a[m].getAttribute('placeholder')!=null)
b.push(a[m])
}
var l
S2SH整合之session
灵静志远
spring AOP struts session
错误信息:
Caused by: org.springframework.beans.factory.BeanCreationException: Error creating bean with name 'cartService': Scope 'session' is not active for the current thread; consider defining a scoped
xmp标签
a-john
标签
今天在处理数据的显示上遇到一个问题:
var html = '<li><div class="pl-nr"><span class="user-name">' + user
+ '</span>' + text + '</div></li>';
ulComme
Ajax的常用技巧(2)---实现Web页面中的级联菜单
aijuans
Ajax
在网络上显示数据,往往只显示数据中的一部分信息,如文章标题,产品名称等。如果浏览器要查看所有信息,只需点击相关链接即可。在web技术中,可以采用级联菜单完成上述操作。根据用户的选择,动态展开,并显示出对应选项子菜单的内容。 在传统的web实现方式中,一般是在页面初始化时动态获取到服务端数据库中对应的所有子菜单中的信息,放置到页面中对应的位置,然后再结合CSS层叠样式表动态控制对应子菜单的显示或者隐
天-安-门,好高
atongyeye
情感
我是85后,北漂一族,之前房租1100,因为租房合同到期,再续,房租就要涨150。最近网上新闻,地铁也要涨价。算了一下,涨价之后,每次坐地铁由原来2块变成6块。仅坐地铁费用,一个月就要涨200。内心苦痛。
晚上躺在床上一个人想了很久,很久。
我生在农
android 动画
百合不是茶
android 透明度 平移 缩放 旋转
android的动画有两种 tween动画和Frame动画
tween动画;,透明度,缩放,旋转,平移效果
Animation 动画
AlphaAnimation 渐变透明度
RotateAnimation 画面旋转
ScaleAnimation 渐变尺寸缩放
TranslateAnimation 位置移动
Animation
查看本机网络信息的cmd脚本
bijian1013
cmd
@echo 您的用户名是:%USERDOMAIN%\%username%>"%userprofile%\网络参数.txt"
@echo 您的机器名是:%COMPUTERNAME%>>"%userprofile%\网络参数.txt"
@echo ___________________>>"%userprofile%\
plsql 清除登录过的用户
征客丶
plsql
tools---preferences----logon history---history 把你想要删除的删除
--------------------------------------------------------------------
若有其他凝问或文中有错误,请及时向我指出,
我好及时改正,同时也让我们一起进步。
email : binary_spac
【Pig一】Pig入门
bit1129
pig
Pig安装
1.下载pig
wget http://mirror.bit.edu.cn/apache/pig/pig-0.14.0/pig-0.14.0.tar.gz
2. 解压配置环境变量
如果Pig使用Map/Reduce模式,那么需要在环境变量中,配置HADOOP_HOME环境变量
expor
Java 线程同步几种方式
BlueSkator
volatile synchronized ThredLocal ReenTranLock Concurrent
为何要使用同步? java允许多线程并发控制,当多个线程同时操作一个可共享的资源变量时(如数据的增删改查), 将会导致数据不准确,相互之间产生冲突,因此加入同步锁以避免在该线程没有完成操作之前,被其他线程的调用, 从而保证了该变量的唯一性和准确性。 1.同步方法&
StringUtils判断字符串是否为空的方法(转帖)
BreakingBad
null StringUtils “”
转帖地址:http://www.cnblogs.com/shangxiaofei/p/4313111.html
public static boolean isEmpty(String str)
判断某字符串是否为空,为空的标准是 str==
null
或 str.length()==
0
编程之美-分层遍历二叉树
bylijinnan
java 数据结构 算法 编程之美
import java.util.ArrayList;
import java.util.LinkedList;
import java.util.List;
public class LevelTraverseBinaryTree {
/**
* 编程之美 分层遍历二叉树
* 之前已经用队列实现过二叉树的层次遍历,但这次要求输出换行,因此要
jquery取值和ajax提交复习记录
chengxuyuancsdn
jquery取值 ajax提交
// 取值
// alert($("input[name='username']").val());
// alert($("input[name='password']").val());
// alert($("input[name='sex']:checked").val());
// alert($("
推荐国产工作流引擎嵌入式公式语法解析器-IK Expression
comsci
java 应用服务器 工作 Excel 嵌入式
这个开源软件包是国内的一位高手自行研制开发的,正如他所说的一样,我觉得它可以使一个工作流引擎上一个台阶。。。。。。欢迎大家使用,并提出意见和建议。。。
----------转帖---------------------------------------------------
IK Expression是一个开源的(OpenSource),可扩展的(Extensible),基于java语言
关于系统中使用多个PropertyPlaceholderConfigurer的配置及PropertyOverrideConfigurer
daizj
spring
1、PropertyPlaceholderConfigurer
Spring中PropertyPlaceholderConfigurer这个类,它是用来解析Java Properties属性文件值,并提供在spring配置期间替换使用属性值。接下来让我们逐渐的深入其配置。
基本的使用方法是:(1)
<bean id="propertyConfigurerForWZ&q
二叉树:二叉搜索树
dieslrae
二叉树
所谓二叉树,就是一个节点最多只能有两个子节点,而二叉搜索树就是一个经典并简单的二叉树.规则是一个节点的左子节点一定比自己小,右子节点一定大于等于自己(当然也可以反过来).在树基本平衡的时候插入,搜索和删除速度都很快,时间复杂度为O(logN).但是,如果插入的是有序的数据,那效率就会变成O(N),在这个时候,树其实变成了一个链表.
tree代码:
C语言字符串函数大全
dcj3sjt126com
c function
C语言字符串函数大全
函数名: stpcpy
功 能: 拷贝一个字符串到另一个
用 法: char *stpcpy(char *destin, char *source);
程序例:
#include <stdio.h>
#include <string.h>
int main
友盟统计页面技巧
dcj3sjt126com
技巧
在基类调用就可以了, 基类ViewController示例代码
-(void)viewWillAppear:(BOOL)animated
{
[super viewWillAppear:animated];
[MobClick beginLogPageView:[NSString stringWithFormat:@"%@",self.class]];
window下在同一台机器上安装多个版本jdk,修改环境变量不生效问题处理办法
flyvszhb
java jdk
window下在同一台机器上安装多个版本jdk,修改环境变量不生效问题处理办法
本机已经安装了jdk1.7,而比较早期的项目需要依赖jdk1.6,于是同时在本机安装了jdk1.6和jdk1.7.
安装jdk1.6前,执行java -version得到
C:\Users\liuxiang2>java -version
java version "1.7.0_21&quo
Java在创建子类对象的同时会不会创建父类对象
happyqing
java 创建 子类对象 父类对象
1.在thingking in java 的第四版第六章中明确的说了,子类对象中封装了父类对象,
2."When you create an object of the derived class, it contains within it a subobject of the base class. This subobject is the sam
跟我学spring3 目录贴及电子书下载
jinnianshilongnian
spring
一、《跟我学spring3》电子书下载地址:
《跟我学spring3》 (1-7 和 8-13) http://jinnianshilongnian.iteye.com/blog/pdf
跟我学spring3系列 word原版 下载
二、
源代码下载
最新依
第12章 Ajax(上)
onestopweb
Ajax
index.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/
BI and EIM 4.0 at a glance
blueoxygen
BO
http://www.sap.com/corporate-en/press.epx?PressID=14787
有机会研究下EIM家族的两个新产品~~~~
New features of the 4.0 releases of BI and EIM solutions include:
Real-time in-memory computing –
Java线程中yield与join方法的区别
tomcat_oracle
java
长期以来,多线程问题颇为受到面试官的青睐。虽然我个人认为我们当中很少有人能真正获得机会开发复杂的多线程应用(在过去的七年中,我得到了一个机会),但是理解多线程对增加你的信心很有用。之前,我讨论了一个wait()和sleep()方法区别的问题,这一次,我将会讨论join()和yield()方法的区别。坦白的说,实际上我并没有用过其中任何一个方法,所以,如果你感觉有不恰当的地方,请提出讨论。
&nb
android Manifest.xml选项
阿尔萨斯
Manifest
结构
继承关系
public final class Manifest extends Objectjava.lang.Objectandroid.Manifest
内部类
class Manifest.permission权限
class Manifest.permission_group权限组
构造函数
public Manifest () 详细 androi
Oracle实现类split函数的方
zhaoshijie
oracle
关键字:Oracle实现类split函数的方
项目里需要保存结构数据,批量传到后他进行保存,为了减小数据量,子集拼装的格式,使用存储过程进行保存。保存的过程中需要对数据解析。但是oracle没有Java中split类似的函数。从网上找了一个,也补全了一下。
CREATE OR REPLACE TYPE t_split_100 IS TABLE OF VARCHAR2(100);
cr