for internal reasons I need to attach some information to some html tag. Example:
<img src="mypic" mycustomvalue="abc">
Can I add safely like that or there is another way?
Thanks
I am currently using HTML 5
<!DOCTYPE html><html lang="en">
Yes, you can do that.
Note that the HTML5 standard is to prefix custom attributes with data-:
<img src="mypic" data-mycustomvalue="abc">
Yes, you can set it like that, and retrieve it with :
document.getElementById("txtBox").getAttribute("mycustomvalue");
Use getAttribute(), this should allow you to retrieve the value of any attribute.
Related
In any other case I'd say this is an error, but in case of google maybe I'm wrong?
If you simply open the home page at https://www.google.com/calendar/render, after authentication of course, and check its source, you'll surprisingly see
<!DOCTYPE HTML><head><title>Google Calendar</title><meta ....
Does it make any sense? I hope not, or in opposite case I should start attending the HTML class again :)
Should it be
<!DOCTYPE HTML><html><head><title>Google Calendar</title><meta ....
for HTML5 opening tag?
Thank you!
The opening <html> elements is optional, if the first tag after is not a comment:
An html element’s start tag may be omitted if the first thing inside the html element is not a comment.
W3C Reference
The HTML parser will insert it implicitly like many other elements, most notably <tbody>, which is only rarely set explicitly.
The text between <html> and </html> explains the webpages; the <!DOCTYPE html> declares the doctype for HTML5.
Hello I'm trying to make the following:
<div id="myid" class="myclass" myownattributehere="somevalue">hellooooo</div>
Is it possible to create a hidden attribute in a div like such, "myownattributehere" or is there another way to do this?
I've heard of putting anchors in to do this? Simple or can it be done via div only?
You can use HTML5's data attribute.
<div id="myid" class="myclass" data-myownattributehere="somevalue">hellooooo</div>
Use data-my-own-attribute-here="...".
Make sure to have HTML5 DOCTYPE: <!DOCTYPE HTML>
In JavaScript, you can access it like this: document.getElementById('myid').getAttribute('data-my-own-attribute-here').
Or in jQuery, access it like: $('myid').data('myOwnAttributeHere').
See also HTML5 data attributes.
Use html5 data attributes:
<div data-your_attribute_name="value"></data>
You can do this on almost any DOM element.
Yes, If "SEO" is not important for you, you can use like this. But it wil not be a valid usage in w3c validatain process. Also after using like this you can "get" or "set" this attribute via jQuery
...
$("#myid").attr("myownattributehere");// get
...
$("#myid").attr({"myownattributehere": "somevalue"});// set
If for example, I have a tag: Ex1, I want to identify what that tag is doing there. Title,class & id attributes aren't options as I use class&id for CSS and title displays text when hovered. So, is there any attribute to do that? Thanks!
Not really sure what your asking, but are you trying to apply meta-data as an attribute? If so, you can add more than one class (class="one two three fourClasses"), or use the data- attribute.
You can also use "data-[yourText]" as a cross-browser-safe attribute in any elements, and this often makes it nice to describe things because you can include more information in the custom data attribute value:
Ex1
Ex2
Ex3
What's wrong with <!-- HTML comments --> for annotations?
I have a list of items in an html table. On each row (tr) I'm proceeding like this:
<tr idAffaire="#suite.IdAffaire" idSuite="#suite.IdSuite" class="#suite.Username row droppable">
I used the attributes idAffaire and idSuite for retrieving some infos later. I know the official identification attribute is "id" but in my case I need 2 id. When I compile my code, VS is warning me about some things:
this name contains uppercase characters, which is not allowed.
attribute 'idaffaire' is not a valid attribute of element 'tr'
...
Is it possible to prevent these warnings? Is there a better way of doing?
Thank you.
Yes, in Tools > Options > Text Editor > HTML > Validation > [Untick] Show errors
Ideally, you could use 2 hidden input fields with the id="suite" and value="whatever" to allow you to pick these up in a valid way.
The problem is that you are writing invalid HTML. As you mentioned, id is a valid attribute but idAffaire or idSuite are not. I'm assuming from the fact that you get a warning about uppercase characters, you are using an XHTML doctype. A better way to do this would be to use an HTML5 doctype:
<!DOCTYPE html>
And use custom data attributes for your new attributes:
<tr data-affaire="#suite.IdAffaire" data-suite="#suite.IdSuite" class="#suite.Username row droppable">
I believe you should add name space extension of yours. Then define your newly introduced attributes.
What you are doing is termed as adding custom attributes to html elements, which have a very varying opinion among the experts.
Firstly , using capital in html attributes is not recommended, you can switch to small case.
Secondly , adding custom attributes in XHTML (which i suppose you are using) throws warning, where as this is perfectly valid in HTML5.
there are few option to deal with it -
use Jquery .data() api to store data with java script.
or
follow a specific convention while storing data making it easy to maintain and read.You can follow HTML5 syntax
<ul>
<li data-id='5' data-name='john'></li>
</ul>
I'm actually needing to include html links in the longdesc attribute. I've altered prettyphoto to use longdesc instead of title for images, but I need to include html links in those descriptions. I know it's possible with code for characters, I just don't remember what those are.
Thanks
This can be done with the longdesc attribute:
<img src="theimage.png" longdesc="thedescription.html" />
And then, in thedescription.html:
Link
One alternative way to do this is by using an OBJECT element, as follows:
<OBJECT data="theimage.png" type="image/png">
Link
</OBJECT>
Also, since you asked for it, here is how to convert html entities automatically in jquery:
$('<div/>').text('Some Link').html();
// the above evaluates to <a href="link.html">Some Link</a>
I'm not sure if this is what you're looking for, but you can use Walter Zorn's wz_tooltip to show a tooltip with any kind of content.
And example of use:
<img src="theimage.png" onmouseover="Tip('<a href=\'http://test.com/\'>Link</a>');" onmouseout="UnTip();">
The longdesc attribute is an URI, not a place to add code. In other words, you'll need to create a page that the longdesc links to. This page is where you'll make a thorough description of what's on the image.
Are you looking for the html entities?
If so, these are what you are looking for:
> = >
< = <
" = "
' = '