Javascript replaceChild 不显示消息



我有这个代码

<!DOCTYPE html>
<html lang="it">
<head>
<script>
function insertAfter(newNode, referenceNode) {
referenceNode.parentNode.insertBefore(newNode, referenceNode.nextSibling);
}


function writeMess(node, mess){
	elementEx= document.getElementsByTagName("br").length;
	if(elementEx < 5){
		newerrmess = document.createTextNode(mess);
		node.replaceChild(newerrmess, node.firstChild);
		br = document.createElement("br");
		insertAfter(br, node);
	}
}


function Add(){
	try{

		writeMess(nodoMessErr1, "");
		var capsule = parseInt(nodoCapsule.value);

		/* Check correct values */
		if(!isNaN(capsule)){
			totcapsule = capsule;
		}
		else{
		/* Err Mess */
		writeMess(nodoMessErr1, "Error Mess 1");
		return;
	  }
	}	
	catch( e ){
		alert("Aggiunta " + e);
		return;
	}
}	

var nodoAdd;
var nodoCapsule;
var nodoMessErr1;
var totcapsule;


/* Core function */
function gestoreLoad(){

try{

	nodoAdd = document.getElementById("aggiunta");
	nodoCapsule= document.getElementById("capsule");
	nodoMessErr1 = document.getElementById("adderr");

	
	nodoAdd.onclick = Add;
	nodoCapsule.value = "";

	var TextNodeErr_1= document.createTextNode("");
	nodoMessErr1.appendChild(TextNodeErr_1);


	}
	catch(e){
		alert("gestoreLoad " + e);
	}
}



window.onload = gestoreLoad;
</script>
</head>
<body>
	<span id="adderr"></span>
	
	<input type="text" id="capsule" /> 
	<input type="button" id="aggiunta" value="Add"/> 
	


</body>
</html>

函数writeMess充当消息(文本节点(的"编写器",将其附加为span的子级,并在span之后放置"<br>">

看看"Add"函数,我的程序就像用户在"nodoCapsule"中放入NaN值时一样工作。value显示一条警告他的错误消息(默认值"(。

我试着按下按钮(id="Aggiunta"(在其中写入NaN值,但没有显示任何消息(只创建了一个"<br>",但之前没有文本(

我不知道为什么,有什么解决方案吗?

编辑--这取决于浏览器,其他浏览器显示错误消息,但继续创建"<br>"。当显示错误消息时,我只想要一个"<br>"。在没有显示消息的地方没有消息,也没有br。

您只需要检查是否已经有br标签

您可以通过进行检查

if (node.nextElementSibling.tagName.toLowerCase() !== "br") {
// add br
}

工作示例

function insertAfter(newNode, referenceNode) {
referenceNode.parentNode.insertBefore(newNode, referenceNode.nextSibling);
}
function writeMess(node, mess){
elementEx= document.getElementsByTagName("br").length;
if(elementEx < 5){
newerrmess = document.createTextNode(mess);
node.replaceChild(newerrmess, node.firstChild);
if (node.nextElementSibling.tagName.toLowerCase() !== 'br') {
br = document.createElement("br");
insertAfter(br, node);
}
}
}
function Add(){
try{
debugger;
writeMess(nodoMessErr1, "");
var capsule = parseInt(nodoCapsule.value);
/* Check correct values */
if(!isNaN(capsule)){
totcapsule = capsule;
}
else{
/* Err Mess */
writeMess(nodoMessErr1, "Error Mess 1");
return;
}
}   
catch( e ){
alert("Aggiunta " + e);
return;
}
}   
var nodoAdd;
var nodoCapsule;
var nodoMessErr1;
var totcapsule;
/* Core function */
function gestoreLoad(){
debugger;
try{
nodoAdd = document.getElementById("aggiunta");
nodoCapsule= document.getElementById("capsule");
nodoMessErr1 = document.getElementById("adderr");
nodoAdd.onclick = Add;
nodoCapsule.value = "";
var TextNodeErr_1= document.createTextNode("");
nodoMessErr1.appendChild(TextNodeErr_1);
}
catch(e){
alert("gestoreLoad " + e);
}
}
window.onload = gestoreLoad;
<body>
	<span id="adderr"></span>
	
	<input type="text" id="capsule" /> 
	<input type="button" id="aggiunta" value="Add"/> 
	


</body>

最新更新