Category: Javascript /Jquery / Bootstrap / Web

jQuery: 遍历json字符串, 遍历object数组,报错:Uncaught TypeError: Cannot use ‘in’ operator to search for ‘156’, Uncaught SyntaxError: Unexpected token k in JSON at position 2, loop over JSON string – $.each example

    遍历一个json字符串,或者object数组的方法: var json = [ {"id":"1","tagName":"apple"}, {"id":"2","tagName":"orange"}, {"id":"3","tagName":"banana"}, {"id":"4","tagName":"watermelon"}, {"id":"5","tagName":"pineapple"} ]; $.each(json, function(idx, obj) { alert(obj.tagName);… Read More

2018年度国产开源软件排行

  1. Arthas:开源 Java 诊断工具 Arthas(阿尔萨斯)是阿里巴巴开源的 Java 诊断工具。 Arthas 支持 JDK 6+,采用命令行交互模式,同时提供丰富的 Tab 自动补全功能,进一步方便进行问题的定位和诊断。 项目主页:https://alibaba.github.io/arthas/ Github:https://github.com/alibaba/arthas/blob/master/site/src/site/sphinx/index.md 开源协议:GPLv3 开发语言:Java… Read More

使用pushState()改变url而不刷新, ajax与HTML5 history pushState/replaceState实例, 详解history.pushState和history.replaceState以及page ajax的实现

  我们使用location.hash来模拟ajax的前进后退功能。使用location.hash存在下面几个问题: 1.使用location.hash会导致地址栏的url发生变化,用户体验不够友好。 2.location.hash产生的历史记录无法修改,每次hash改变都会导致产生一个新的历史记录。 3.location.hash只是1个字符串,不能存储很多状态相关的信息。 为了解决这些问题,HTML5中引入了history.pushState()、history.replaceState()、popstate事件来处理浏览器历史记录的问题。下面的代码可以达到跟location.hash相同的效果,可以看到地址栏url不会改变。   效果如下:实例DEMO 1   |   实例DEMO 2    |   实例DEMO 3 HTML5 新增的历史记录 API… Read More

JavaScript面向对象详解三:对象与继承

JavaScript的所有数据都可以看成对象,那是不是我们已经在使用面向对象编程了呢? 当然不是。如果我们只使用Number、Array、string以及基本的{...}定义的对象,还无法发挥出面向对象编程的威力。 JavaScript的面向对象编程和大多数其他语言如Java、C#的面向对象编程都不太一样。如果你熟悉Java或C#,很好,你一定明白面向对象的两个基本概念: 类:类是对象的类型模板,例如,定义Student类来表示学生,类本身是一种类型,Student表示学生类型,但不表示任何具体的某个学生; 实例:实例是根据类创建的对象,例如,根据Student类可以创建出xiaoming、xiaohong、xiaojun等多个实例,每个实例表示一个具体的学生,他们全都属于Student类型。 所以,类和实例是大多数面向对象编程语言的基本概念。 不过,在JavaScript中,这个概念需要改一改。JavaScript不区分类和实例的概念,而是通过原型(prototype)来实现面向对象编程。 原型是指当我们想要创建xiaoming这个具体的学生时,我们并没有一个Student类型可用。那怎么办?恰好有这么一个现成的对象: var robot = { name: 'Robot', height: 1.6, run: function… Read More

JavaScript面向对象详解一:原理

概述 JavaScript中的面向对象是基于原型链来实现的,这不同于其他语言复制拷贝的方式。我觉得原型链的好处是节约内存,提高性能,缺点可能就是不那么容易理解。 下面我们就来循序渐进的通过原型链,来理解JavaScript中的面向对象。 面向对象的概念是为了解决什么问题? 如果我们想创建一个具有一定功能的集合,在JavaScript中我们可以这样写: var Animal = { name: 'kitty', sleep: function(){ console.log(this.name + " is sleeping");… Read More

jQuery 插件:创建可折叠行的table, jQuery To Create Collapsible Bootstrap Tables – Bootstrap TreeFy

直接下载:jQuery-Plugin-To-Create-Collapsible-Bootstrap-Tables-Bootstrap-TreeFy 用法: 1. 引入 jQuery library 和 the jQuery Bootstrap TreeFy <link rel="stylesheet" href="dist/css/bootstrap-treefy.css"> <script src="//code.jquery.com/jquery-1.11.3.min.js"></script> <script src="dist/bootstrap-treefy.js"></script>… Read More