Question

我的解决方案（编辑：2015-12-08）：

// FIRST WE GET THE PARENT ELEMENT
var parentEstim = document.getElementById("onglet_estim");
// MAKE A TABLE OF HIS CHILD
var enfantsEstim = parentEstim.childNodes;
// KNOW HOW MANY CHILDREN THE PARENT ELEMENT HAVE WITH .length
var Nbenfants = enfantsEstim.length;
....
for (var i = 0; i <= Nbenfants; i++) {
      // IF THE CHILD ELEMENT [i] IS A HTML ELEMENT
      if (enfantsEstim[i].nodeType === 1) {
        enfantsEstim[i].lastChild.data = ''; // REMOVE LAST TEXT NODE
        enfantsEstim[i].classList.remove('isActive');
      }
      document.getElementById('onglet_estim').style.width = '220px';
      ClickedElement.className = 'isActive';
      // ADD NEW VALUE IN THE LAST TEXT NODE FOR THE CLICKED ELEMENT 
      ClickedElement.lastChild.data = ' Gares';
    }

DEMO：http://codepen.io/Zedash/details/pjMEMY

问题：

我有一点问题，我想更改链接<a>元素的最后一个文本节点子值。

例如，对于第一个链接，我们在其中看到单词“ Saisie ”，如果用户点击，我想删除此元素中的文本另一个链接，为点击的元素添加正确的文字。

function changeInputAdresse(ClassName) {
  if (ClassName.className !== 'isActive') {
    ClassName.className = 'isActive';
    switch(ClassName.id) {
      case 'linkGares' :
        ClassName.insertAdjacentHTML('beforeEnd',' Gares');
        ClassName.previousElementSibling.classList.remove('isActive');
        ClassName.nextElementSibling.classList.remove('isActive');
        ClassName.previousElementSibling.insertAdjacentHTML('beforeEnd','');
        ClassName.nextElementSibling.insertAdjacentHTML('beforeEnd','');
        break;
    }
  }
};
// THE CODE IS NOT FINISHED OF COURSE !

a {
  text-decoration:none;
  color:#000;
}

<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css" rel="stylesheet"/>
<a id="linkSaisie" class="isActive" href="#n" onclick="changeInputAdresse(this);"><i class="fa fa-map-marker"></i> Adresse</a>

<a id="linkGares" href="#n" onclick="changeInputAdresse(this);"><i class="fa fa-train"></i></a>

<a id="linkAeroports" href="#n" onclick="changeInputAdresse(this);"><i class="fa fa-plane"></i></a>

<a id="linkLoisirs" href="#n" onclick="changeInputAdresse(this);"><i class="fa fa-fort-awesome"></i></a>
<!--THE PART OF CODE WHERE I HAVE SOME PROBLEMS-->

谢谢你的配件！：）

Answer 1

您可以使用jQuery siblings

changeInputAdresse(element){
    element = $(element)
    if(!element.hasClass('isActive')){

        element.addClass('isActive');
        element.siblings().removeClass('isActive');

        element.text(element.attr('id').replace('link','')) //if that's the way you get value
        element.siblings().text('')
    }

}

Answer 2

我不太明白你想要的东西，但是在斜体之后定位和更改元素我将使用这个jQuery和vanilla JS组合：

$("#myLink").find(">i").get(0).nextSibling.nodeValue = "Changed text";

DEMO：http://jsfiddle.net/u9jq2bvy/

IIRC没有jQuery方法来定位文本节点，所以你需要一些原生的JS。如果我误解了这个问题，请告诉我，我会删除我的答案。

更新

根据评论，这是一个可能的解决方案。

$(document).on("click", ".myLink", function() {
  // clear all texts
  $(this).parent().find("a>span").text("");
  $(this).addClass("active");
  $(this).children("span").text("Active text");  
});

DEMO http://jsfiddle.net/u9jq2bvy/1

这是一个修改版本，只显示/隐藏跨度。

DEMO http://jsfiddle.net/u9jq2bvy/3/

如何更改JavaScript

我的解决方案（编辑：2015-12-08）：

问题：

2 个答案: