JS、JQuery的一些操作小记

jq:

1.、链式操作
$(‘div‘).find(‘h3‘).eq(2).html(‘hello‘); // .eq(2) 选择第3个h3元素

2、.end()方法使结果集后退一步;

3、html()没有参数,表示取出h1的值;html()有参数,表示赋值。取值是获取一组的
第一个元素,赋值是所有元素。

4、元素移形换位
insertAfter()、appendTo()、after()将x加到y后、append()

5.创建元素
var oLi = $(‘<li>‘); oLi.html(‘hello‘); $(‘ul‘).append(oLi);

6.工具方法
$.each() jquery遍历
$(‘li‘).each(function(index,elements){}) //第一个参数索引,第二个参数所有获取的元素
$.trim() 去掉空格

7.事件操作
.bind() .one() .unbind() pageX

8.运动特效
fadeIn() fadeOut() slideDown(秒数) 向下展开
.animater() stop()

◆JS
1、如果一个表达式在代码中多次出现,可以使用with语句来简化代码
例如: with(document.forms[0]){
name.value = "";
address.value = "";
email.value = "";
}
2、debugger在调试程序运行时,用来产生一个断点。

3、JS解析器原理
alert(a); //未定义
var a = 1;
function fn1(){alert(2);}
浏览器 - JS解析器执行步骤:
① “找一些东西”: var function 参数
a = 未定义 -- 所有的变量,在正式运行代码之前,都提前赋值:未定义;
fn1 = function fn1(){alert(2);}
-- 所有的函数,在正式运行代码之前,都是整个函数块;

*JS的预解析
◆遇到重名的:只留一个
◆变量和函数重名了,就只留下函数

② 逐行解读代码:
表达式: = +-*参数......
◆表达式可以修改预解析的值

例一:
alert(a); // function a(){alert(4);}
var a=1;
alert(a); // 1
function a(){alert(2);}
alert(a); // 1
var a=3;
alert(a); // 3
function a(){alert(4);}
alert(a); // 3

a(); // 出错
例二:
var a = 1;
function fn1(){
alert(a); //undefined 局部范围内找
var a = 2;
}
fn1();
alert(a); //1

③ 当存在多个<script>标签,一个执行完后,再执行另一个(自上而下)。

4、清空数组
arr.length = 0;
arr = [];

5、数组方法
push(): 向后添加元素
unshift(): 向前添加元素
pop(): 删除最后一个元素
shift(): 删除第一个元素

依次换位后移: arr.unshift(arr.pop());
依次换位前移: arr.push(arr.shift());

//删除、替换、添加
splice()
arr.splice(0,2); 删除
arr.splice(0,2,‘XX‘) 替换
arr.splice(1,0,‘‘,‘‘) 添加

6、sort排序
var arr = [4,5,8,89,3,2,0];
arr.sort(function(a,b){
return a - b; //从小到大,b-a: 从大到小
})
例: var arrWidth = [‘345px‘,‘23px‘,‘10px‘,‘1000px‘];
arrWidth.sort(function (a,b){
return parseInt(a) - parseInt(b);
});

◇随机排序
var arr = [1,2,3,4,5,6,7,8];
arr.sort(function(a,b){
return Math.random()-0.5; //值有正有负
})
//Math.random() 0~1
//0~1: Math.round(Math.random());
//0~10: Math.round(Math.random()*10);
//5~10: Math.round(Math.random()*5+5);
//20~100: Math.round(Math.random()*80+20);
//x~y: Math.round(Math.random()*(y-x)+x);
//0~x: Math.round(Math.random()*x);
//1~x: Math.ceil(Math.random()*x);

7.concat、reverse
concat: 将多个数组连在一起;
例:var arr1=[1,2,3];var arr2=[4,5,6];
arr1.concat(arr2);
reverse: 颠倒数组元素位置;
arr1.reverse();
例:var str = ‘abcdef‘; //遇到字符串,先转换
str.split(‘‘).reverse().join(‘‘);

8. JS中允许","替换成"[]"
oDiv.style.width = oVal.value; //.后面的值无法修改
oDiv.style[‘oAttr.value‘] = oVal.value;
9. cssText用来添加css样式
oDiv.style.cssText = "width:200px;height:200px;";
10. typeof判断数据类型
11. JS的隐式类型转换:
+ 200+‘3‘ 变成字符串
-*/% ‘200‘- 3 变成数字
++ -- 变成数字
>< 数字的比较、字符串的比较(比较编码,按首位判断)
!取反 把数据类型转成布尔值
== ‘2‘==2
12. NaN: 不是个数字的数字类型。
一旦程序中出现:NaN 肯定进行了非法的运算操作
NaN与自身也不相等
13.window.history.go(-1);//返回上一页不刷新
window.location.href = document.referrer;//返回上一页并刷新

