当我偶然发现这一点时,请原谅我的困惑,我是javascript之类的新手。如果我的代码是垃圾,也请原谅我,因为它是我发现的示例和我发现(但没有发现)的事情的组合!
我正在尝试在Open Broadcaster软件中运行此html文件:
<html>
<head>
<link rel="stylesheet" href="css/stylesheet_twitter1.css" type="text/css" charset="utf-8">
<script src="js/jquery-2.0.2.min.js" type="text/javascript" charset="utf-8"></script>
<script src="js/jstween-1.1.min.js" type="text/javascript" charset="utf-8"></script>
<script src="js/countries.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
var timestampOld;
var timestamp;
var mText4;
var xmlDoc;
var xhr = new XMLHttpRequest();
var animating = false;
var doUpdate = false;
function init() {
xhr.overrideMimeType('text/xml');
var timeout = this.window.setInterval(function() {
pollHandler();
}, 250);
$('#mText4').html('');
$('#board').tween({
top:{
start: '80',
stop: '0',
units: 'px',
time: 0,
duration: 0.8,
effect:'easeOut'
}
});
$.play();
}
</script>
</head>
<body onLoad="init()">
<script type="text/javascript">
function pollHandler()
{
loadData();
if (timestamp != timestampOld) {
doUpdate = true;
}
if (!animating && doUpdate) {
updateBoard();
}
}
function loadData() {
xhr.open('GET', 'streamcontrol.xml');
xhr.send();
xhr.onreadystatechange = function(){
xmlDoc = xhr.responseXML;
mText4 = getValueFromTag(xmlDoc,'mText4');
timestampOld = timestamp;
timestamp = getValueFromTag(xmlDoc,'timestamp');
}
}
function updateBoard() {
if ($('#mText4').html() != mText4) {
animating = true;
$('#mText4').tween({
opacity: {
start: 100,
stop: 0,
time: 0,
duration: 0.5,
effect: 'easeIn'
},
onStop: function(){
$('#mText4').html(mText4);
}
});
$('#mText4').tween({
opacity: {
start: 0,
stop: 100,
time: 0.5,
duration: 0.5,
effect: 'easeOut'
},
onStop: function(){
animating = false;
}
});
}
$.play();
doUpdate = false;
}
function getValueFromTag (xmlDoc,tag) {
if (xmlDoc.getElementsByTagName(tag).length != 0 ) {
if (xmlDoc.getElementsByTagName(tag)[0].childNodes.length == 0) {
return '';
} else {
return xmlDoc.getElementsByTagName(tag)[0].childNodes[0].nodeValue;
}
} else {
return '';
}
}
</script>
<div id="board">
<div id="mText4"></div>
</div>
</body>
</html>
它工作正常,但是在运行了几个小时(以及两个其他html文件)后,该软件将崩溃。这使我查看了它创建的日志文件,并且看到了很多次以下内容:
Uncaught TypeError: Cannot read property 'getElementsByTagName' of null @http://absolute/D:/obs%20stuff/browserfiles/Twitter1.html334
所以我在Firefox中运行了它,然后抛出了以下错误(再次是很多):
TypeError: xmlDoc is null
我知道那streamcontrol.xml
不是空的。我觉得这些错误为我指明了一个正确的方向,但是经过两天大约10个多小时的尝试,我尝试了在不同线程上看到的不同事情之后,我感到茫然。
onreadystatechange不仅会在您的请求成功完成时触发。您必须在处理程序中检查就绪状态是否已完成以及状态是否成功。
请在这里对一些使用细节。
通常,您需要检查是否xhr.readystate === 4
知道它有响应,然后检查状态(xhr.status === 200
表示响应成功)。
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句