分类: WEB前端

获得高度,兼容IE,FF,Chrome

发表于3年前(Dec 24, 2014 2:37:40 PM)  阅读 976  评论 0

分类: WEB前端 JS

标签: 高度

在前台碰到一个问题,需要获得整个页面有多高,即document的高度,JQuery中提供了$(document).height()方法来获得document的高度,但在测试兼容性时,发现Chrome浏览器不兼容,获得的高度为当前浏览器可见的文档高度,并不是我想要的,然后网上查资料,找到下面信息:

网页可见区域宽:document.body.clientWidth
网页可见区域高:document.body.clientHeight
网页可见区域宽:document.body.offsetWidth (包括边线的宽)
网页可见区域高:document.body.offsetHeight (包括边线的宽)
网页正文全文宽:document.body.scrollWidth
网页正文全文高:document.body.scrollHeight
网页被卷去的高:document.body.scrollTop
网页被卷去的左:document.b

......

各种CSS样式控制优先级(解决样式冲突)

发表于3年前(Dec 24, 2014 2:36:42 PM)  阅读 1753  评论 0

分类: WEB前端 CSS

标签: 样式优先级 样式冲突

CSS控制页面样式有四种方法:

1、行内方式
行内方式是4种样式中最直接最简单的一种,直接对HTML标签适用style=””,例如:
<p style=”color:#F00; background:#CCC; font-size:12px;”></p>
虽然这种方法比较直接,在制作页面的时候需要为很多的标签设置style属性,所以会导致HTML页面不够纯净,文件体积过大,不利于搜索蜘蛛爬行,从而导致后期维护成本高。

2、内嵌方式
内嵌方式就是将CSS代码写在<head></head>之间,并且用<style></style>进行声明,例如:
<style type=”text/css”>
<!–
#div1{width:64px; height:64px; float:l

......

artTemplate学习笔记

发表于3年前(Dec 24, 2014 1:04:53 PM)  阅读 1505  评论 0

分类: WEB前端 JS

标签: artTemplate js模板引擎

artTemplate是腾讯开发的js模板引擎,以前有一段时间搞前台时,一直为前台跟后台分离很是头疼,当时自己尝试用js操作json对象去填充数据,一定程度上还是解决了一些问题。前两天偶然看到一篇artTemplate的软文吧,感觉还不错,于是空闲时间就准备玩玩artTemplate。

artTemplate的标准解释读者自己去网上找,笔者所认为的artTemplate就是把用js代码使用json数据渲染html模板(这里是html模板还是js模板看个人理解了)。举个例子,我们经常在jsp页面中迭代遍历一个集合,以展现数据,这时这个jsp页面就既包含了html代码,又包含了java代码,这就使后台开发者拿到静态页面后还具有一定的工作量。使用js模板引擎,美工开发页面时,就只要定义需要什么样的数据,然后把数据用js模板引擎语言去迭代展现(这里美工就需要多学一种js模板引擎语言),而后台开发者只需要写个服务提供对应的数据,将数据替换即可。

网上现在关于artTemplate的资料还不是很多,大部分都还是GitHub提供的例子,这篇博文主要就是记

......

由YUI Compressor压缩引出的关键字问题

发表于3年前(Dec 24, 2014 1:03:52 PM)  阅读 1540  评论 1

分类: Java WEB前端 JS

标签: 关键字 YUI Compressor

js、css文件在互联网应用中进行压缩部署是很常见的事,一来他可以一定程度上减小你文件大小,减小网络数据传输量,从而加快页面加载渲染速度,二来他也可以在一定程度上防止用户研究你的代码进行攻击,当然这个不是主要用途。因为笔者所在的项目采用增量部署的形式,所以笔者写了个简单的工具实现增量包的自动生成,在改进过程中,加入了YUI Compressor(雅虎的一个开源库),这是业内常用的压缩工具,互联网上大多数在线压缩也是使用的他。

昨天同事在使用我的打包工具进行打包时,发现工具报出如下错误:

Exception in thread "main" java.lang.NullPointerException
	at org.mozilla.javascript.Parser.addError(Parser.java:122)
	at org.mozilla.javascript.Parser.reportError(Parser.java:136)
	at 
......

Getting the error in IE 7 “Could not get the styleFloat property. Invalid argument.

发表于3年前(Dec 24, 2014 1:01:02 PM)  阅读 726  评论 0

分类: WEB前端 JS

标签: jquery版本问题

前阵碰到一个前台JS错误,在IE8,FF,Chrome下面执行正常,但是在IE6、IE7下面则页面提示有错误,查看具体错误信息,如标题所示。

网上搜索,类似的问题很少,经过几番查证,发现报错信息乃jquery内部错误,页面使用的jquery版本为1.4,尝试更换为1.7版本,问题解决,看来是版本冲突造成的。如果以后碰到这种jquery内部某明奇妙的错误,可以尝试替换较新的版本试下看。

所见及所得的文字编辑器–CKEditor的使用

发表于3年前(Dec 24, 2014 12:58:51 PM)  阅读 526  评论 0

分类: WEB前端

标签: CKEditor FckEditor html编辑器 所见及多的 文字编辑器

CKEditor原名FckEditor,是所见及所得的文字编辑器,常用来做html的编辑,广泛用于内容管理系统,网上商城等。CKEditor适用范围广泛,文字编辑功能能直接支持html静态页面,这样我们可以很轻易的获取html代码,这次主要说下怎么适用CKEditor获得html代码。

首先,下载去官网下载CKEditor压缩包:http://ckeditor.com/download 。

解压后将ckeditor靠到web项目的WebContent目录下,_samples目录下是使用例子,可以打开看下,对照源码很容易懂。因为ckeditor可以支持java、php、.net,你可以根据你自己的项目类型将多余的文件删除。ckeditor目录下有个config文件,

......

Map的JavaScript实现

发表于3年前(Dec 24, 2014 12:47:57 PM)  阅读 717  评论 0

分类: WEB前端 JS

标签: js map map

Java中的Map是一个很实用的集合,习惯了使用Java中的Map,换别的语言没Map时感觉很不爽,以前写Flex AS代码时碰到过用要用Map的情况,不过AS其实有Dictionary字典类可以代替Java中的Map,同时也可以使用对象的属性-值形式来实现Map,在这里JS的Map实现就是使用的对象的属性-值。实现很简单,这里只是为了让Java程序员轻松的编写JS代码。