jQuery addClass到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()。
• 普通JavaScript：
  • Array.length。
  • Array.join()。
  • Array.push()。
  • Conditional Operator/ternary operator。
  • Element.className。
  • Object.prototype。
  • String.push()。

Answer 2

jQuery没有加载到这个小提琴中。

此外，您没有将代码包装在document.ready()函数中，因此可能无法以您希望的方式执行。确保从右侧的“Frameworks＆amp; Extensions”下拉列表中选择jQuery。此外，请务必记得检查浏览器的控制台以查看是否存在错误，这是一个很好的理智检查。一直发生在我身上:)）

<强> JS

$(function(){

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

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

}); // end ready