I'm using Evernote to sync data with my app, but I need the notes and their media items on Evernote to have an ID the same as the syncID held within my app, to match data with it's sync'd counterpart. To do this, I want to add a tag in the HTML which contains my syncID. Is there a tag I could use for something like this? Something for an 'id' function, or other custom function?
EDIT:
Example. Let's say the evernote note is like so:
<en-note>This is a note</en-note>
But I want to find out the ID of this note, to see if my app contains it or not. So ideally I'd have something like this:
<noteID="vdsijfewo329ds"><en-note>This is a note</en-note></noteID>
Or something similar, to help me find out which note this matches inside my app. Is this possible?
EDIT: Evernote disallows use of the data- attribute. So this:
<span data-syncID="fdshfiewo">
Would not be allowed.
option 1 (general usage, not supported by Evernote today) you could use HTML5 data attributes
<span data-nodeID="vdsijfewo329ds"><en-note>This is a note</en-note></span>
option 2 you could try <figure> - <figcaption> HTML5 pair:
<figure>
<en-note>This is a note</en-note>
<figcaption style="display: none">vdsijfewo329ds</figcaption>
</figure>
option 3 class attribute (this was the reason data-* attributes were created, this could be the last resort option
<span class="en-note vdsijfewo329ds"><en-note>This is a note</en-note></span>
Related
Trying to determine the correct syntax for using Microdata inside my breadcumbs implementation. Everything I have read seems to lean towards the fact that the breadcrumbs are structured inside an ordered or unorderd list. Mine is not.
<body itemscope="" itemtype="http://schema.org/WebPage">
...
<div class="breadcrumbs" itemprop="breadcrumb">
Home
<span class="delimiter"> > </span>
Parent Item
<span class="delimiter"> > </span>
<span>Child</span>
</div>
...
</body>
If I run it inside Google's tool it seems correct, but compared to their example it is missing a lot of elements and doesn't have the structure of their example BreadcrumbList.
I'm also a little confused about the correct properties for the links. Should they all have title and url properties?
I was looking at the examples at the bottom of the page here: http://schema.org/WebPage
The breadcrumb property expects one of two values:
Text
BreadcrumbList
If you provide a Text value (like you do in the example), you can’t provide data about each link. If you are fine with that, the Microdata in your example is correct (but it also contains RDFa, which doesn’t seem to make sense, at least not without further context; so if you didn’t add them intentionally, you might want to remove the property attributes).
If you want to provide data about each link, you have to provide a BreadcrumbList value.
For the Microdata, it doesn’t matter whether or not you use a list. If the example uses ol→li→a→span, you could as well use something like div→span→a→span. You just have to make sure to use the correct element type.
If you can’t add parent elements to the a elements, it’s still possible to use BreadcrumbList. But then you would have to duplicate the URL with a link element inside the a element.
I created multiple buttons, for each created button I want to save some information in an attribute so that I can use it when the button is clicked.
Is there any attribute in HTML button that I can store information to use it at some point?
You can create your own using the new data-* custom data attributes (see w3c specs). What comes at the * is up to you (as long as it is valid HTML of course):
<button id="x123"
data-some-attr="I like this"
data-what-about-this="I like it too"
/>
See the data-attributes, for example here you can find more info.
Example from linked page:
<li class="user" data-name="John Resig" data-city="Boston" data-lang="js" data-food="Bacon">...</li>
HTML5 introduced the data- attribute just for this. So if you were to store a button number, you would call it data-callNum or something similar.
You can read more up on it here: http://www.w3schools.com/tags/att_global_data.asp
As a warning with JS, you can't just use the usual . to access the member, due to the - which will be interpreted as a minus operation. So instead of button.data-attr you have to do button.getAttribute('data-attr').
I just need to know if this is the correct way of doing this.
I am trying to create an anchor tag that has an embedded image in it using a data attr. This will be used to determine what will be displayed at different media queries.
is this syntax correct? I have no idea. I am using bootstrap as my framework
<div class ="col-lg-12" data-test="<a href='http://www.army.mil/veterans/' target='_blank'><img id='va_badge' class ='badges img-responsive' src='images/armybadge.png' alt='Army Veteran Badge'></a>"> </div>
The syntax is correct. (You can check this using a validator like http://validator.w3.org) A data-* attribute may have any value. It may cpntain “<” characters, as they are not treated as starting a tag when inside an attribute value.
What you are going to do with the value is a completely different thing. It is all up to you. The data-* attributes are just containers for that that you can process with a script.
Trying to learn html/css. I've been looking at the html & css files of a couple different websites that have something along the line of:
<span class="mytest anothertest">some text goes here</span>
I understand the "mytest" part but what does "anothertest" do? There's no reference to that anywhere in their css or html files.
anothertest is just another class like mytest. You can apply more than one to an element.
There are several possible reasons for the presence of a class name in a class attribute value. Using the class in page stylesheets is probably most widely known, but not the only one:
The class name can be used in JavaScript in order to process a set of elements conveniently. (Using document.getElementsByClass is one way to achieve this; another way is to use jQuery; and you could even hand-code it rather simply.)
Designated class names are used in some metadata systems, such as microformats. Some search engines recognize such names and use them to provide semantic searching (though this approach probably loses to microdata, which uses different attributes).
A class name can be used in a user style sheet, e.g. by a developer who wishes to do some testing. This could well be the case if the class name is literally “anothertest.”
The name might be there to allow future development, e.g. so that elements of a class will be or may be styled in some future version. The designers might have ideas on styling but they haven’t decided on it—they just want it to be easy when they are ready.
It could be just a holdover. It was a class that had some use, but things changed. There was really no particular reason to remove it.
This is a very good question. It involved the difference between id and class.
ID
An ID placed on an element, is a unique identifier for that element. An element may only have one ID, and only one of the same ID may exist on a page. So for instance, the following examples are not possible.
<a id="someid anotherid">Multiple IDs - Wrong</a>
<a id="someid"><span id="someid">Same ID twice - Wrong</span></a>
Class
A class name however, is the exact opposite. An element may have several class names, and the same class name may appear multiple times on a page. Like so:
<a class="someclass anotherclass">Multiple Classes - Correct</a>
<a class="someclass"><span class="someclass">Same Class twice - correct</span></a>
In short, the syntax displayed in the question is simply having 2 class names on one element, which is perfectly acceptable.
Class name are also used to easily select elements in the page with JavaScript. You can use the getElementsByClassName method to access them or using your favorite CSS selector library (ex.: Sizzle) if you need compatibility for older browser.
I'm currently making a facebook application and while investigating the (X)HTML source code for a message thread page to see if it was possible to link to specific messages within threads (apparently it's not), I encountered an HTML attribute that I cannot seem to find any information about. Some span elements on the page had a 'bindpoint' attribute that was set to various values (presumably element IDs). Here is an excerpt from the page source (I replaced some private info with Xs)
<div class="GBThreadMessageRow_Info">
<span class="GBThreadMessageRow_AuthorLink_Wrapper" bindpoint="authorLinkWrapper">
XXXXXXXX
</span>
<span class="GBThreadMessageRow_Date">
April 8, 2010 at 10:13pm
</span>
<span bindpoint="branchLinkWrapper" class="GBThreadMessageRow_BranchLink">Reply</span>
<span bindpoint="reportLinkWrapper" class="GBThreadMessageRow_ReportLink"> • Report</span>
</div>
I have never seen this attribute before and any information about it would be useful/helpful/interesting. Thanks!
As was said in the comments, it has to be something they're doing in the javascript code.
Facebook uses an interesting technique to import their javascript files dynamically (basically they seem to write out script tags in the javascript, when necessary), and it's not quite as simple as just pressing ctrl-F through the first file you find.
So, in conclusion, the bindpoint attribute is something internal to the Facebook eco-system, and not standard HTML. From the name, I assume it has something to do with which events (clicks, mouseovers, etc.) should be binded to the element in question, which is signified by a variable name give in the bindpoint attribute. Or maybe it has to do with which element the element in question should be 'binded' to, like the for attribute for a label. Anyway, this is pure speculation.