jQuery 工具--测试操作

最新推荐文章于 2023-11-16 11:29:54 发布

三知之灵

最新推荐文章于 2023-11-16 11:29:54 发布

阅读量408

点赞数

分类专栏： JQuery

本文链接：https://blog.csdn.net/tjj3027/article/details/79397749

版权

JQuery 专栏收录该内容

39 篇文章 1 订阅

订阅专栏

测试操作

函数列表

函数	说明
$.contains()	用于判断指定元素内是否包含另一个元素。
$.type()	用于确定JavaScript内置对象的类型，并返回小写形式的类型名称。
$.isArray()	测试对象是否为数组。
$.isFunction()	测试对象是否为函数。
$.isEmptyObject()	测试对象是否是空对象（不包含任何属性）。
$.isPlainObject()	测试对象是否是纯粹的对象（通过 “{}” 或者 “new Object” 创建的）。
$.isWindow()	测试对象是否是窗口（有可能是Frame）。
$.isNumeric()	确定它的参数是否是一个数字。
$.isXMLDoc()	用于判断一个DOM节点是否位于XML文档中，或者其本身就是XML文档。

函数说明

$.contains():

该函数可以去除字符串开始和末尾两端的空白字符(直到遇到第一个非空白字符串为止)。它会清除包括换行符、空格、制表符等常见的空白字符。

该函数属于全局的jQuery对象。

语法

jQuery.contains( container, contained)

jQuery 1.4 新增该静态函数。

参数

属性	说明
container	Element类型指定可能包含其他元素的祖辈容器元素。
contained	Element类型指定可能被其他元素包含的后代元素

返回值

jQuery.contains()函数的返回值为Boolean类型，如果指定元素包含另一个元素，则返回true，否则返回false。

示例&说明：

jQuery.contains()仅用于比较两个DOM元素(Element类型，不能是NodeList或其他对象)。它会从contained元素的父元素开始逐级向上查找，判断其是否等于container元素，如果是则返回true，否则返回false。
HTML示例代码：

<div id="n1">
    <p id="n2">
        <span id="n3">CodePlayer</span>
    </p>
</div>
<p id="n4">专注于编程开发技术分享</p>

jQuery示例代码，以演示jQuery.contains()函数的具体用法：

//在当前页面内追加换行标签和指定的HTML内容
function w( html ){
    document.body.innerHTML += "<br>" + html;
}

var n1 = document.getElementById("n1");
var n2 = document.getElementById("n2");
var n3 = document.getElementById("n3");
var n4 = document.getElementById("n4");
var span = document.getElementsByTagName("span");

// n1包含n2
w( $.contains(n1, n2) ); // true

// n1包含n3
w( $.contains(n1, n3) ); // true

// n1不包含n4
w( $.contains(n1, n4) ); // false

// n1虽然包含span元素(n3)，但变量span是NodeList对象，不是Element类型。
w( $.contains(n1, span) ); // false

小知识：
jQuery对象与Dom对象的相互转换：

在jQuery对象中无法使用DOM对象的任何方法。

var domObj = document.getElementById("id"); //DOM对象
var $obj = $("#id"); //jQuery对象;
//jquery对象转换成 dom对象
var cr = $obj [0]; //dom对象 也可写成 var cr=$obj .get(0);
//dom对象转换成jquery对象
var $cr = $(domObj); //转换成jquery对象

$.type():

用于确定JavaScript内置对象的类型，并返回小写形式的类型名称。

JavaScript也自带有一个typeof运算符，可以确定数据的类型。不过，对于绝大多数对象而言，typeof运算符都返回”object”，无法区分具体的类型。jQuery.type()可以更加精确地确定JS内置对象的类型。

例如：对于new Number(5)，typeof返回”object”，jQuery.type()返回”number”；对于new Date()，typeof返回”object”，jQuery.type()返回”date”。

该函数属于全局的jQuery对象。

语法

