Сравнение innerHTML с JQuery

Я пытаюсь изменить фон <p> в соответствии с его контактом (innerHTML), но я не могу заставить его работать.Сравнение innerHTML с JQuery

<head> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script> 
<script> 
$(document).ready(function(){ 
    $("button").click(function(){ 
     if ($("p").innerHTML === "just a test"){ 
      $("p").css("background","yellow"); 
     } 
    }); 
}); 
</script> 
</head> 
<body> 

<p>just a test number1</p> 
<p>just a test number2</p> 
<p>just a test</p> 

<button>Execute</button> 

</body>

Я ожидал, что только последний <p> фон, чтобы изменить, но ничего не происходит, почему?

источник

2015-02-11 Al.s

Включите скрипку. – Complexity

Пожалуйста, не включайте скрипку. Возможно, вы захотите использовать функцию Stackoverflow Snippet, чтобы превратить ваш код в живую демонстрацию. – Quentin

На объекте jQuery нет innerHTML, поэтому $("p").innerHTML === "just a test" всегда будет false.

Вы можете использовать .html() вместо этого, но это всегда будет возвращать данные из первых элемента, который соответствовал селектору, поэтому он все равно всегда будет false.

Даже если бы это было не так, $("p").css("background","yellow"); установил бы фон все параграфы.

Вам необходимо перевернуть все элементы и проверить поочередно.

$(document).ready(function() { 
 
    $("button").click(function() { 
 
    $("p").each(function(index, paragraph) { 
 
     var $p = $(paragraph); 
 
     if ($p.html() === "just a test") { 
 
     $p.css("background", "yellow"); 
 
     } 
 
    }); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<p>just a test number1</p> 
 
<p>just a test number2</p> 
 
<p>just a test</p> 
 

 
<button>Execute</button>

источник

2015-02-11 14:37:37 Quentin

InnerHtml является свойством JavaScript, он не принадлежит в JQuery.

Вы должны изменить это:

$("p").innerHTML === "just a test"

к этому:

$("p").html() === "just a test"

Во-вторых селектор р достаточно велик, EXPECIALLY, что вы не называть его образуют какой-либо элемент, но и в глобальном масштабе. Я бы посоветовал использовать какой-то класс или идентификатор, если это возможно.

В-третьих, я бы с таким исправлением к вашему Алгоритм:

$("p").each(function(){ 
    var el = $(this); 
    if(el.htlm() === 'just a test'){ // could change for regexp (bevare of white characters) 
     el.css("background","yellow") 
    } 
});

Таким образом, для каждого элемента р, что внутренний HTML является «просто тест» вы будете менять цвет фона.

источник

2015-02-11 14:44:59 Beri

Сравнение innerHTML с JQuery

ответ

Смежные вопросы