jQuery addClass to h1

Question

Я пытаюсь добавить класс к элементу h1 на основе текста, который находится внутри элемента h1.

var title = $("h1").text(); 
if (title == "Welcome") { 
$("h1").addClass("hide"); 
} 

http://jsfiddle.net/4LjnT/

Answer 1

Я предлагаю:

$('h1').addClass(function(){ 
    return $(this).text() == 'Welcome' ? 'hide' : ''; 
}); 

JS Fiddle demo.

Или, чтобы уменьшить ненужные вызовы JQuery:

$('h1').addClass(function(){ 
    return (this.textContent || this.innerText) == 'Welcome' ? 'hide' : ''; 
}); 

JS Fiddle demo.

И я может было несколько минут, чтобы убить, что привело к этому JavaScript Альтернативой равнине:

Object.prototype.textToClass = function(needle,classToAdd){ 
    var len = this.length, 
     classes = [], 
     txt; 
    for (var i=0; i<len; i++){ 
     txt = this[i].textContent || this[i].innerText; 
     if (txt == needle){ 
      classes = this[i].className.split(/\s/); 
      classes.push(classToAdd); 
      this[i].className = classes.join(' '); 
     } 
    } 
    return this; 
}; 

document.getElementsByTagName('h1').textToClass('Welcome','hide'); 

JS Fiddle demo.

Ссылки:

• JQuery
  • addClass().
• Plain JavaScript:
  • Array.length.
  • Array.join().
  • Array.push().
  • Conditional Operator/ternary operator.
  • Element.className.
  • Object.prototype.
  • String.push().

Answer 2

JQuery не загружен в этой скрипке.

Также вы не заворачиваете свой код в функцию document.ready(), поэтому существует риск, что он не может быть выполнен так, как вы хотите. Не забудьте выбрать jQuery из раскрывающегося списка «Frameworks & Extensions» справа. Кроме того, всегда помните, чтобы проверить консоль вашего браузера, чтобы увидеть, есть ли ошибки, это хорошая проверка правильности таких вещей. Случается со мной все время:)

JS

$(function(){ 

    var title = $("h1").text(); 

    if (title === "Welcome") { 
    $("h1").addClass("hide"); 
    } 

}); // end ready