【本篇教程需要依赖于PathJs-UI框架】

首先,再开始的时候先放一波简介:

PathJs是一款响应式JavaScript UI框架,他有着出色的能力,帮助你化繁为简。有了他,你大可不必担心繁杂的UI设计工作,只需2行代码,轻松胜任工作里的一切事物。

再来波链接:

好了,现在正式开始!

1、首先在html文件里先把基础结构写好

Pathjs Demo


window.onload = function(){

}

2、在window.onload里写创建PathJs控件的方法

pathjsCreate();

3、接下来我们往这个方法里写参数,这个创建控件的方法有9个参数,不过请放心,不是每个参数都是需要填写的(参数分别是:type\div\title\content\id\url\size\code\CallBackCode)

type填写code,div填写#div1,title随便填写,content就是里面要显示的代码(如果需要显示<>请使用&gt和&lt)【content里面如果需要换行请写
】,id填写一个独一无二的就行、url不写、size是代码域的宽度,code不写,回调代码就随便

pathjsCreate("code","#div1","PathJs code","//这是一个代码域
//用&ltbr&gt可以直接换行","pathjs1","","300","","");

4、这时我们就创建好了一个代码域,现在它还没显示,我们需要使用pathjsShow方法来让他显示

pathjsShow方法有2个参数,分别是:id和回调函数

于是我们这样写:

pathjsShow("pathjs1","");

5、现在我们运行一下,就会发现我们的html文件变成了这样:

创建html文件无法指定html5 html代码创建文件域_创建html文件无法指定html5

现在我们就创建完成了!

Ps:同时,code还可以创建多个哦!但是要注意PathJs Id不能重复!

但是,创建多个的时候要注意!create方法必须集中统一写,像这样:

pathjsCreate("code","#div1","PathJs code","//这是一个代码域
//用&ltbr&gt可以直接换行","pathjs1","","300","","");

pathjsCreate("code","#div1","PathJs code","//这是一个代码域2
//用&ltbr&gt可以直接换行2","pathjs2","","300","","");

pathjsCreate("code","#div1","PathJs code","//这是一个代码域3
//用&ltbr&gt可以直接换行3","pathjs3","","300","","");

pathjsShow("pathjs1","");

pathjsShow("pathjs2","");

pathjsShow("pathjs3","");

绝对不能像这样写:

pathjsCreate("code","#div1","PathJs code","//这是一个代码域
//用&ltbr&gt可以直接换行","pathjs1","","300","","");

pathjsShow("pathjs1","");

pathjsCreate("code","#div1","PathJs code","//这是一个代码域2
//用&ltbr&gt可以直接换行2","pathjs2","","300","","");

pathjsShow("pathjs2","");

pathjsCreate("code","#div1","PathJs code","//这是一个代码域3
//用&ltbr&gt可以直接换行3","pathjs3","","300","","");

pathjsShow("pathjs3","");

否则会显示不全!

好了,那么教程就到此结束了!

创建html文件无法指定html5 html代码创建文件域_UI_02

警告框代码:(警告框一个页面同时只能出现一个哦!想了解更多,请参考)

pathjsCreate("alert","#div1","Hello PathJs","教程完结了!
欢迎访问来下载PathJs-UI哦!","pathjs1","","300","","");

pathjsShow("pathjs1","");