openDatabase is not defined - html

I have the following page:
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
</head>
<body>
<script>
var dbo = openDatabase('HelloWorld');
</script>
</body>
</html>
and I'm getting in firebug:
openDatabase is not defined.

You are trying to open a SQL storage but Firefox has no such feature. Mozilla will never implement it. Have a look at this question: Which version of firefox will support Web SQL?

Related

Google tries to translate English HTML subscripts from Arabic

I have a simple HTML page with some <sub> elements in it. For some reason, Google Translate offers to translate the subscripts from Arabic to English (despite being English to begin with), only moving them down a little when translated. The HTML page language is set to en-US. Is this just my computer being weird, or is there a code-related reason?
<!DOCTYPE html>
<html lang="en-US">
<head>
<!--<meta name="google" content="notranslate"> (this successfully gets rid of the translate popup, commented out for testing purposes)-->
<meta charset="utf-8"/>
<meta name="viewport" content="initial-scale=1, maximum-scale=1"/>
<title>test</title>
<link rel="icon" href="favicon.svg" type="image/svg"/>
<link href="style.css" rel="stylesheet" type="text/css"/>
<link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="functions.js"></script>
<script src="main.js" defer></script>
</head>
<body style="min-width: 0">
<div id="test"></div>
</body>
</html>
Added to #test by JS:
<div class="letter">A<sub>1</sub></div>
Website: https://test.edgeloop.repl.co
Screenshot: screenshot
Are you sure that this is the correct code? You seem to have a <html...>-tag inside your <head>-tag. Remove the duplicate html-tag inside your head, and instead add the lang="en"-attribute to your outer-most html-tag.
Your code should thus look as follows:
<!DOCTYPE html>
<html lang="en-US">
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1">
<title>test</title>
....
</head>
<body style="min-width: 0">
<div id="test"></div>
</body>
</html>
If this does not immediately solve your problem, try clearing the google chrome cache as follows:
Press F12 to open the dev tools menu
Right-click your refreh-button
Select the option empty cache and hard refresh:
If your webpage uses HTML and XML interchangably, you might need to add the following to your opening <html>-tag (see this link):
<html lang="en" xml:lang="en" xmlns="http://www.w3.org/1999/xhtml">
...
</html>
If your Google Translate does still pop up, you have the following options:
add translate="no" to your root html-tag
add the class notranslate to your root html-tag
add <meta name="google" content="notranslate"> to your head-tag
Your code should look as follows:
<html lang="en" translate="no" class="notranslate">
<head>
<meta name="google" content="notranslate"/>
....
</head>
....
</html>
#Lawrence Cherone's comment about adding more text seems to fix the problem, as does #unknown6656's suggestion of adding <meta name="google" content="notranslate">. I still don't know why subscripts are considered Arabic text, but adding English text seems to fix the problem. Thanks for all the answers.

Use process.env in html head

I have a react app and I am using ms clarity for analytics. The docs say to set it up I need to use the javascript script tag in the head of the html. I am wondering if I can make an external file with the code and have access to the process.env.NODE_ENV variable?
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<!-- Make the page mobile compatible -->
<meta name="viewport" content="width=device-width, initial-scale=1" />
<script type="text/javascript">
if ('%NODE_ENV%' === 'production') {
MS CLARITY CODE
}
</script>
</head>
<body>
<div id="root"></div>
</body>
</html>
The node env variable is not working. I would like to have an external file that contains the clarity code and check if the app is in production so that it doesnt track changes when developing on localhost
**try using this**
<head>
<title>React App</title>
<script type="text/javascript">
console.log("%REACT_APP_TEST%") // OK
console.log("%NODE_ENV%") // development
</script>
</head>
and start server like this
'NODE_ENV=development npm start'

how to encode link to google search results? (ampersand problem)

I'm trying to include a link in my page that will link directly to google search results (as opposed to linking to a predetermined search, as in this question).
I tried this:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
</head>
<body>
click me
</body>
</html>
The ampersand gets mangled, the url comes out as http://www.google.com%26q%3Dsports instead of http://www.google.com&q=sports.
What's the right way to do this?
I think this is format if you want to return results in the correct manner:
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body>
click me
</body>
</html>
But here is the good resource and a duplicate to this question if that's the case - Do I encode ampersands in <a href...>?

Session storage Not clearing for _blank href

<!DOCTYPE html>
<html lang="en">
<head>
<title></title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="css/style.css" rel="stylesheet">
</head>
<body>
Click Here
<button onclick="clearSession()">Clear</button>
<script>
sessionStorage.test = true
function clearSession(){
//sessionStorage.setItem('test', false)
sessionStorage.clear()
}
</script>
</body>
</html>
I am setting one session storage and on click of clear I am clearing that. I have on href button where I am opening the same page in the new tab with target blank. But there my session variable still exist. Can Somebody help.
You are calling sessionStorage.test = true directly when the page loads inside your script tag, so it makes sense that it exists again when you open the page.

d3.geomap Not Working

I have been trying to get the documentation from http://d3-geomap.github.io/ to work but somehow it's not i can't find my mistake.
Here is my Code:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="d3-geomap/css/d3.geomap.css" rel="stylesheet">
<script src="d3-geomap/vendor/d3.geomap.dependencies.min.js"></script>
<script src="d3-geomap/js/d3.geomap.min.js"></script>
</head>
<body>
<div id="map"></div>
<script>
var map = d3.geomap()
.geofile('d3-geomap/topojson/world/countries.json');
d3.select('#map')
.call(map.draw, map);
</script>
My HTML File is in the root folder.
Okay if anyone else has the same problem as me - I solved it.
The thing is that windows has some security issues and it blocks some type of code. I couldn't find out the real reason but if u want it to work, just host it on a virtual web server (e.g. www.xampp.com) that did the job for me.