jQuery.type(obj )

jQuery 1.4.3 新增该静态函数。

参数

属性	说明
obj	任意类型需要确定类型的任意。

返回值

jQuery.type()函数的返回值为String类型，返回指定参数的类型。

示例&说明：

jQuery.type()函数的具体用法：

jQuery.type( undefined ); // "undefined"
jQuery.type( null ); // "null"

jQuery.type( true ); // "boolean"
jQuery.type( new Boolean(true) ); // "boolean"

jQuery.type( 3 ); // "number"
jQuery.type( new Number(3) ); // "number"

jQuery.type( "test" ); // "string"
jQuery.type( new String("test") ); // "string"

jQuery.type( function(){} ); // "function"
jQuery.type( new Function() ); // "function"

jQuery.type( [] ); // "array"
jQuery.type( new Array() ); // "array"

jQuery.type( new Date() ); // "date"

jQuery.type( new Error() ); // "error" // jQuery 1.9 新增支持

jQuery.type( /test/ ); // "regexp"
jQuery.type( new RegExp("\\d+") ); // "regexp"

/* 除上述类型的对象外，其他对象一律返回"object" */

jQuery.type( {} ); // "object"
function User() { }
jQuery.type( new User() ); // "object"

小知识：
js中有六种数据类型，包括五种基本数据类型（Number,String,Boolean,Undefined,Null）,和一种复杂数据类型（Object）。

$.isArray():

用于判断指定参数是否是一个数组。

该函数属于全局jQuery对象。

语法

jQuery.isArray(object )

jQuery 1.3 新增该静态函数,jQuery 3.2中已废弃

参数

属性	说明
object	任意类型需要进行判断的任意值。

返回值

jQuery.isArray()函数的返回值为Boolean类型，如果指定的参数是数组，则返回true，否则返回false。

示例&说明：

jQuery.isArray()函数的具体用法：

//在当前页面内追加换行标签和指定的HTML内容
function w( html ){
    document.body.innerHTML += "<br/>" + html;
}

w( $.isArray( [ 10, 25, 3 ] ) ); // true
w( $.isArray( new Array() ) ); // true

w( $.isArray( null ) ); // false
w( $.isArray( true ) ); // false
w( $.isArray( { } ) ); // false

var obj = { };
obj[0] = 10;
obj[1] = 25;
obj[2] = 3;
obj.length = 3;
// obj是一个类数组对象，但它仍然不是一个真正的数组
w( $.isArray( obj ) ); // false

$.isFunction():

用于判断指定参数是否是一个函数。
该函数属于全局的jQuery对象。

语法

jQuery.isFunction(obj )

jQuery 1.2 新增该静态函数。

参数

属性	说明
object	任意类型需要确定类型的任意。

注意：
jQuery 1.3以后，在IE浏览器里，浏览器提供的函数比如’alert’还有 DOM 元素的方法比如 ‘getAttribute’ 将不认为是函数

返回值

jQuery.isFunction()函数的返回值为Boolean类型，如果指定的参数是JS函数对象，则返回true，否则返回false。

示例&说明：

jQuery.isFunction()函数的具体用法：

//在当前页面内追加换行标签和指定的HTML内容
function w( html ){
    document.body.innerHTML += "<br/>" + html;
}

function foo(){
    alert("CodePlayer");    
}
w( $.isFunction( foo ) ); // true
w( $.isFunction( function(){ } ) ); // true
w( $.isFunction( new Function("x", "y", "return x + y;") ) ); // true


w( $.isFunction( null ) ); // false
w( $.isFunction( true ) ); // false
w( $.isFunction( { } ) ); // false
w( $.isFunction( [ ] ) ); // false

$.isEmptyObject():

用于判断指定参数是否是一个空对象。

所谓”空对象”，即不包括任何可枚举(自定义)的属性。简而言之，就是该对象没有属性可以通过for…in迭代。

该函数属于全局jQuery对象。

