创建具有名为偏移量的属性的定位点

Creating an anchor with attribute called offset

本文关键字：属性 定位 偏移量 创建      更新时间：2023-09-26

使用以下代码动态创建锚点时，我遇到了非常奇怪的行为：

var newAnchor = $('<a>', {
                    'href': '#',
                    'class': 'seeMoreFromSection load-multi',
                    'offset':'12',
                    'type': '15',
                    'sec': '4'
                }).html('See more');
$('a.seeMoreFromSection').replaceWith(newAnchor);

问题出在名为 offset 的属性中，它会导致以下错误：Cannot use 'in' operator to search for 'using' in 12 。当我删除该行'offset':'12'一切正常时。我通过在创建锚点后添加此属性来使其工作：

$('a.seeMoreFromSection').attr('offset', '12');

但我仍然不明白问题出在哪里，是某种保留词还是什么？

更新：浏览器谷歌浏览器33.0.1750.154米

从文档中可以看出，您可以使用有效的HTML属性，有效的事件类型和一些jQuery方法（offset()就是其中之一）：

如果传递第二个参数，则第一个参数中的 HTML 字符串 参数必须表示没有属性的简单元素。截至 jQuery 1.4，任何事件类型都可以传入，下面jQuery 可以调用方法：val、css、html、text、data、width、height或 offset .

offset，type和sec无论如何都不是有效的HTML属性，所以你不能指望你的工具接受它们。您可以使用data-属性来使特殊属性有效，也可以使用 jQuery 的data()方法，除非您特别需要将数据存储在 HTML 属性中（大多数情况下并非如此）。

offset恰好也是jQuery方法的名称。通过尝试添加该属性，您告诉 jQuery 设置该元素的偏移量并提供不正确的参数。

它期望这样的东西，并抛出异常： $（''，{ 偏移量： {顶部： 2， 左： 4} }）

您确实应该使用data-属性来捕获像这样的非标准内容。 data-offset将是一个很好的方法来表示这一点。

我会使用 data 属性而不是创建自己的属性。

var newAnchor = $('<a>', {
                'href': '#',
                'class': 'seeMoreFromSection load-multi',
                'data-offset':'12',
                'type': '15',
                'sec': '4'
            }).html('See more');
$('a.seeMoreFromSection').replaceWith(newAnchor);

可以像这样访问，

$('*[data-offset="12"]');

使用大写偏移量...将:)解决您的问题 

$(document).ready(function(){
var newAnchor = $('<a>', {
                    'href': '#',
                    'class': 'seeMoreFromSection load-multi',
                    'Offset':'12',
                    'type': '15',
                    'sec': '4'
                }).html('See more');
$('a.seeMoreFromSection').replaceWith(newAnchor);
});

http://jsfiddle.net/YZZ62/

相关文章：