【2015-12-18】近期小结

1.Eclipse无法编译项目,工程上有一个大的红色感叹号!

最近一次碰到一种比较难搞的情况:web工程不编译了,并且项目上还出现了一个大的红色的感叹号(这个感叹号也表示该项目无法编译)。虽知道应该是去build path下找原因,但着实折腾了很久。。

把jar包删除了,再重新引用,问题依旧……

解决办法:其实我比较忽略problems的窗口,虽然绝大多数情况下,这个view里面的提示信息并没有什么卵用,但经过这次教训,我觉得当你遇到项目不生产class文件的类似棘手情况时,

查看Problems窗口很与必要!!

这次经人提醒,点开了Problems窗口,发现了一个组织项目正常编译的致命错误——jar包被打成一个User Library,而这些jar包里面混入了一个.ftl文件。就以为如此,我的项目才迟迟未能编译。remove之,终于

出现了熟悉的Building workspace进度条,最终终于正常生产class文件了!!

 

2.表示若干个参数(也有可能没有)用 Object... 

        public static void main(String[] args) {
		test();
		test("a", new Date());
		test(12);
	}
	
	public static void test(Object... objs) {
		//处理逻辑
	}

 上述代码,main方法都可以正常调用test方法。test方法的参数就是Object... objs; 并且当调用test方法传入了参数时,可以使用objs[n](n不应超过参数的个数-1)来访问第n+1个参数。

 但并不意味着obj是一个数组,比如你把test方法的声明改成test(Object[] objs),而main方法依然如上述调用时,编译会报错!

 

3.注意到一个可能遇到的隐晦问题:注意类名相同,但类处在不同package中的情况。

比如我最近在做平台迁移的过程中,出现两个相同类名,但一个属于jar包,一个属于自定义的java类的接口。

定义一个实现类去实现的依然是jar包的接口,但我调用某方法,需要传入的实现类是应该实现自定义接口的,由此出现编译错误——虽然这个实现类是自定义的,但如果你实现的接口并不是该方法

要求的自定义的接口,会编译不通过的。虽然这2个接口同名,但他们没有任何关系,所以这个实现类实现哪个接口完全是两回事儿!

 

4.由js里ajax的url访问路径所发现的绝对路径、相对路径问题。

之前一直对绝对路径、相对路径傻傻分不清楚。今天终于有了一个比较清晰的概念。一般我们写ajax的url时,一般都是用绝对路径吧,这个是比较保险的做法。

绝对路径是以"/"打头的,相对路径则没有。比如你写Url: /test/action/get,则ajax会去访问如下地址:localhost:8080/test/action/get(当然localhost代表ip, test代表项目Context上下文)

一般来说,用绝对路径时,需要得出localhost:8080/test部分,即 ip:port/context部分,这部分的得出可以在Jsp中用request对象的方法求出,再在js中获取。但当你用的不是Jsp,而是模板

如ftl来渲染页面时,你就无法写java代码求出来了。。

还有一个比较经典的用纯粹的js来获取ip:port/context部分的方法:

function getRootPath() {
	var curWwwPath = window.document.location.href;
	var t = curWwwPath.lastIndexOf("/");
	var pathName = window.document.location.pathname;
	var pos = curWwwPath.indexOf(pathName);
	var localhostPath = curWwwPath.substring(0, pos);
	var projectName = pathName.substring(0, pathName.substr(1).indexOf("/")+1);
	return localhostPath + projectName;
}

 但这个方法具有潜在的局限性!

它跟你项目的部署方式有关,

方式一:如果你是通过把项目放在tomcat安装目录的webapps下,或者直接通过tomcat的Add and Remove部署时,这个方法是可行的。

方式二:但当你是通过修改conf/Catalina/localhost下的

ROOT.xml配置来部署时,此时你并不要指定项目的Context名,直接访问如localhost:8080就能访问项目主页了。。而且此时,上述的getRootPath()方法也不可行了!!

所以,当你不方便求出basePath即ip:port/context部分,而且又不想受限项目的部署方式时,你只能用相对路径了。。因为js和访问的url的相对位置是不受部署方式影响的。

同时,必须意识到一个重要的概念:写ajax的url用相对路径时,是目标url相对于该js所在的页面的url的相对路径,而不是相对于该js的访问url,也不是物理路径。

如目标url为:localhost:8080/test/action/get

该js所在的页面的访问url为:localhost:8080/test/action2/view 

则js写ajax的url相对路径时,应该是这样url: ../action/get(..表示退一级,此时是action所在级别,localhost:8080/test,再访问action2/get即可访问到目标url)

如果该js所在的页面的访问url为:localhost:8080/test/action/view 

则js写ajax的url相对路径时,应该是这样url: get(同级的话,直接去掉本身view,再写目标的get)

ajax的url访问路径小结:tomcat部署项目的方式虽然是方式一比较常见,而一般绝对路径的basePath部分(ip:port/context)也可以得到,但你不能完全忽视方式二的部署方式,此时通过js代码也不能

得到basePath;而且你前端的渲染方式不是jsp时,并不能通过java代码求出basePath。此时相对路径是个不错的选择!

 

5.div布局小结

1):为div按百分比设置高度,需为其上一级设置高度,否则无效(因为html默认是按内容解释其高度的,刚开始是啥也没有的),如一个div的上一级是body,则需为body和html同时设置高度(用px数值或百分比),这样为该div设置高度才会有效。

(注:这儿之所也要为html设置高度,是因为递归,想让Body按百分比设置高度的话,body的上一级html当然也得设置啦!)

2):只用一个margin属性代替margin-top margin-right margin-bottom margin-left 

margin:10px 5px 15px 20px;依次代表上边距margin-top为10px 右边距margin-right为5px 下边距margin-bottom为15px 左边距margin-left为20px(顺时针的方向就对了)

3):设置若干个div在一行显示,每行都必须要有一个float:left属性。还需注意要在一行显示的div宽度要适中,否则会因为太宽而把排在其后面的div“挤”到下一行。

4):如果想让一个div在一排div(指的是若干个div在同一行)下面显示,需要一个大的div把这行div包起来。否则该div默认会重叠显示在顶部。

5):设置背景图片 background:url('图片路径')

6.实现微博圆形头像效果

<div class="imgDiv" align="center" ><a href="#"><img class="image" src="img/wy.png" /></a>网银</div>

 css(关键)——参考于「知乎」:

.imgDiv{ margin-left:42%;text-align:center;width: 40px;   height: 40px;   padding:2px;   background: #ececec;   border-radius:40px;   box-shadow: 0px 0px 1px rgba(0,0,0,0.4);   -moz-border-radius: 40px;   -webkit-border-radius: 40px;}
.image{  width:40px;    height:40px;    line-height: 0;		/* remove line-height */     display: inline-block;	/* circle wraps image */   border-radius: 50%;	/* relative value */   -moz-border-radius: 50%;   -webkit-border-radius: 50%;   transition: linear 0.25s;}

7.为td的width设百分比

最近在做表格的列宽设置时,发现td设width的百分比没什么用。因为发现一旦某一列的内容过长,它会把其他列的空间挤掉,本想通过设置一个百分比,让内容自动过长的时候可以自动换行,但结果无济于事。

解决办法:table设置样式style="table-layout:fixed;"  同时td加上样式td{word-wrap:break-word;}  就很有用哦,不信试试。

8.其他

1)使用bootstrap的select控件时,如果是动态加载option选项,则需要调用这一句刷新,否则会失效!

$('.selectpicker').selectpicker('refresh');  //其中.selectpicker为使用了bootstrap的select样式的下拉框的class~~

2)jquery数组对象使用[0]或get(0)方法得到的是dom对象,想使用JQuery对象必须再次用$符号括起来;

3)float:left使用的前提是被赋予该属性的div块同属于一个大的父div;

猜你喜欢

转载自raising.iteye.com/blog/2265103