предупреждения, когда значение вара равно ДИВО

Question

я пытаюсь показать предупреждающее сообщение, когда мой Javascript var равно div значения, вот что я пытаюсь здесь:

function checkmydiv() { 
    var ElementCssClass = document.getElementById("Target"); 
    if (ElementCssClass == "hello") 
    { 
     alert("the div has a value"); 
    } 
​}​ 

вот мой HTML код

<div id="Target" >hello</div> 

<input type="button" value="bader" onclick = "checkmydiv();" />​ 

я не знаю, откуда я пойти не так, ничего всплывающее окно при нажатии кнопки bader

оценил всю помощь :)

Answer 1

Вам нужно получить текстовое содержимое этого элемента. Прямо сейчас, вы сравниваете ссылку на объект с hello, которая, очевидно, не будет работать.

if (ElementCssClass.textContent == "hello") { 
} 

- это то, что вы ищете.

Одно слово предостережение: .textContent поддерживается всеми современными браузерами (= последние версии). Однако старая версия IE может не распознать это свойство. Таким образом, вы можете либо сделать что-то вроде

var myText = ElementCssClass.textContent || ElementCssClass.text; 

, а затем сравнить значение из myText против hello или просто использовать ElementCssClass.innerHTML. Я предпочел бы прежнее решение, потому что использование .innerHTML может привести к неприятностям в других ситуациях.

Answer 2

Проблема в том, что переменная ElementCssClass теперь является узлом/объектом DOM, а не строкой; вам нужно использовать innerHTML или, если поддерживается, innerText или textContent:

function checkmydiv() { 
    var ElementCssClass = document.getElementById("Target").innerHTML; 

    if (ElementCssClass == "hello") { 
     alert("the div has a value"); 
    } 
}​ 

JS Fiddle demo.

Кроме того, только для хорошей практики, возможно, я рекомендую отходя от в линии JavaScript:

function checkmydiv() { 
    var ElementCssClass = document.getElementById("Target"); 

    if (ElementCssClass.innerHTML == "hello") { 
     alert("the div has value"); 
    } 
} 

var input = document.getElementsByTagName('input'); 
for (var i = 0, len = input.length; i < len; i++) { 
    if (input[i].value == 'bader') { 
     input[i].onclick = function() { 
      checkmydiv(); 
     } 
    } 
}​ 

JS Fiddle demo.

И уменьшить необходимость жесткого кода элементов/текстовый контент для сравнения, вы можете передать аргументы в функцию:

function checkmydiv(id, str) { 
    var ElementCssClass = document.getElementById(id); 

    if (ElementCssClass.innerHTML == str) { 
     alert("the div has value"); 
    } 
    else { 
     alert("the div does not have the value."); 
    } 
} 

var input = document.getElementsByTagName('input'); 
for (var i = 0, len = input.length; i < len; i++) { 
    if (input[i].value == 'bader') { 
     input[i].onclick = function() { 
      checkmydiv('Target', 'hello'); 
     } 
    } 
    else if (input[i].value == 'bilder') { 
     input[i].onclick = function() { 
      checkmydiv('Target', 'some other string'); 
     } 
    } 
}​ 

JS Fiddle demo.

Ссылки:

• innerHTML.
• innerText.
• textContent.