我想将文本文件放入javascript函数中,然后以某种方式在html中显示该函数。
javascript不能在html文件中;必须从文件外部像这样引用它:
这里是我要做什么的图片(我的代表点不足):
https://i.ibb.co/xGxw1bm/1.png
我尝试过:
const Http = new XMLHttpRequest();
const url=' https://cors-anywhere.herokuapp.com/https://app.box.com/s/zkt7pbsv0cnnogafcxq8n5elmc9plxbz';
\\later in the code; because I didn't know where to put the rest of the http commands so I put them in the twitch.onAuthorized function which needs to be ran in this script anyway. I don't know what it does but it needs to be there and since its already a function I figured it would be better there. (Unless someone can make a function where all the https stuff is in one function.)
twitch.onAuthorized(function (auth) {
// save our credentials
token = auth.token;
tuid = auth.userId;
Http.open("GET", url);
Http.send();
Http.onreadystatechange=(e)=>{
console.log(Http.responseText);
setAuth(token);
$.ajax(requests.get)
}
});
我在此看到的所有内容始终表明您可以使用标签进行操作,但是我没有看到一个示例,该文档在另一个javascript文件中包含内容,因此他们必须将其引用到html。我总是在与html相同的文件中看到它。
我可以使用什么功能将功能提取到html文件而不使用按钮?我只希望它像对象标签或iframe标签一样显示。
以下是确切的html文件:(注意:这是测试,因此html文件中的所有单词均无关紧要。我只是想学习如何从另一个javascript文件或backend.js javascript文件中将文本放在此处我可以使用什么标记或引用将javascript中的函数放到此处而无需按钮呢?仅在屏幕上我需要文本。
<!DOCTYPE html>
<html>
<head>
<title>Viewer Page</title>
</head>
<body style="font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;">
<div id="app" class="full-height"></div>
<script src="twitch-ext.min.js"></script>
<script src="jquery-3.3.1.min.js"
integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
crossorigin="anonymous"></script>
<script src="viewer.js" type="text/javascript"></script>
<h2>Hello, World!</h2>
<p>Would you care to cycle a color?</p>
<object type="text/html" data="https://www.w3.org/TR/PNG/iso_8859-1.txt"></object>
</body>
</html>
这是viwer.js(这是获取文本文件的javascript所需的位置):
const Http = new XMLHttpRequest();
const url=' https://cors-anywhere.herokuapp.com/https://app.box.com/s/zkt7pbsv0cnnogafcxq8n5elmc9plxbz';
let token = '';
let tuid = '';
const twitch = window.Twitch.ext;
// create the request options for our Twitch API calls
const requests = {
set: createRequest('POST', 'output'),
};
function createRequest (type, method) {
return {
type: type,
url: location.protocol + '//localhost:8081/musicoutput/' + method,
success: updateBlock,
error: logError
};
}
function setAuth (token) {
Object.keys(requests).forEach((req) => {
twitch.rig.log('Setting auth headers');
requests[req].headers = { 'Authorization': 'Bearer ' + token };
});
}
twitch.onContext(function (context) {
twitch.rig.log(context);
});
twitch.onAuthorized(function (auth) {
// save our credentials
token = auth.token;
tuid = auth.userId;
Http.open("GET", url);
Http.send();
Http.onreadystatechange=(e)=>{
console.log(Http.responseText);
setAuth(token);
$.ajax(requests.get)
}
});
function updateBlock (hex) {
twitch.rig.log('Updating music info');
}
function logError(_, error, status) {
twitch.rig.log('EBS request returned '+status+' ('+error+')');
}
function logSuccess(hex, status) {
twitch.rig.log('EBS request returned '+hex+' ('+status+')');
}