javascript - Is it safe to use # and . characters in html attributes? -

i'm wondering if can set value of html object's attribute string contains # character ?

the reason want page have lot of items should scroll page specified elements, , want store data ' item should scroll to? ' data-scrollto attribute.

so javascript code -will- this:

function scrolltoelement(lm) {     var thetop  = lm.offset().top;     $("html,body").animate({         scrolltop: thetop/*,         scrollleft: 1000*/     }); }  // .. , add click event such objects :  $('.scroller').click(function(){         var theselector = $(this).attr('data-scrollto');         scrolltoelement($(theselector));     }); 

so html elements :

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

is safe ?

and side question, why

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

does not work but

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

works ?

according w3c specs, yes, is safe use u+0023 number sign characters (#) , u+002e full stop characters (.).

the attribute name, followed 0 or more space characters, followed single u+003d equals sign character, followed 0 or more space characters, followed attribute value, which, in addition requirements given above attribute values, must not contain literal space characters, u+0022 quotation mark characters ("), u+0027 apostrophe characters ('), u+003d equals sign characters (=), u+003c less-than sign characters (<), u+003e greater-than sign characters (>), or u+0060 grave accent characters (`), , must not empty string.

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