1. try{
判断 抛出}
catch(err)
{ 打印到HTML中(可指向)}
1—1图片验证码,点击更换的代码
<imgstyle="height: 22px;" id="codeImg" onclick="this.src='verifycode?'+Math.random()"alt="点击更换" title="点击更换" src="verifycode" />
<!--onclick="this.src='verifycode?'+Math.random()" 中的 verifycode 可以换成你自己请求的地址-->
切记!!!问号要保留
2. /*是否带有小数*/
function isDecimal(strValue ) {
var objRegExp= /^\d+\.\d+$/;
return objRegExp.test(strValue);
}
/*校验是否中文名称组成 */
function ischina(str) {
var reg=/^[\u4E00-\u9FA5]{2,4}$/; /*定义验证表达式*/
return reg.test(str); /*进行验证*/
}
/*校验是否全由8位数字组成 */
function isStudentNo(str) {
var reg=/^[0-9]{8}$/; /*定义验证表达式*/
return reg.test(str); /*进行验证*/
}
/*校验电话码格式 */
function isTelCode(str) {
var reg= /^((0\d{2,3}-\d{7,8})|(1[3584]\d{9}))$/;
return reg.test(str);
}
/*校验邮件地址是否合法 */
function IsEmail(str) {
var reg=/^\w+@[a-zA-Z0-9]{2,10}(?:\.[a-z]{2,4}){1,3}$/;
return reg.test(str);
}
3.<button onclick="displayDate()">现在的时间是?</button> //提交
4<form name="myform"
action="" onsubmit="return fun1()">//提交表单,用于表单验证,可参考菜鸟教程正则表达式
5.function validateForm() {
var x = document.forms["myForm"]["fname"].value;
if (x == null || x == "") {
alert("需要输入名字。");
return false;
}
}
action为提交表单的php页面地址
6.两侧横线中间字(或者hr设置百分比调整)
<style type="text/css" media="screen">
.line_m{text-decoration:line-through}
</style>
<span class="line_m"> </span>
文字<span class="line_m"> </span>需要多长就多加一个(空格)。
文字出加其他标签会被线横穿!
7. <script>
document.getElementById("myBtn").onclick=function(){displayDate()};
8.box-shadow: 06px 10px lightgray;
box-shadow属性的参数设置取值:
阴影类型:此参数可选。如不设值,默认投影方式是外阴影;如取其唯一值“inset”,其投影为内阴影;
X-offset:阴影水平偏移量,其值可以是正负值。如果值为正值,则阴影在对象的右边,其值为负值时,阴影在对象的左边;
Y-offset:阴影垂直偏移量,其值也可以是正负值。如果为正值,阴影在对象的底部,其值为负值时,阴影在对象的顶部;
阴影模糊半径:此参数可选,,但其值只能是为正值,如果其值为0时,表示阴影不具有模糊效果,其值越大阴影的边缘就越模糊;
阴影扩展半径:此参数可选,其值可以是正负值,如果值为正,则整个阴影都延展扩大,反之值为负值时,则缩小;
阴影颜色:此参数可选。如不设定颜色,浏览器会取默认色,但各浏览器默认取色不一致,特别是在webkit内核下的safari和chrome浏览器下表现为透明色,在Firefox/Opera下表现为黑色(已验证),建议不要省略此参数。
9. background: #00FF00 url(bgimage.gif) no-repeat fixed top;
background:bg-color bg-image position/bg-size bg-repeat bg-origin bg-clip bg-attachment initial|inherit;
10. animation:name duration timing-function delay iteration-count direction;同时设置多个属性
11. 下面的例子使用了 Math 对象的 floor() 方法和 random() 来返回一个介于 0 和 11 之间的随机数floor()方法为下舍入Math.floor(1.6)->1
document.write(Math.floor(Math.random()*11));
12.可去菜鸟教程上看
13、audio标签 支持格式:ogg、wav、mp3
对应属性:
1、autoplay 自动播放。
2、controls 显示播放器 无区别
3、loop 循环播放 无区别
4、preload 预加载
5、muted 静音
解决谷歌无法自动播放的问题——>从60.X版本开始,这个选项被移除了,取而代之的是一个名为Autoplay policy的选项。我们在浏览器中输入chrome://flags/#autoplay-policy,然后在高亮的选项中,将Default换成No user gesture is required:
video标签 支持格式:ogg、mp4、webM
属性:1、width 2、height 3、Poster
要么在相应的audio和video插入src=””,或者在其下的插入<source>标签
13. 1、容器属性
display : flex
声明使用弹性盒布局
flex-direction :row | row-reverse | column | column-reverse
确定子元素排列的方向
flex-wrap : nowrap| wrap | wrap-reverse
元素超过父容器尺寸时是否换行
flex-flow :flex-direction | flex-wrap
同时设置flex-direction 和flex-wrap
justify-content :flex-start | flex-end | center | space-between | space-around
子元素的尺寸确定之后,用此属性来设置flex-direction定义方向上的分布方式
align-items :flex-start | flex-end | center | baseline | stretch
子元素的尺寸确定之后,用此属性来设置flex-direction定义方向上的垂直方向的分布方式
align-content :flex-start | flex-end | center | space-between | space-around | stretch
设置多行子元素在行方向上的对齐方式
2、条目属性
flex : none | <' flex-grow '> <' flex-shrink >'? || <'flex-basis '>
同时设置flex-grow 和 flex-shrink 以及 flex-basisflex-grow :number
表示的是当父元素有多余的空间时,这些空间在不同子元素之间的分配比例
flex-shrink:number
当父元素的空间不足时,各个子元素的尺寸缩小的比例
flex-basis :length | percentage | auto | content
用来确定弹性条目的初始主轴尺寸。
align-self :auto | flex-start | flex-end | center | baseline | stretch
覆写父元素指定的对齐方式
order : integer
改变条目在容器中的出现顺序
14.js中class属性用className,改变某个节点元素的class类
var a=’color’;obtn.style[a]=’red’;//用点则不行,.和[]都可以操作属性,但[]可以操作变量
15. append/prepend 是在选择元素内部嵌入。
after/before 是在元素外面追加。
$("p").remove(".italic");这是另外一个段落。
css({"propertyname":"value","propertyname":"value",...});
16. oBtn.onclick=a;
function a()
{oDiv.style.color='red';}//这样分开调用才有效
17zui导航条去除响应式
18. <map name="planetmap">
<area shape="rect" coords="x1,y1,x2,y2" alt="Sun" href="sun.htm">//矩形
<area shape="poly " coords="x1,y1,x2,y2 ......" alt="Mercury" href="mercur.htm">//多边行
<area shape="circle" coords="x1,y1,r" alt="Venus" href="venus.htm">//圆
</map>
其他属性自己看