jQuery 核心02
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了jQuery 核心02相关的知识，希望对你有一定的参考价值。
jQuery.merge( first,second )
- $.merge合并两个数组，会将second数组添加到frist数组中，second数组保持不变，frist数组输出内容被改变。
- 如果不想改变first数组输出结果，可采用$.merge( [],first )，空数组与first数组合并拥有first的内容，first数组保持原有状态。
不进行$.merge( [],first )操作：
var first = [‘a‘,‘b‘,‘c‘]; var second = [‘d‘,‘e‘,‘f‘]; var newArray =$.merge( first, second); console.log(newArray); // ["a", "b", "c", "d", "e", "f"] var first = [‘a‘,‘b‘,‘c‘]; var second = [‘d‘,‘e‘,‘f‘]; var newArray =$.merge( first, second); console.log(first); // ["a", "b", "c", "d", "e", "f"] var first = [‘a‘,‘b‘,‘c‘]; var second = [‘d‘,‘e‘,‘f‘]; var newArray =$.merge( first, second); console.log(second); // ["d", "e", "f"]
进行$.merge( [],first )操作：
var first = [‘a‘,‘b‘,‘c‘]; var second = [‘d‘,‘e‘,‘f‘]; var newArray =$.merge( $.merge([],first), second); console.log(newArray); // ["a", "b", "c", "d", "e", "f"] var first = [‘a‘,‘b‘,‘c‘]; var second = [‘d‘,‘e‘,‘f‘]; var k =$.merge( $.merge([],first), second); console.log(first); // ["a", "b", "c"] var first = [‘a‘,‘b‘,‘c‘]; var second = [‘d‘,‘e‘,‘f‘]; var k =$.merge( $.merge([],first), second); console.log(second); // ["d", "e", "f"]
相信通过上面的代码已经对 $.merge( first,second ) 和 $.merge( [],first ) 有了直观的认识，剩下的就是实践。
jQuery.noop()
- 此方法不接受任何参数。
- 没有返回值（也可视作返回undefined）。
- 函数的源代码：noop: function() {}
var result = $.map( [1, 2, 3], $.noop ); console.log(result); // [] var arr = $.map([1, 2, 3 , 4], function(a) { return a + a; }); console.log(arr); // [2, 4, 6, 8]
通过上例对 $.noop 理解相信已经了然于胸。
jQuery.now()
- 这个方法不接受任何参数。
- $.now() 方法是表达式 ( new Date ).getTime() 返回值的一个简写。
jQuery.parseHTML( data[,context ][,keepScripts] )
使用原生方法将字符串转换为一个DOM节点的集合，然后插入到文档。
<!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>jQuery.extend demo</title> <script src="https://code.jquery.com/jquery-1.10.2.js"></script> </head> <body> <div id="log"> <h3>Content:</h3> </div> <script> var $log = $("#log"), str = "hello, <b>my name is</b> jQuery.", parse = $.parseHTML(str), nodeNames = []; $log.append(parse); $.each(parse, function(i, el) { nodeNames[i] = "<li>" + el.nodeName + "</li>"; }); $log.append("<h3>Node Names:</h3>"); $("<ol></ol>") .append(nodeNames.join("")) .appendTo($log); </script> </body> </html>
el.nodeName 获取节点名，放入数组，采用join() 方法把数组中所有元素放到字符串，然后插入DOM
jQuery.parseJSON( json )
- 接受一个标准格式的JSON字符串，并返回解析后的javascript值。
- 从jQuery3.0开始，以不推荐使用，推荐 JSON.parse() 方法。
JSON.parse( text[,reviver] ):
JSON.parse(‘{"1": 1, "2": 2,"3": {"4": 4, "5": {"6": 6}}}‘, function (k, v) {
console.log(k); // 输出当前的属性名，从而得知遍历顺序是从内向外的，
// 最后一个属性名会是个空字符串。 1,2,4,6,5,3,空
return v; // 返回原始属性值，相当于没有传递 reviver 参数。 Object {1: 1, 2: 2, 3: Object}
});
jQuery.parseXML()
- 使用原生解析函数浏览器创建一个有效的XML文档。
- 函数的返回值为XMLDocument类型，返回解析后的XML文档对象。
jQuery.proxy()
- $.proxy 方法接受一个已有的函数，并返回一个带特定上下文的新的函数。
- 该方法通常用于向上下文指向不同对象的元素添加事件。
- 如果您绑定从 $.proxy 返回的函数，jQuery 仍然可以通过传递的原先的函数取消绑定正确的函数。
<!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>jQuery.extend demo</title> <script src="https://code.jquery.com/jquery-1.10.2.js"></script> </head> <body> <button>执行 test 函数</button> <p></p> <script> $(document).ready(function(){ var objPerson = { name: "John Doe", age: 32, test: function(){ $("p").after("Name: " + this.name + "<br> Age: " + this.age); } }; $("button").click($.proxy(objPerson,"test")); }); </script> </body> </html>
jQuery.trim()
- 去掉字符串起始和结尾的空格。
- 如果这些空白字符在字符串中间时，它们将被保留，不会被移除。
$.trim(" hello, how are you? "); // "hello, how are you?"
学习一门语言也如王国维所讲的‘人生三境界’。对于 jQuery 的学习需要深入更深入。因为相较于原生JS它是另一种优秀，也许开始接触是因为那几行代码就可以出现的丰富交互效果，后来接触数据同样激动，最后愿所有学习者都可以触类旁通
以上是关于jQuery 核心02的主要内容，如果未能解决你的问题，请参考以下文章