语法

jQuery.isEmptyObject(object )

jQuery 1.4 新增该静态函数。

jQuery 1.4 中，这个方法既检测对象本身的属性，也检测从原型继承的属性（因此没有使用hasOwnProperty）。

参数

属性	说明
object	任意类型需要进行判断的任意值。

注意：该参数应该始终是一个纯粹的JavaScript Object，因为其他类型(例如：DOM元素、原始字符串/数字、宿主对象)可能无法获得跨浏览器的一致结果。要确定一个对象是否是一个纯粹的JavaScript Object，你可以使用$.isPlainObject()方法。

返回值

jQuery.isEmptyObject()函数的返回值为Boolean类型，如果指定的参数是空对象，则返回true，否则返回false。

示例&说明：

jQuery.isEmptyObject()是通过for…in循环来进行判断，其源代码部分如下：

isEmptyObject: function( obj ) {
    var name;
    for ( name in obj ) {
        return false;
    }
    return true;
}

jQuery.isEmptyObject()函数的具体用法：

//在当前页面内追加换行标签和指定的HTML内容
function w( html ){
    $(document.body).append("<br/>" + html);
}



w( $.isEmptyObject( { } ) ); // true
w( $.isEmptyObject( new Object() ) ); // true
w( $.isEmptyObject( [ 0 ] ) ); // false
w( $.isEmptyObject( { name: "CodePlayer"} ) ); // false
w( $.isEmptyObject( { sayHi: function(){} } ) ); // false
function User(){

}
User.prototype.word = "Hello";
// 自定义的原型对象上的属性也是可枚举的
w( $.isEmptyObject( new User() ) ); // false


/* 尽管在没有为空数组、Function、Number等内置对象添加自定义属性的情况下，它们也是不可枚举的，但是不推荐这么做。因为isEmptyObject()的参数应该始终是一个纯粹的Object */

// 数组中没有元素，也无法通过for...in迭代出属性
w( $.isEmptyObject( [ ] ) ); // true
// Function、Number、String等内置对象也无法通过for...in迭代出属性
w( $.isEmptyObject( function(){ alert("xxx") } ) ); // true

$.isPlainObject():

用于判断指定参数是否是一个纯粹的对象。

所谓”纯粹的对象”，就是该对象是通过”{}”或”new Object”创建的。

该函数属于全局jQuery对象。

语法

jQuery.isPlainObject(object )

jQuery 1.4 新增该静态函数。

参数

属性	说明
object	任意类型需要进行判断的任意值。

注意：宿主对象(或其它被浏览器宿主环境使用的对象，以完成ECMAScript的执行环境)难以进行跨平台的特性检测。因此，对于这些对象的实例，$.isPlainObject()在不同的浏览器上可能得出不同的结果。

返回值

jQuery.isPlainObject()函数的返回值为Boolean类型，如果指定的参数是纯粹的对象，则返回true，否则返回false。

示例&说明：

jQuery.isPlainObject()函数的具体用法：

//在当前页面内追加换行标签和指定的HTML内容
function w( html ){
    document.body.innerHTML += "<br/>" + html;
}



w( $.isPlainObject( { } ) ); // true
w( $.isPlainObject( new Object() ) ); // true
w( $.isPlainObject( { name: "CodePlayer"} ) ); // true
w( $.isPlainObject( { sayHi: function(){} } ) ); // true


w( $.isPlainObject( "CodePlayer" ) ); // false
w( $.isPlainObject( true ) ); // false
w( $.isPlainObject( 12 ) ); // false
w( $.isPlainObject( [ ] ) ); // false
w( $.isPlainObject( function(){ } ) ); // false
w( $.isPlainObject( document.location ) ); // false(在IE中返回true)

function Person(){
    this.name = "张三";
}
w( $.isPlainObject( new Person() ) ); // false

$.isWindow():

判断指定参数是否是一个窗口。

