原生JS实现几个常用DOM操作API实例 2017年02月06日 103 阅读 原生实现jQuery的sibling方法<body><span>我是span标签</span><div>我是一个div</div><h1 id="h1">我是标题</h1><p>我是一个段落</p><script type="text/javascript">//获取元素的兄弟节点function siblings(o){//参数o就是想...
详解支持Angular 2的表格控件 2017年02月06日 109 阅读 前端框架一直这最近几年特别火的一个话题,尤其是Angular 2拥有众多的粉丝。在2016年9月份Angular 2正式发布之后,大量的粉丝的开始投入到了Angular 2的怀抱。当然这其中也包括我。如果你想了解Angular 2,推荐官方网站:英文版、中文版。通过快速起步,可以快速体验Angular 2。公司的一个项目想基于Angular 2的2.4 版本进行开发,目前还在进行前期的调研阶段。我担当的任务就是研究基于Angular 2的UI控件,在官方网...
使用JavaScript触发过渡效果的方法 2017年02月06日 99 阅读 使用 :hover 和 :focus 这样的伪类,我们可以很方便的将元素从一个样式切换到另一个样式,而且切换是会有过渡效果。但有时我们想要使用 js 来驱动过渡(即在代码中触发过渡)也是可以实现的。和普通过渡一样,先创建两个样式规则,一个是元素的初始状态,一个是过渡结束的状态。然后用 js 在合适的事机修改对应元素的样式即可。下面以一个日夜景图片切换的样例演示:(1)日景和夜景是两张图片叠在一起的。夜景图初始透明度是0,覆盖在日景图上方。(2)点击“看夜景...
JavaScript DOM节点操作实例小结(新建,删除HTML元素) 2017年02月06日 83 阅读 本文实例讲述了JavaScript DOM节点操作方法。分享给大家供大家参考,具体如下:使用DOM可以新建HTML元素,也可以删除已有的HTML元素。(一)新建元素:<script>//创建新的 <p> 元素var newEle=document.createElement("p");//创建文本节点var node=document.createTextNode("这是使用Javascript创建的新段落。");//将文本节点添加...
Web 开发中Ajax的Session 超时处理方法 2017年02月06日 98 阅读 在 Java Web 开发中,当session超时的情况下,普通页面的跳转好处理。关于Ajax的请求超时处理,就需要特殊处理下了。先写一个统一的过滤器,或者拦截器,针对Ajax请求进行过滤处理,下面示例以Filter为例:public void doFilter(ServletRequest request, ServletResponse response,FilterChain chain) throws IOException, ServletExc...
快速掌握jQuery插件开发 2017年02月06日 102 阅读 在实际开发工作中,总会碰到像滚动,分页,日历等展示效果的业务需求,对于接触过jQuery以及熟悉jQuery使用的人来说,首先想到的肯定是寻找现有的jQuery插件来满足相应的展示需求。目前页面中常用的一些组件,都有多种jQuery插件可供选择,网络上也有很多专门收集jQuery插件的网站。利用jQuery插件确实可以给我们的开发工作带来便捷,但是如果只是会简单使用,而对其中的原理不甚了解,那么在使用过程中碰到问题或者对插件进行定制开发时就会有诸多疑惑。本...
AngularJS使用ng-inlude指令加载页面失败的原因与解决方法 2017年02月06日 95 阅读 本文实例讲述了AngularJS使用ng-inlude指令加载页面失败的原因与解决方法。分享给大家供大家参考,具体如下:AngularJS中提供的ng-include指令,很类似于JSP中的<jsp:include>用来将多个子页面合并到同一个父页面中,避免父页面过大,可读性差,不好维护。父页面parent.html代码如下:<html> <head><script src="angular-1.2.2/angul...
用JavaScript实现让浏览器停止载入页面的方法 2017年02月06日 88 阅读 本想弄个判断页面载入时间,过长就不加载特效的JavaScript代码,不过还是有点缺陷,这里就记录下来吧。IE浏览器用document.execCommand("Stop"),Chrome和Firefox用window.stop()(顺便说下,这是JavaScript标准中定义的方法),写在一起就是下面的方式了:<html> <body> 这里可以显示 <script type="text/javascript"> if...
创建一般js对象的几种方式 2017年02月06日 94 阅读 1.对象字面量创建对象var obj = { a:1,b:2 };注意:对象字面量是一个表达式,这种表达式每次运算都会创建并初始化一个新对象,并计算这个新对象的每个属性值。所以如果在循环体内使用对象字面量,每次循环时都会创建新对象。2.通过new运算符创建对象var obj = new Object(); //创建空对象var ary = new Array(); //创建空的数组对象注意:new运算符后面跟的是一个函数调用,这个函数被称为构造函数。js中...
AngularJS使用angular.bootstrap完成模块手动加载的方法分析 2017年02月06日 91 阅读 本文实例分析了AngularJS使用angular.bootstrap完成模块手动加载的方法。分享给大家供大家参考,具体如下:之前我们看到使用ng-app指令,可以实现模块的自动加载。现在我们看下,angular中如何手动加载模块。需要使用到angular.bootstrap这个函数。<html><head><script src="angular.js"></script><script>// ...
JavaScript自动点击链接 防止绕过浏览器访问的方法 2017年02月06日 107 阅读 做支付宝帐号登录,需要做一个效果,就是打开链接页面的时候,不需要点击链接,直接跳到支付宝登录页面。也就是说,需要做一个自动点击链接的效果。基本都是用这个:<body onLoad="autoclick("auto")"><a id="auto" href=".$url."><img border="0" src="images/alipaylog.gif" /></a></body><scr...
react.js 翻页插件实例代码 2017年02月06日 93 阅读 废话不多说了,下面给大家分享react.js翻页插件的代码,具体代码如下所示: varPage = React.createClass({render:function(){//中间代码更新vartotalRows = this.props.totalRows;varlistRows = this.props.listRows;varnowPage = this.props.nowPage>0?this.props.nowPage:1;var...
Reactjs实现通用分页组件的实例代码 2017年02月06日 90 阅读 大家多少都自己写过各种版本的分页工具条吧,像纯服务版的,纯jsWeb板的,Angular版的,因为这个基础得不能再基础的功能太多地方都会用到,下面我给出以个用ReactJS实现的版本,首先上图看下效果: 注意这个组件需要ES6环境,最好使用NodeJS结合Webpack来打包:webpack --display-error-details --config webpack.config.js 此React版分页组件请亲们结合redux来使用比较方便,UI...
AngularJS 使用ng-repeat报错 [ngRepeat:dupes] 2017年02月06日 85 阅读 AngularJS 使用ng-repeat报错[ngRepeat:dupes] Duplicates in a repeater are not allowed. Use "track by" expression to specify uniqng-repeat报错 <div ng-init="words = ["高校","高校","高校"]" ng-repeat="word in words"> {{word}} </div> ...
学好js,这些js函数概念一定要知道【推荐】 2017年02月06日 80 阅读 函数创建方式1.声明方式 例如:function consoleTip (){ console.log("tip!"); }2.表达式方式 例如:var consoleTip = function(){ console.log("tip!"); }两种方式的区别:1.表达式方式适合用来定义只使用一次的函数,声明方式定义的函数没有这个限制,当然也不是绝对的,这个区别只适用于编码规范上;2.声明方式定义的函数可以在函数调用之前定义也可以在函数调用之后定义,而表...
AngularJS的依赖注入实例分析(使用module和injector) 2017年02月06日 88 阅读 本文实例分析了AngularJS的依赖注入。分享给大家供大家参考,具体如下:依赖注入(DI)的好处不再赘言,使用过spring框架的都知道。AngularJS作为前台js框架,也提供了对DI的支持,这是JavaScript/jQuery不具备的特性。angularjs中与DI相关有angular.module()、angular.injector()、 $injector、$provide。对于一个DI容器来说,必须具备3个要素:服务的注册、依赖关系的声明...
AngularJs中 ng-repeat指令中实现含有自定义指令的动态html的方法 2017年02月06日 90 阅读 今天用angular写table的时候,遇到了一个问题。在ng-repeat中,含有动态的html,而这些html中含有自定义指令。因为希望实现一个能够复用的table,所以定义了一个指令myStandTable,指令代码大概如下:var myCommon = angular.module("myCommon",[]);myCommon.directive("myStandTable", function () { return { restrict: "...
AngularJS框架中的双向数据绑定机制详解【减少需要重复的开发代码量】 2017年02月06日 94 阅读 本文实例讲述了AngularJS框架双向数据绑定机制。分享给大家供大家参考,具体如下:之前写的一篇《AngularJS入门示例之Hello World详解》 ,介绍ng-model的时候提到:使用AngularJS的双向数据绑定机制,不需要我们编写繁琐的代码来实现同样的功能。现在我们看一个比较震撼的例子,看看angularJS是如何减少我们在前端开发中的繁琐劳动的。越是感受到框架功能的强大,越是能够激发学习的兴趣和动力。假如我们有一个学生信息列表,包含学生...
bootstrap组件之按钮式下拉菜单小结 2017年02月06日 94 阅读 1、单按钮下拉菜单基础的下拉菜单最外层是.dropdown的div现在只需要改成.btnd-group的div就可以实现单按钮的下拉菜单<div class="btn-group"><button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">Action <span class="caret"></span...
bootstrap输入框组件使用方法详解 2017年02月06日 138 阅读 本文实例为大家分享了bootstrap输入框组的具体使用方法,供大家参考,具体内容如下1、基本用法我们有时需要在输入框一侧或两侧添加额外的元素 这个时候只需要把所有元素都包裹在一个.input-group的div里面就可以 但是每个输入框组只能有一个input<div class="input-group"> <span class="input-group-addon">@</span> <input type=...