1

我只是想和大家分享一个经验。所以我的问题是，我遇到了将 javascript 后端对象绑定到 HTML 前端元素的问题。现在，我通过谷歌搜索并阅读了一些关于这个问题的 stackoverflow 文章，许多帖子对此的回答是使用jQuery.data()，但是在我的第一次尝试中我没有成功，因为我不知道 jQuery 的对象创建方法。我的问题是，我想在我存储它的范围之外检索存储的数据，并且当我编写 jQuery('selectorID') 时，jQuery 总是（我认为）返回一个新的对象引用。例如：

var ref1 = $('#myID');
var ref2 = $('#myID');

if(ref1 == ref2)
{
   alert(true);
}
else
{
   alert(false);
}

总是会警告假的。然而，用 javascript 的内置getElementById()替换 jQuery 方法，我们将得到相同的引用！因此，以下代码将始终警告为真！

var ref1 = document.getElementById("myID");
var ref2 = document.getElementById("myID");

if(ref1 == ref2)
{
   alert(true);
}
else
{
   alert(false);
}

我的故事的一点小意思是，如果您想将 javascript 对象全局绑定到 HTML 元素并考虑使用 jQuery 的 data() 方法，请将数据存储在 javascript 的内置getElementById()返回的引用上。这样，无论您在何处使用 getElementByID 检索引用，您都将始终获得相同的引用，并且可以使用 jQuery 的 data() 方法从中获取数据。

我的问题：

  1. 我的思维逻辑正常吗？
  2. 有没有更好的方法将 javascript 对象全局绑定到 HTML 元素？
4

4 回答 4

2

无论您提到的代码不起作用的原因是什么，jQuery 为每个查询都提供了一个新集合，这绝对不是事实。给定 HTML：

<div id="somediv"> foo bar </div>

以下Javascript按预期工作：

var $ref1 = $('#somediv');
var $ref2 = $('#somediv');

console.log("$ref1:", $ref1);
console.log("$ref2:", $ref2);

// compare the collections / references
console.log("$ref1 == $ref2:", $ref1 == $ref2); // => false
console.log("$ref1 === $ref2", $ref1 === $ref2); // => false

// compare the referred DOM elements themselves
console.log("$ref1[0] == $ref2[0]:", $ref1[0] == $ref2[0]); // => true
console.log("$ref1[0] === $ref2[0]", $ref1[0] === $ref2[0]); // => true


$ref1.data('somedata', 'SOMEDATA');
console.log('$ref1->somedata:', $ref1.data('somedata')); // => SOMEDATA
console.log('$ref2->somedata:', $ref2.data('somedata')); // => SOMEDATA
于 2013-03-11T00:25:09.437 回答
0

我这样做的方式是这样的。

var ref1 = $('a');
var ref2 = $('div');

var equal = ref1.length === ref2.length;
if (equal) {
    $.each(ref1, function(i) {
        equal = equal && ref1[i] === ref2[i];

        if (!equal) {
            return false;
        }
    });
}

if (equal) {
    alert(true);
} else {
    alert(false);
}
于 2013-03-10T13:00:21.050 回答
0 
ref1[0] === ref2[0] // Should return true

我认为jQuery的实例是独一无二的，所以你可以比较它的匹配项，当你引用一个ID时，它应该只是一个元素。

你可以这样做：

var ref1 = $('#myID')[0];
var ref2 = $('#myID')[0];
于 2013-03-10T13:06:29.197 回答
-1

我深入研究了 jQuery 的源代码，并找到了 jQuery 的构造函数。如下：

// Define a local copy of jQuery
jQuery = function( selector, context ) {
    // The jQuery object is actually just the init constructor 'enhanced'
    return new jQuery.fn.init( selector, context, rootjQuery );
}

每当您使用ref2 = $('#myID')检索相应的 jQuery 元素时，jQuery 都会为您创建一个新对象。所以==会返回 false 给你，因为这两个元素与 js 对象引擎完全不同。

似乎getElementById方法更适合您的需要。但我不知道js引擎如何执行它的getElementById方法。

于 2013-03-10T13:18:44.773 回答