I'm trying to change the context of a text file on an HTML button click.
I have this so far:
index.html:
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Table</title>
<script src="node-main.js"></script>
</head>
<body>
<embed src="table.txt">
<button onclick="Update()">Update</button>
</body>
</html>
node-main.js:
const fs = require('fs');
function Update() {
fs.writeFileSync("table.txt", 'New text');
}
It does not do what I was expecting.
It gives me the error:require is not defined
Thanks in advance :)
You should run node-main.js as a server that receives fetch requests from your client. You're trying to run server-side scripts on the client.
Try using Express.js
https://expressjs.com/
Related
I am using I wrote a small selenium script in javascript that executes find with node (filename.js) in the terminal but when I try to execute that script with a button click it doesnt work.
I took the guts out and put an alert() and it executed.
Just wondering if anyone can spot what I am doing wrong here?
Here is the script
async function example() {
const {Builder, By, Key, util} = require("selenium-webdriver");
require("chromedriver");
let driver = await new Builder().forBrowser("chrome").build();
await driver.get("http://google.com");
await driver.findElement(By.name("q")).sendKeys("Selenium Test", Key.RETURN);
}
And here is the php file I want to execute it from
<!doctype html>
<html lang="en">
<head>
<title>Sidebar 01</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<script src="index.js"></script>
</head>
<body>
<center>
<button onclick="example();">Hello</button>
</center>
</body>
</html>
This is my html and javascript code.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<p id = 'test' onclick= "switchtest()">Hello world</p>
<script src = 'phonetest.js'></script>
</body>
</html>
function switchtest(){
document.getElementById('test').innerHTML = 'Goodbye'
}
It works on visual studio code live server, but when I transfer these 2 files to my phone and open it on chrome there, the onclick function stops working. It only works if function is in the same html file. The path to my html file is "/Internal storage/TestCode/phonetest.html" and the path to my javascript file is "/Internal storage/TestCode/phonetest.js"
I read that I might need to specify file location or that I may need a xml file, but I am not sure what I must do exactly. Does anyone know a fix?
Is it possible to choose JavaScript runtime environment (rhino...etc) when sourcing a JavaScript file in html ??
<script type="text/javascript" src="file.js"></script>
index.html:
<!DOCTYPE html>
<html lang="en">
<head>
<script src="file_1.js"></script>
<script src="file_2.js"></script>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=">
<title></title>
</head>
<body>
<p id="test">abc</p>
</body>
file_1.js:
window.paragraph = readFile('file_to_read.tcl');
localStorage.setItem("paragraph", paragraph);
file_2.js:
setTimeout(function(){
document.getElementById("test").innerHTML = window.paragraph;
}, 3000);
need to read the "file_to_read.tcl" and then pass the "paragraph" variable to the second js file "file_2.js"
but still finding this issue : "ReferenceError: readFile is not defined"
thanks
I have created a Dart HttpServer which shows "HTML" code on the browser but I also want to connect "CSS" & "JS" to this HTML,
How should I do that? please help
HttpServer _server;
_server = await HttpServer.bind(InternetAddress.anyIPv4, port);
_server.listen((request) async {
request.response
..headers.contentType = ContentType.html
//HTML Code
..write('''
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<! -- <link rel="stylesheet" href="styles.css"> -->
<title>Hello World</title>
</head>
<body>
<p>Hello WOrld</p>
</body>
<! -- <script src="app.js"></script> -->
</html>
''');
await request.response.close();
}
PS 1: One Solution is to add CSS and JS codes in the HTML code which would work but is less efficient.
PS 2: I am using this dart code in a flutter project.
Just use html tag.
Don't neglect every source imported by html tag is a http request. you should handle these requests. Dart HttpServer doesn't handle these.
when creating a basic html layout as shown below, i keep getting "[violation] avoiding using document write()" error. However when i remove the body tag, the error is gone.
Does anyone know why its happening and is there any alternative for me to use.
Thanks,
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
</body>
</html>
Update:
The source tab on chrome developer console, is highlighting the line inside the body tag.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script id="bs_script">
//<![CDATA[ document.write("<script async src='/browser-sync/browser-sync-client.js?v=2.26.7'><\/script>".replace("HOST", location.hostname)); //]]>
</script>
</body>
</html>
The script tag within the HTML is the issue.
Additionally: Browsersync inserts a document.write() script tag into any first tag, even if that first tag is commented out. So using a different live browser reload solved the issue