Question

我有一个函数创建一个jQuery元素并返回一个对象，里面有元素本身和一些方法的引用

例如

（我正在输入代码，可能还有一些错字）

var obj = {};
obj.fn = function(){console.log("Hello, World!")};
obj.create = function(){
var temp = $("<div/>", {id:"test"})
return {object:temp, fn:obj.fn}
}

例如，我可以创建一个变量，并为其指定像

这样的obj.create

var test = obj.create()

现在测试是一个对象，使用test.object我有HTML节点和test.fn我可以调用obj.fn，到目前为止一直很好，现在这里是我的问题：

如何将test.object附加到正文（例如$（“body”）。append（test.object））没有指定.object但只是测试并仍然可以调用test.fn（）？

jQuery例如在这里

$("<div/>", {id:"test"})

返回可以附加到任何地方的HTML节点，但仍然可以调用某些方法，如show（）或remove（）。

有什么想法吗？

修改

我做了一些研究，我发现我想要完成的任务可以使用和数组。

基本上，array是对象Array的一个实例，因此您可以将自己的方法添加到新数组中，例如jQuery对象是数组对象的实例，数字索引是对HTML节点的引用，有所有jQuery方法，例如：

>>> var obj = $("#banner-secondary")
undefined
>>> for (item in obj){console.log(item)}
0
length
context
selector
jquery
constructor
init
size
toArray
get
pushStack
each
ready
slice
first
last
eq
map
end
push
sort
splice
extend
data
removeData
queue
dequeue
delay
clearQueue
promise
attr
removeAttr
prop
removeProp
addClass
removeClass
toggleClass
hasClass
val
on
one
off
bind
unbind
delegate
undelegate
trigger
triggerHandler
find
has
not
filter
is
closest
index
add
addBack
andSelf
parent
parents
parentsUntil
next
prev
nextAll
prevAll
nextUntil
prevUntil
siblings
children
contents
text
wrapAll
wrapInner
wrap
unwrap
append
prepend
before
after
remove
empty
clone
html
replaceWith
detach
domManip
appendTo
prependTo
insertBefore
insertAfter
replaceAll
css
show
hide
toggle
serialize
serializeArray
blur
focus
focusin
focusout
load
resize
scroll
unload
click
dblclick
mousedown
mouseup
mousemove
mouseover
mouseout
mouseenter
mouseleave
change
select
submit
keydown
keypress
keyup
error
contextmenu
hover
ajaxStart
ajaxStop
ajaxComplete
ajaxError
ajaxSuccess
ajaxSend
fadeTo
animate
stop
finish
slideDown
slideUp
slideToggle
fadeIn
fadeOut
fadeToggle
offset
position
offsetParent
scrollLeft
scrollTop
innerHeight
height
outerHeight
innerWidth
width
outerWidth
colorbox
flexslider
tinyNav

0是对id banner-secondary的HTML节点的引用。

感谢Kevin B的小提琴，我分叉并测试代码，这是我的： http://jsfiddle.net/wuE4z/

Answer 1

jQuery对象有一个类似于存储元素的数组的集合，与上面的内容差别不大。你有一个create方法，现在你只需要一个appendTo方法（并对create方法做一个小修改，以便元素存储在对象上）。

http://jsfiddle.net/jvXy2/

var obj = {};
obj.fn = function () {
    console.log("Hello, World!")
};
obj.create = function () {
    this.el = document.createElement("div");
    this.el.id = "test";
};
obj.appendTo = function(target) {
    target.appendChild(this.el);
};
obj.create();
obj.appendTo(document.getElementById("demo"));

显然这是大大简化了，jquery在幕后做了很多。 jQuery更进一步，并使用一个构造函数返回jquery对象的实例，以便您可以拥有多个。它还存储对象上的元素，类似于存储在数组中的元素（0个索引键），其长度属性更新以表示存储的元素数。

jQuery如何返回HTML节点？

1 个答案: