jQuery 的工具方法

最新推荐文章于 2022-04-15 23:48:51 发布

时间线原理

最新推荐文章于 2022-04-15 23:48:51 发布

阅读量107

点赞数

分类专栏： jQuery 文章标签： javascript jquery

本文链接：https://blog.csdn.net/weixin_46229298/article/details/109567381

版权

jQuery 专栏收录该内容

9 篇文章 1 订阅

订阅专栏

工具方法

类数组操作

length 属性：jQuery 对象中元素的个数
get() 方法
index() 方法：搜索匹配的元素，并返回相应元素的索引值，从0开始计数。
$.makeArray() 方法

jQuery 中提供 $.makeArray() 方法用于将类数组对象转换为数组对象

$.makeArray(obj);

obj：表示类数组对象

var arr = jQuery.makeArray(document.getElementsByTagName("div"));
arr.reverse();  // 使用数组翻转函数

toArray() 方法：把jQuery集合中所有DOM元素恢复成一个数组。
$.inArray() 方法

jQuery 中提供 $.inArray 方法用于确定第一个参数在数组中的位置，从 0 开始计数（如果没有找到则返回 -1）

$.inArray(value,array[,fromindex]);

value：用于数组在查找是否存在
array：待处理的数组
fromindex：用来搜索数组队列，默认值为 0

var arr = [4,"Pete",8,"John"];
jQuery.inArray("John",arr);     // 3
jQuery.inArray(4,arr);          // 0
jQuery.inArray("David",arr);    // -1
jQuery.inArray("Pete",arr,2) ;  // -1

遍历类数组

jQuery 中提供以下两种方法用于遍历类数组：

$().each() 方法：

$element.each(callback);

callback：对于每个匹配的元素所要执行的函数

用法示例：

$("input").each(function(index,domEle){
    console.log(domEle.value);
});

$.each() 方法：

$.each(obj,callback)

obj：需要遍历的对象或数组
callback：对于每个匹配的元素所要执行的函数

用法示例：

var $divs = $('div');
$divs.each(function(index,domEle){
    console.log(index,domEle);
});
$.each(document.getElementsByTagName('div'),function(index,domEle){
    console.log(index,domEle);
});

上述代码运行效果如下图所示：

全局对象与工厂函数

jQuery 中存在 $().index() 方法和 $.inArray()

body 部分

<body>
    <div></div>
    <div></div>
    <div></div>
</body>

JavaScript 部分

/*
    * $().index()
      * $() - 工厂函数的调用 -> 返回 jQuery 对象
      * index() 方法是 jQuery 对象的方法
    * $.inArray()
      * $ - 也是一个对象 -> jQuery 的全局对象
*/
var index1 = $("div").index("#d1");
var index2 = $.inArray(document.getElementById('d1'),$('div'));

console.log(index1,index2);
// 所有函数都是 Function 类型的对象
function fun(){
    console.log('this is function');

}
fun();  // 函数调用
console.log(fun instanceof Object);  // true

字符串操作

jQuery 中提供 $.trim() 方法用于去掉字符串起始和结尾的空格

$.trim(str);

str：需要处理的字符串

用法示例：

console.log($.trim('   hello,i am zhangsan   '));

上述代码运行效果如下图所示：

时间线原理

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
jQuery 的工具方法

工具方法类数组操作length 属性：jQuery 对象中元素的个数get() 方法index() 方法：搜索匹配的元素，并返回相应元素的索引值，从0开始计数。$.makeArray() 方法jQuery 中提供 $.makeArray() 方法用于将类数组对象转换为数组对象$.makeArray(obj);obj：表示类数组对象var arr = jQuery.makeArray(document.getElementsByTagName("div"));ar
复制链接

扫一扫