14.delete:删除对象属性或者数组元素
var o = {x:1,y:2};
delete o.x;
"x" in o

时间: 2024-11-06 03:47:24

JS、JQuery的一些操作小记的相关文章

js,jQuery数组常用操作小结

一.js中数组常用操作小结 (1) shift:删除原数组第一项,并返回删除元素的值:如果数组为空则返回undefined var a = [1,2,3,4,5]; var b = a.shift(); 结果 a:[2,3,4,5] b:1 (2) unshift:将参数添加到原数组开头,并返回数组的长度 var a = [1,2,3,4,5]; var b = a.unshift(-2,-1); 结果 a:[-2,-1,1,2,3,4,5] b:7 注:在IE6.0下测试返回值总为undefi

js day43 Jquery入门(回顾js,Jquery选择器,dom操作)

1     Javascript回顾 问题:Javascript能做什么? 1. 获取操作dom <style> .aa{ background:red} .bb{ background:blue} </style> <body> <div id="dv" title="提示信息" class="aa">AAAAAAAAA</div> <button onclick="f

js,jQuery和DOM操作的总结(二)

jQuery的基本操作 (1)遍历键值对和数组 var arr = [9, 8, 7, 6, 5, 4]; $.map(arr, function (ele, index) { alert(ele + '===' + index); //第一个参数是数组里面的值,第二个参数是索引 }) //=========================================// var keyWord = { "name": "老牛", "age"

js原生的url操作函数,及使用方法。(附:下边还有jquery对url里的中文解码函数)

js原生的url操作函数,完善的. /*****************************/ /* 动态修改url */ /*****************************/ var LG=(function(lg){ var objURL=function(url){ this.ourl=url||window.location.href; this.href="";//?前面部分 this.params={};//url参数对象 this.jing="&q

Selenium2学习-014-WebUI自动化实战实例-012-Selenium 操作下拉列表实例-div+{js|jquery}

之前已经讲过了 Selenium 操作 Select 实现的下拉列表:Selenium2学习-010-WebUI自动化实战实例-008-Selenium 操作下拉列表实例-Select,但是在实际的日常网页开发中,实现下拉列表的方法.样式.特效有 N 多种,但是无论实现的方法有多少不同,其都会遵循一定的规律,在此我就不再赘述了(有兴趣的小主,可以找有经验的前段请教一下).同时,此类实现的下拉列表在使用 Selenium 进行定位时,往往不尽如人意,定位比较繁琐. 此文仅以 淘宝网账户注册时选择手

【JAVAWEB学习笔记】28_jqueryAjax:json数据结构、jquery的ajax操作和表单校验插件

Ajax-jqueryAjax 今天内容: 1.json数据结构(重点) 2.jquery的ajax操作(重点) 3.jquery的插件使用   一.json数据结构 1.什么是json JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式.它基于ECMAScript的一个子集. JSON采用完全独立于语言的文本格式,但是也使用了类似于C语言家族的习惯.这些特性使JSON成 为理想的数据交换语言.易于人阅读和编写,同时也易于机器解析和生成(一般用于提升网络

Jquery轻量级插件--操作URL

调用: > "?action=view&section=info&id=123&debug&testy[]=true&testy[]=false&testy[]"var test= $.query.get('section'); "info" jquery.query.js new function(settings) {   // Various Settings  var $separator = setti

js+jquery动态设置/增加/删除/获取元素属性的两种方法集锦对比(动态onclick属性设置+动态title设置)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN" "http://www.w3.org/TR/REC-html140/strict.dtd"> <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"/> <title>

5-15 bootcss 之 modal 以及 jquery ui 之datepicker 小记

最近公司在用bootstrap和Jquery UI做项目,类似与OA的东西前两天碰到点问题,记录一下.希望读者不要在遇到和我一样的问题. 1 datepicker.不知道怎么自己下载的bootcss里面没找到datepicker,于是就选了Jquery UI的datepicker.使用的时候要注意两个问题. 如果页面上多个input ,并且id都是input1,那么在页面载入完成的时候调用$('#input1').datepicker(option),得到的结果是只有第一个成功格式化成datep