What does _ and / mean in HTML? I am trying to add an image to my site and would like to know what those functions do?
I've tried looking through google for the answer.
(I initially wrote this answer thinking you were asking about javascript instead of html; just in case I've included both here because, eh, why not.)
HTML
_ has no specific meaning, it's just a letter.
/ is used in file paths (such as URLs) to denote a change in directory. So <img src="/foo/bar/baz.gif"> would find an image named "baz.gif" inside a directory named "bar" inside a directory named "foo", at the root level of the website. For more detail, see https://developer.mozilla.org/en-US/docs/Learn/Common_questions/What_is_a_URL
Javascript
As in HTML, _ is just a character; it has no specific meaning in javascript. It is used by a common utility library named "underscore", and a competing library named "lodash"; if you're seeing this in js code it's probably including one of those libraries. (This is similar to how $ is commonly used for jQuery.)
/ does have a specific meaning in javascript; it's used to denote a regular expression, or as the "division" symbol for math.
Related
I am currently working on a controller file for a Phalcon project. I like how PhpStorm gives you autocomplete suggestions when writing a src or href value in an HTML file. I was wondering, is possible to enable autocomplete suggestions when adding resources in a controller?
This is what happens when I force autocomplete suggestions(Ctrl + Space)
This is what I would like to happen.
EDIT: I should also note that I have marked the folder, containing all my resources(ie. CSS, javascript, and images), as the "Resource root".
RE: EDITThis does not affect availability of this feature/functionality in any way as "Resource roots" are used for path resolutions/validation and not for actual "offer this functionality or hide it" choice. -LazyOne
Unfortunately there is no real way of automatically providing such functionality in random string as it's hard to guess that file path is expected in this particular place (function parameters is different case -- here some hinting mechanics (special annotation) may work).
But .. you can forcibly enable it manually for each particular place (should last until file or project is closed):
Have some code, e.g. $someVar = ['css' => 'aaa'];
Place caret inside aaa string (it has to be 3 or more characters, based on my observations, otherwise option in #4 will not be present -- must be some sort of optimisation/limitation from IDE side)
Invoke shortcut to bring "Quick Fix" menu (Alt + Enter on Windows)
Choose Inject language or reference from appeared menu
Choose File Reference from next menu
Start using it (Ctrl + Space)
EDIT: I should also note that I have marked the folder, containing all my resources(ie. CSS, javascript, and images), as the "Resource root".
This does not affect availability of this feature/functionality in any way as "Resource roots" are used for path resolutions/validation and not for actual "offer this functionality or hide it" choice.
This seems like it should be straightforward but I've been prowling the documentation and web and haven't found the answer.
I want to output HTML doc from Sphinx. Ideally I'd like to have three levels of "note" type highlighted text boxes. ReST defines several "admonitions": (http://docutils.sourceforge.net/docs/ref/rst/directives.html#admonitions) but most of the Sphinx HTML themes include special formatting only for Note and Warning. (I am using one of the preinstalled themes, Classic.)
I have two questions:
1) How can I customize the color behind Warning in my documents?
2) How can I add a formatting style for Caution?
I see that these all end up with tags like <div class="admonition warning"> ... in the HTML output. But I can't find where the formatting for that class is defined. Is it in a stylesheet? Is it in a layout.html file or some other file?
Is there anything that explains how the various files in themes actually interact with each other? I haven't found a good primer. (I am no expert on css-based HTML either, so maybe that's part of the problem.)
Okay, I figured out more and have a working workaround. (I'm still not sure how I'm supposed to handle this.)
Looks like my HTML code is reading directly from a few cascading stylesheets stored along with the output in a directory called _static. There's classic.css, which inherits from basic.css.
I don't understand how these relate to the files named like basic.css_t that live in the Python Sphinx install.
To change things, should I (A) try altering the _t files? or (B) create an altered local copy of classic.css that lives in my source directory?
If I go with B, more questions.
Will it be overwritten by the values in the css_t template at build time? (I guess this is easy enough to test)
Is it good practice to use the same filename for a modified version of that stylesheet?
Here's a workaround that avoids those questions and seems to be doing what I want - from this: https://github.com/snide/sphinx_rtd_theme/issues/117
I created an override stylesheet that includes just the formatting I want to change.
I stored it in the _static of my source directory.
I defined it in my conf.py as follows:
html_context = {
'css_files': [
'_static/theme_overrides.css',
],
}
Now, that github discussion said that this wasn't a solution for all kinds of themes (including the RTD theme mentioned in the question) but I think I'm safe for now.
What more should I know?
If I use a data URI to construct a src attribute for an HTML element, can it in turn have another data URI inside it?
I know you can't use data uri's for iframes (I'm actually trying to construct an OSDX document and pass it to the browser with an icon encoded in base64 but that's a really niche use case and this is more of a general question), but assuming you could, my use case would look like:
var iframe = document.createElement('iframe');
var icon = document.createElement('image');
var iSrc = 'data:image/png;base64,/*[REALLY LONG STRING]*/';
iframe.src='data:text/html,<html><body><image src="'+iSrc+'" /></body</html>
document.body.appendChild(iframe);
Basically what I'm after is is there anything in a data uri that would break a parent data uri?
Yes you can. I really thought it was impossible, as did everyone I asked.
Example:
Pasting the following into your browser's URL bar should render a gmail logo in an html page that says hello world.
data:text/html,<html><body><p>hello world</p><img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACwAAAAsCAMAAAApWqozAAAAz1BMVEX///+6xs7iTULj5+vW2tzk49TX3+Tq6tz09Orz9/jm7O6wu8aNm6WwMCjfRDnm5ube2Mmos7vt7++jrLP29/eyTk3d4+fj6+foWFLM1t2bNzeZpa2trKPv8/ajo6Xud2f0r6rv7uG3ubvd6eXIysq9s6jeopfSUknx8fHbXGKvTx7Hz9X09PTwhXHw9Pb++/fp7/Xu4d3SZlPSiXjuaFmMkZX39/vZy6/j8+v2+/v76uP7+/v0/Pewl4raMi/f5+7KTjitf4W2rI3/9vDzz8uC91bdAAAAAXRSTlMAQObYZgAAAmBJREFUeF6VldeunDAQQNeF3jvbe729p/f//6aMxzaBKHe5OZiVJY6OBvbBAyTvZaDJSy/xzpJ4pdJzz1tfOme5LD0vly45fETe4/1vUoK26bnPznUPzrPrmSJsgtrPpQnpPCmvp2/gukyE/HX6JtYor9/kpqUcY3ogvUxv5RhlSrbHenFzY/+0cxtYApZlGZod3W9JaqJspuSR1vTqw41U4UZb+S/zMAz35FbJt4QK6sUnW+naxWwoaJXBpBi37bxTjuchyl+0zLGs4npmVK1dHSLBiLhmlg+chLukFiLqV3dQ1i84p1SEv42CgLhYzmR5vqh1XIUXeypGoN+LAMoVz5yBk/EKZfsOQioOsnGFWXr/eXLCMs9EeehK2bab+NKCbQj2/mEymRSjpqzkR5CXOv4AWSqyM3BnRSDKw255CWtBW0BWcILyCmQsMywv5b/xS8WpzGJZzMywPFZjvANTYO10VoNfIxqOW2WlwhU/QnbSMDu1y0yWpSowdiqry6OArEW5ka1GNTaGsWqViwDL4z/lezClu4nBN+K/ypWSIywrNY4NxaqZWZSjThlEkQXLUna8lTZ+unWnDE6T1fbmtZlBxWxbFvHZ5NR8DUeUj5QejQ1mu24cv2C5aJW3R3qv1a4bX8TbIih+wAv6IPvDKCIrAusV8FEpyz5njFUV/ERdWFTBHVWwmGkyKKPcT2kyjvKFy1jPgnJ6IeTMg30vzCUZHBTc52mvzdKhz+GYcJIxTw8ukOKlVmd/SPk4kSdQ4nv8fJh7PriIw7Mn/yxPGW8dm06e269eOTwe/De/AW24fWb7B21TAAAAAElFTkSuQmCC" /></body></html>
or for a shorter example courtesy of Pumbaa80:
data:text/html,<script src="data:text/javascript,alert('hello world')"></script>
MSDN explicitly supports this:
Data URIs can be nested.
An old blog entry talks a little bit more about embedding images within CSS using data: :
Neither dataURI spec nor any other mentions if dataURI’es can not be nested. So here’s the testcase where dataURI’ed CSS has dataURI’ed image embedded. IE8b1, Firefox3 and Safari applied the stylesheet and showed the image, Opera9.50 (build 9613) applies the stylesheet but doesn’t show the embedded image! So it seems that Opera9 doesn’t expect to get anything embedded inside of an already embedded resource! :D
But funny thing, as IE8b1 supports expressions and also supports nested data URI’es, it has the same potential security flaw as Firefox does (as described in the section above). See the testcase — embedded CSS has the following code: body { background: expression(a()); } which calls function a() defined in the javascript of the main page, and this function is called every time the expression is reevaluated. Though IE8b1 has limited expressions support (which is going to be explained in a separate post) you can’t use any code as the expression value, but you can only call already defined functions or use direct string values. So in order to exploit this feature we need to have a ready javascript function already located on the page and then we can just call it from the expression embedded in the stylesheet. That’s not very trivial obviously, but if you have a website that allows people to specify their own stylesheets and you want to be on the safe side, you have to either make sure you don’t have a javascript function that can cause any potential harm or filter expressions from people’s stylesheets.
I am a big fan of ST2, and have been finding oodles of tricks to code/type faster.
One thing that I would like to know is if it is possible to create custom symbols for things like code blocks, include segments, and other bookmarks for goodies in your file.
For example:
I want to quickly include a standard C lib via (inc, tab). Is there a way for me to create a section where I keep all my standard lib includes (i.e: #CSTDLIB) and use the functionality of goto-> symbol (ctrl+r) to skip straight to this segment from anywhere in my file?
I tried looking to see if there was some sort of special handler to place in a comment that would recognise it as a "bookmark" but couldnt really find anything.
Cheers in advance.
This is an old question, so I'm answering for the latest ST3. Pretty sure this was possible with older versions as well.
The builtin C/C++ syntax definitions support a special formatting for comments in the following form:
// =jump target=
The string "jump target" will then be listed in the symbol list for ctrl+r. Unfortunately that only works if the // is at the beginning of the line. But we can fix that.
Install PackageResourceViewer, then from the command palette use PackageResourceViewer: Open Resource->C++->C.sublime-syntax.
In this file it says:
- match: ^// =(\s*.*?)\s*=\s*$\n?
scope: comment.line.banner.c
captures:
1: meta.toc-list.banner.line.c
Now remove the ^ in front of the regexp, save the file. Now you can enter comments // =jump target= anywhere, and jump there with ctrl+r.
If I have understood you correctly, you can use Ctrl + F2 shortcut for making bookmarks anywhere in your file, and walk through these bookmarks by F2 button. To remove bookmark, press Ctrl + F2 again in the line which you want to exclude from bookmarks.
If it isn't so, and this functionality doesn't cover your requirements, please specify more detailed use case.
Hope it will be useful to you
Situation: I have a group of strings that represent Named Entities that were extracted from something that used to be an HTML doc. I also have both the original HTML doc, the stripped-of-all-markup plain text that was fed to the NER engine, and the offset/length of the strings in the stripped file.
I need to annotate the original HTML doc with highlighted instances of the NEs. To do that I need to do the following:
Find the start / end points of the NE strings in the HTML doc. Something that resulted in a DOM Range Object would probably be ideal.
Given that Range object, apply a styling (probably using something like <span class="ne-person" data-ne="123">...</span>) to the range. This is tricky because there is no guarantee that the range won't include multiple DOM elements (<a>, <strong>, etc.) and the span needs to start/stop correctly within each containing element so I don't end up with totally bogus HTML.
Any solutions (full or partial) are welcome. The back-end is mostly Python/Django, and the front-end is using jQuery. We would rather do this on the back-end, but I'm open to anything.
(I was a bit iffy on how to tag this question, so feel free to re-tag it.)
Use a range utility method plus an annotation library such as one of the following:
artisan.js
annotator.js
vie.js
The free software Rangy JavaScript library is your friend. Regarding your two tasks:
Find the start / end points of the […] strings in the HTML doc. You can use Range#findText() from the TextRange extension. It indeed results in a DOM Level 2 Range compatible object [source].
Given that Range object, apply a styling […] to the range. This can be handled with the Rangy Highlighter module. If necessary, it will use multiple DOM elements for the highlighting to keep up a DOM tree structure.
Discussion: Rangy is a cross-browser implementation of the DOM Level 2 range utility methods proposed by #Paul Sweatte. Using an annotation library would be a further extension on range library functionality; for example, Rangy will be the basis of Annotator 2.0 [source]. It's just not required in your case, since you only want to render highlights, not allow users to add them.