“窗口”就是浏览器内置的Window对象。

该函数属于全局jQuery对象。

语法

jQuery.isWindow(object )

jQuery 1.4.3 新增该静态函数。

参数

属性	说明
object	任意类型需要进行判断的任意值。

注意：该函数是通过Window对象的特性进行判断的，这个特性也可以通过普通对象伪造。但极少遇到这种故意伪造的情况，因此该函数仍然是可用的。

返回值

jQuery.isWindow()函数的返回值为Boolean类型，如果指定的参数是一个窗口，则返回true，否则返回false。

示例&说明：

根据 ECMAScript 标准要求，所有的 JavaScript 解释器都要将Window对象视作全局对象(global)，并且global.window = global(其window属性引用自身)。根据该标准，jQuery使用如下代码来判断指定对象是否是一个Window对象。

isWindow: function( obj ) { 
    return obj != null && obj == obj.window;
}

jQuery.isWindow()函数的具体用法：

//在当前页面内追加换行标签和指定的HTML内容
function w( html ){
    document.body.innerHTML += "<br/>" + html;
}



w( $.isWindow( window ) ); // true


w( $.isWindow( null ) ); // false
w( $.isWindow( true ) ); // false
w( $.isWindow( { } ) ); // false
w( $.isWindow( [ ] ) ); // false

$.isNumeric():

用于判断指定参数是否是一个数字值。

该函数属于全局的jQuery对象。

语法

jQuery.isNumeric(value )

jQuery 1.7 新增该静态函数。

参数

属性	说明
value	任意类型需要进行判断的任意值

返回值

jQuery.isNumeric()函数的返回值为Boolean类型，如果指定的参数是一个数字值，则返回true，否则返回false。

字符串形式的数字也符合条件。

示例&说明：

jQuery.isNumeric()函数的具体用法：

//在当前页面内追加换行标签和指定的HTML内容
function w( html ){
    document.body.innerHTML += "<br/>" + html;
}



w( $.isNumeric( 12 ) ); // true
w( $.isNumeric( 12.35 ) ); // true
w( $.isNumeric( "12" ) ); // true
w( $.isNumeric( "12.34" ) ); // true
// 十六进制
w( $.isNumeric( "0x123" ) ); // true
w( $.isNumeric( new Number( 12 ) ) ); // true

w( $.isNumeric( null ) ); // false
w( $.isNumeric( true ) ); // false
w( $.isNumeric( "CodePlayer" ) ); // false
w( $.isNumeric( { } ) ); // false
w( $.isNumeric( [ 0 ] ) ); // false
w( $.isNumeric( NaN ) ); // false

$.isXMLDoc():

用于判断一个DOM节点是否位于XML文档中，或者其本身就是XML文档。

该函数主要用于判断指定文档是一个XML文档还是一个HTML(或XHTML)文档。

该函数属于全局jQuery对象。

语法

jQuery.isXMLDoc(node )

jQuery 1.1.4 新增该静态函数。

参数

属性	说明
node	Element类型需要进行判断的DOM节点。

返回值

jQuery.isXMLDoc()函数的返回值为Boolean类型，如果指定的DOM节点位于XML文档中(或者是一个XML文档)，则返回true，否则返回false。

示例&说明：

jQuery.isXMLDoc()函数的具体用法：

//在当前页面内追加换行标签和指定的HTML内容
function w( html ){
    document.body.innerHTML += "<br/>" + html;
}



w( $.isXMLDoc( document ) ); // false
w( $.isXMLDoc( document.body ) ); // false
w( $.isXMLDoc( document.getElementById("btn") ) ); // false


var xmlStr = '<?xml version="1.0" encoding="UTF-8"?>';
xmlStr += '<user>';
xmlStr += '<username>CodePlayer</username>';
xmlStr += '</user>';


var xmlDoc = $.parseXML( xmlStr );
w( $.isXMLDoc( xmlDoc ) ); // true