Limite em adição de campos

Pessoal uso um script que adiciona campos a um formulario.

minha duvida e que o usuario so pode adicionar no maximo 10 campos.

como faço para bloquear a quantidade?

codigo que uso e esse:

<script type="text/javascript">
var qtdeCampos = 0;

function addCampos() {
var objPai = document.getElementById("campoPai");
//Criando o elemento DIV;
var objFilho = document.createElement("div");

//Definindo atributos ao objFilho: objFilho.setAttribute("id","filho"+qtdeCampos);

//Inserindo o elemento no pai:
objPai.appendChild(objFilho);
//Escrevendo algo no filho recém-criado:

document.getElementById("filho"+qtdeCampos).innerHTML = "<table width='100%' border='0'><tr><td width='10%' class='style12'><input type='text' name='quantidade[]' size='6'></td><td width='35%' class='style12'><input type='text' name='equipamento[]' size='40'></td><td width='34%' class='style12'><input type='text' name='descricao[]' size='40'></td><td width='13%' class='style12'><input type='text' name='valor[]' size='10' onkeypress='mascara(this,mvalor)'></td><td width='8%' class='style12'><input type='button' onclick='removerCampo("+qtdeCampos+")' value='Apagar'></td></tr></table>";
qtdeCampos++;
}

function removerCampo(id) {
var objPai = document.getElementById("campoPai");
var objFilho = document.getElementById("filho"+id);

//Removendo o DIV com id específico do nó-pai:

var removido = objPai.removeChild(objFilho);
}
</script>

<div id="campoPai"><img src="imgsfinanceiro/separacao.png" alt="" width="10" height="10" /></div>
 <input type="button" value="Adicionar Itens no Orçamento" onClick="addCampos()">