使用＃和是否安全。 html属性中的字符？

Question

我想知道我是否可以将HTML对象的属性值设置为包含#字符串？

我想这样做的原因是页面将有很多项目应该将页面滚动到指定的元素，我想存储数据'滚动到哪个项目？ '作为data-scrollto属性。

所以我的JavaScript代码 - 将会是这样的：

function ScrollToElement(lm)
{
    var theTop  = lm.offset().top;
    $("html,body").animate({
        scrollTop: theTop/*,
        scrollLeft: 1000*/
    });
}

// .. and add click event to all such objects : 
$('.scroller').click(function(){
        var theSelector = $(this).attr('data-scrollto');
        ScrollToElement($(theSelector));
    });

所以html元素看起来像：

<a class='scroller' data-scrollto='p#p-to-scroll'>Click to scroll to p</a>

这样安全吗？

作为一个附带问题，为什么呢

$(element).data('scrollto');

不起作用但是

$(element).attr('data-scrollto'); 

工作？

Answer 1

根据W3C规范，是的，它是安全的，使用U+0023 NUMBER SIGN字符（ # ）和U+002E FULL STOP字符（ . ）。

属性名称，后跟零个或多个空格字符，后跟单个U+003D EQUALS SIGN字符，后跟零个或多个空格字符，后跟属性值，除了上面给出的属性值要求之外， 不得包含任何文字空格字符，任何U+0022 QUOTATION MARK字符（ " ）， U+0027 APOSTROPHE字符（ ' ）， U+003D EQUALS SIGN字符（ = ）， U+003C LESS-THAN SIGN字符（ < ）， U+003E GREATER-THAN SIGN字符（ > ）或U+0060 GRAVE ACCENT字符（`），不能是空字符串 。

阅读http://www.whatwg.org/specs/web-apps/current-work/multipage/syntax.html#attributes-0 。

Answer 2

是的，你可以存储哈希#和. 在数据属性中。 您应该使用正确的数据方法。 http://api.jquery.com/jQuery.data/

var theSelector = $(this).data('scrollto');

如果您似乎无法使用数据方法，请检查您正在使用的jQuery版本，它是在1.2.3版本中引入的