JAVASCRIPT - 技术教程文章
扩展你的javascript数组
如今做的项目用的正是jquery的框架,Jquery miniui,其功能强大、性能卓越、易于上手、不失灵活,在不断学习和研发的过程中,miniui给了非常多的启示,让我又一次认识了js的本质,意识到了js的强大功能。使用javascript的时候难免会用到数组操作,进来js的功能越来越强大,使用范围越来越广,非常多编程语言的各种数据结构,本质上都是一样的,都是把基本数据类型做封装,形成功能各异,各有特色的对象、数组、集合等等。接下来我们重点讨...
javascript --学习this【代码】【图】
this在一般的强类型语言中,this指向的是这个对象本身,可在javascript中this的取值是执行上下文环境的一部分 其实这个this并不是很难立即,只要记住二点就可以了那就是谁caller(调用者是谁this指向的就是谁),如果有赋值语句就改变类型 我们来看几个例子就知道了function Fd(){this.name="test";console.log(this); }; var f1=new Fd();//Fd {name: "test"} Fd();//window 在这里第一次是通过new出来的所以调用者是f1,而第二...
高性能Javascript
javasciprt性能优化本文主要是在我读《高性能Javascript》之后,想要记录下一些有用的优化方案,并且就我本身的一些经验,来大家一起分享下,Javascript的加载与执行 大家都知道,浏览器在解析DOM树的时候,当解析到script标签的时候,会阻塞其他的所有任务,直到该js文件下载、解析执行完成后,才会继续往下执行。因此,这个时候浏览器就会被阻塞在这里,如果将script标签放在head里的话,那么在该js文件加载执行前...
JavaScript权威指南--词法结构
使用广泛,所有的浏览器(桌面、手机、屏蔽等等)都配有相应的JavaScript解析器。三技能:JavaScript、HTML、CSS。JavaScript早已超出了其“脚本语言”本身的范畴,而成为一种集健壮性/高效性和通用性为一身的编程语言。 编程语言的词法结构是一套基础性规则,用来描述如何使用这门语言来编写程序。作为语法的基础,它规定了诸如变量名是什么样的、怎么写注释,以及程序语句之间如何分割的等规则。1.字符集JavaScript程序是用Unico...
什么是JavaScript变量提升,面试经常问【代码】
JavaScript变量提升 提升(Hoisting)JavaScript将声明移动到顶部的默认行为。JavaScript声明提升,在JavaScript中,变量可以在使用后声明。换一种说法; 变量可以在声明之前使用。示例1给出与示例2相同的结果:例子1:<!DOCTYPE html> <html> <meta charset="utf-8"> <title>js</title> <body><p ></p><script>x = 5; // 给x赋值5elem = document.getElementById("demo"); // 查找一个元素elem.innerHTML = x; // 在元素...
JavaScript实现表单注册与验证【代码】【图】
HTML文件<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>表单注册与验证</title> <script language="javascript" type="text/javascript" src="JS/index.js"></script> </head> <body> <form name="form1" id="form1" method="post"action=""> <table border=1 align=center width=350> <tr align="middle"> <th colSpan="2"height="24">新用户注册</th> </tr> <tr> <td with="40%"> <b>用 户 名...
JavaScript下的setTimeout(fn,0)意味着什么?【代码】【图】
原文:JavaScript下的setTimeout(fn,0)意味着什么? 近期在研究异步编程的我对于setTimeout之类的东西异常敏感。在SegmentFault上看到了一个问题《关于SetTimeout时间设为0时》:提问者读了一篇文章,原文解释setTimeout延迟时间为0时会发生的事情,提问者提出了几个文章中的几个疑点。读了那篇文章之后发现原文的作者对于setTimeout的理解和自己的认知有点出入,于是编写了相关测试的代码以求答案。最终编写了这篇文章。 本文内容如...
js获得焦点和失去焦点那些事【代码】
<!doctype html> <html> <head> <meta charset="utf-8"> <meta name="author" content="智能社 - zhinengshe.com"> <meta name="copyright" content="智能社 - zhinengshe.com"> <title>智能社 - www.zhinengshe.com</title> <style> * { margin:0; padding:0; } .box {position:relative; width:200px; margin:50px auto;} .box span { position:absolute; top:0; left:5px; height:40px; line-height:40px; color:#999; } #inp1,...
谈谈Ext JS组件之引子
Ext JS组件,对于Ext JS开发人员来说,应当不会陌生,毕竟做开发,都必须与它打交道。对于这样一个大家都熟悉的东西,为什么要用一个专题的形式来写呢?是否有这方面的需要?还不如去写点使用技巧?确实,组件是可能是大家相当熟悉的东西了,但是,在使用中,大家是否在使用组件过程中或多或少都碰到一些臭虫或其他问题,从而花费不少力气去解决这 些问题呢?是什么原因造成这些问题,又该遵循什么思路去解决这些问题呢?本系列的文...
JavaScript清空数组的三种方法
[文章系摘自网络,看到有用记录在博客,同时共享给大家]原链接:http://www.2cto.com/kf/201409/335383.html方式1,splice var ary = [1,2,3,4]; ary.splice(0,ary.length); console.log(ary); // 输出 Array[0],空数组,即被清空了 方式2,length赋值为0这种方式很有意思,其它语言如Java,其数组的length是只读的,不能被赋值。如1int[] ary = {1,2,3,4}; ary.length = 0;Java中会报错,编译通不过。而JS中则可以,且将数组清空...
一行神奇的javascript代码【代码】【图】
一行神奇的JS代码,是在一个博客园里面看到的,当时我就震惊了,这不就是传说中的ZB神奇么… … 哈哈(果断转载过来)。写本篇文章的缘由是之前群里@墨尘发了一段js代码,如下:(!(~+[])+{})[--[~+""][+[]]*[~+[]] + ~~!+[]]+({}+[])[[~!+[]]*~+[]]然后让大家运行,出来的结果让人有点出乎意料,请看:&lt;img class="alignnone" src="/upload/getfiles/default/2022/11/8/20221108042120136.jpg" /&gt;&lt;img class...
给js设定一个统一的入口【代码】
javascript是种脚本语言,浏览器下载到哪儿就会运行到哪儿,这样的特性会为编程提供方便,但也easy使程序过于凌乱。支离破碎。js从功能上能够分为两大部分——框架部分和应用部分,框架部分提供的是对js代码的组织作用。包含定义全局变量、命名空间方法等,每一个页面都会有同样或相似的框架。应用部分提供的是页面功能逻辑。不同页面会有不同的功能,不同页面应用部分的代码也不尽同样。给应用部分的js代码一个统一的入口。即:<s...
JavaScript(JS) Math.tan( x )
Math对象为数学常量和函数提供属性和方法。与其他全局对象不同,Math不是构造函数。Math的所有属性和方法都是静态的,可以通过将Math作为对象来调用,而无需创建它。本文主要介绍JavaScript(JS) Math.tan( x ) 方法。原文地址:JavaScript(JS) Math.tan( x ) 原文:https://www.cnblogs.com/levizhong/p/15310883.html
CSS+js打造的网页版俄罗斯方块游戏【代码】
<HTML><SCRIPT>parent.moveTo((screen.width-775)/2,(screen.height-540)/2);parent.resizeTo(775,540)</SCRIPT><HEAD><META NAME="Title" CONTENT="JScript Simple Tetris"><TITLE>CSS+js打造的网页版俄罗斯方块游戏丨石家庄展柜-石家庄网络公司</TITLE><style>body {margin:0;background:black;font-size:9pt}td {height:20;width:20;font-size:9pt}#block_div {position:absolute;z-index:1;width:80;font-size:9pt}#table_div ...
JavaScript实现轮播图【代码】【图】
1<!DOCTYPE html> 2<html> 3<head> 4<meta charset="utf-8"> 5<title>carousel</title> 6<style type="text/css"> 7 *{margin: 0;padding: 0;text-decoration: none;} 8 body{padding: 20px;} 9 #container{width: 384px;height: 216px;border: 3px solid #333;overflow: hidden;position: relative;} 10 #list{width: 2688px;height: 216px;position: absolute;z-index: 1;} 11 #list img{float...
js 设计模式之策略模式【代码】
// 策略模式var validataRules = {‘minLeng‘ :function(val, length, msg) {if (val && val.length > 6) {return msg}},‘isMobile‘: function(val, msg){if (!/(^1[3|5|8][0-9]{9}$)/.test(val)){return msg}},‘isCardId‘: function(val, msg){if (!/(^[1-9][1-9]{17}$)/.test(val)){return msg}},isNonEmpty: function (val, msg) {if (val === ‘‘) {return msg;}}}var validata = function () {this.item = []}validata....
JS笔记
第一章: 编写JS流程: 1、 布局:HTML和CSS 2、 样式:修改页面元素样式,div的display样式 3、 事件:确定用户做什么操作,onclick(鼠标点击事件)、onmouseover(鼠标悬停)、onmouseout(鼠标移出) 4、 编写JS:在事件中,用JS来修改页面元素样式 5、 原理:响应用户的操作,对页面元素进行样式修改第二章: Javascript基础: JS代码的引入: ...
JavaScript备忘录-原型【代码】【图】
function Person() { this.name = "fs";}Person.prototype.sayHello = function () { return "hello,fs"; }; var p1 = new Person(); p1.sayHello(); p1.sayHello()首先通过p1._proto_向上查找Person.prototype,如图所示:在Person的prototype中找到了sayHello();如果,美玉偶找到将会继续通过Person.prototype._proto_去Object中查找。没有就抛去异常。原文:http://www.cnblogs.com/fengchengjushi/p/4439620.html
javascript 引用类型
1 Object 类型var person = new Object() ; person.name = "summer"; 和 var person = {name:‘summer‘};是等价的。2 Array 类型(1)var colors = new Array(); 和 var colors = Array();和var colors = []; 是等价的。(2)数组中的length 属性不仅是只读的,即通过设置这个属性,可以从数组的末尾移除项或添加新项。实例1:var colors = [‘red‘ , ‘blue‘ , ‘green‘];colors.length = 2;alert(colors[2]); //undefined实...
什么是js面向对象??
简单的来说就是键值对,写一个函数,然后传值进去, function Person(name,age){ this.name = name; this.age = age; } var p1 = new Person(‘Jack‘,20); console.log(p1.__proto__);原文:http://www.cnblogs.com/ZH1132672711/p/4098339.html
转载: javascript 闭包
转载自阮一峰 : http://www.ruanyifeng.com/blog/2009/08/learning_javascript_closures.html 学习Javascript闭包(Closure)作者: <a url"="" href="http://www.ruanyifeng.com/" style="font-size: 1.6em; line-height: 28.7999992370605px; font-family: Georgia, serif; letter-spacing: -0.100000001490116px; margin: 0px; padding: 0px; list-style-type: none; text-decoration: none; border: none; color: #556677;">...
JavaScript概述
前言1.什么是javascript? 在浏览器端执行一种编程语言。javascript和java没有任何关系 ,只是语法和java相同。也有一些差异。 2.javascript作用? a.前端验证 b.操作html c.ajax核心技术之一 d.获取浏览器的一些相关信息3.什么是ajax?在浏览器中运行的js脚本,通过http请求异步地访问服务器组件,服务器组件返回xml文件或者json格式的数据,js接收后通过解析xml或json来局部刷新页面,提高用户体验。正文JavaScri...
JavaScript编写类【代码】
1、构造函数方式 用构造函数模拟"类",在其内部用this关键字指代实例对象。基本语法:function 类名(){ this.属性名;//公共属性 var 属性名;//私有属性 /*凡是定义类的公共属性和公共方法都要使用this*/ //定义类的公共函数 this.函数名=function(){ ..... } //定义类的私有函数 function 函数名(){ ...... }}例子: /*定义一个Person类*/ function Person(_name, _age, _s...
javascript 基础【代码】【图】
http://www.5idev.com/p-javascript_events_onclick.shtml--------------------------------------------------------------------function thisTest(){this.userName= ‘outer userName‘;function innerThisTest(){var userName="inner userName";alert(userName); //inner userNamealert(this.userName); //outer userName}return innerThisTest;}thisTest()(); 直接这样调用 thiTest()的话, 里面的两个 this 都是 window 对...
[JavaScript]jquery中各事件执行顺序
1.ajaxStart(全局事件)2.beforeSend3.ajaxSend(全局事件)4.success5.ajaxSuccess(全局事件)6.error7.ajaxError (全局事件)8.complete9.ajaxComplete(全局事件)10.ajaxStop(全局事件)原文:http://www.cnblogs.com/shocker/p/5659634.html
Javascript_常见问题(1)【代码】【图】
1)发生该情况是因为百度地图本身的js冲突引起的,当删除引入地图的js时发现可以选取,火狐浏览器任何时候都不存在问题,谷歌内核的浏览器出现该问题,解决方法:引入的是百度地图v1.0的出现该问题,将版本改为2.0的话,可以正常选取,所有如果想文字可以选取的话直接用百度地图2.0,可以用百度1.0的生成,然后引入js的时候直接把1.0改为2.0即可解决问题,2.0的话需要加上key。2)页面信息滚动:<marquee direction=up height=146 ...
JavaScript的六大数据类型
js中有六种数据类型,包括五种基本数据类型(Number,String,Boolean,Undefined,Null),和一种复杂数据类型(Object)。typeof 操作符由于js中的变量是松散类型的,所以它提供了一种检测当前变量的数据类型的方法,也就是typeof关键字.typeof 123 //Numbertypeof ‘abc‘ //Stringtypeof true //Booleantypeof undefined //Undefinedtypeof null //Objecttypeof { } //Objecttypeo...
JavaScript拖拽【代码】
<!DOCTYPE html><html><head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title>JS拖拽</title> <style> *{padding: 0; margin: 0; } .box{width: 100px;height: 100px;background: blue;position: absolute; } </style> <script src="jquery.min.js"></script> <script> var isDown = false; var ObjLeft, ObjTop, posX, posY, obj,offse...
javaScript使用正则表达式-1【代码】
javaScript中使用正则表达式(脚本形式)修饰符修饰符描述i执行对大小写不敏感的匹配。(大小写都匹配)g执行全局匹配(查找所有匹配而非在找到第一个匹配后停止)。m执行多行匹配。相关方法 test() 用于检测一个字符串是否匹配某个模式,如果字符串中含有匹配的文本,则返回 true,否则返回 false。exec()用于检索字符串中的正则表达式的匹配。简单匹配var str = 'www.baidu.com'; var reg = /baidu/; print(reg.test(str));//true va...
javascript中的function命名空間與模擬getter、setter【代码】
function的命名空間在javascript中,function也可以擁有自己的命名空間例如以下這段程式碼:12345678function () {return'I am A';}A.hello = 'hello!';console.log(A());console.log(A.hello);我們可以在console得到以下內容:12I am Ahello!可以發現即使A被宣告成一個function,它依然可以像object一樣被assign其中的其他attribute,而直接呼叫A本身也還是它原來function的功能getter、setter在javascript中,this會是呼叫它的對...