Question

我想将h4标签中的文本更改为其祖父母div的类名，即（sds 2016 gwap）。

   <div class="grid">
      <div class="office-year-function sds 2016 gwap">
          <div class="content cell-child">
               <img src="535/img/01.jpg" alt="" width="312px" height="160px">
          </div>
           <div class="img-hover cell-child">
                 <br/>
                 <h3>GWAP Kick-off Ceremony</h3>
                 <h3>2016</h3>
                 <h4></h4>

当文档完成加载时，它将运行以下功能。

function changeTag() {
    for (var i = 1; i <= $('.office-year-function').length; i++) {
        $this = $('div.grid  div.office-year-function:nth-child(' + i + ')');
        var className = $this.attr('class');
        className = className.split(" ");

        for (var j = 1; j < className.length; j++) {
            className[j] = className[j].replace("-", " ");

            if (className[j] == "gwap") {
                $this.find("h4").html += className[j].toUpperCase();
            } else {
                $this.find('h4').html += className[i].capitalize();
            }
        }
    }

}

但

中存在错误

$this.find("h4").html+=className[j].toUpperCase();
$this.find('h4').html+=className[i].capitalize();

我的代码出了什么问题？

Answer 1

您当前的实现不起作用，因为.html()是一个函数，您将其视为属性。您可以使用[0]获取底层DOM元素和使用innerHTML属性。

 $this.find("h4")[0].innerHTML +=className[j].toUpperCase();

但是，使用.append()可以获得所需的结果。

function changeTag() {
    for (var i = 1; i <= $('.office-year-function').length; i++) {
        $this = $('div.grid  div.office-year-function:nth-child(' + i + ')');
        for (var j = 1; j < className.length; j++) {
            className[j] = className[j].replace("-", " ");
            if (className[j] == "gwap") {
                $this.find("h4").append(className[j].toUpperCase());
            } else {
                $this.find("h4").append(className[i].capitalize());
            }
        }
    }
}

Answer 2

我建议使用jquery的.text（text）代替.append（）进行跟踪，选择是你的。

function changeTag() {
    for (var i = 1; i <= $('.office-year-function').length; i++) {
        $this = $('div.grid  div.office-year-function:nth-child(' + i + ')');
        for (var j = 1; j < className.length; j++) {
            className[j] = className[j].replace("-", " ");
            if (className[j] == "gwap") {
                $this.find("h4").text(className[j].toUpperCase());
            } else {
                $this.find("h4").text(className[i].capitalize());
            }
        }
    }
}

根据文件：http://api.jquery.com/append/

在处理DOM元素时使用

.append（）。

根据您当前的要求，您只需要将h4标签的内容更新为祖父母div的班级名称。

因此，文本（文本）就足够了。

将匹配元素集中每个元素的内容设置为指定文字。

Jquery选择器在div下选择一个h4标签

2 个答案: