javascript子级,JAVASCRIPT开发工程师招聘

如何用原生js实现点击子级a标签给父级div添加class再点击就移除class

!DOCTYPE html

html

 head

  title测试页面2/title

  meta charset="UTF-8"/

  style

   .tdiv{

    border:2px solid;

   }

  /style

  script

   function test(ele){

    var pDiv=ele.parentNode;

    if(pDiv.className==" "){

     pDiv.className="tdiv";

    }else{

     pDiv.className=" ";

    }

   }

   //还可以用classList，这种方法更流畅

   function test2(ele){

        var pDiv=ele.parentNode;

        if(pDiv.classList.contains("tdiv")){

             pDiv.classList.remove("tdiv");

        }else{

             pDiv.classList.add("tdiv");

        }

       }

  /script

 /head

 body

  div

   a onclick="test(this)"测试/a

  /div

 /body

/html

相关问答

Q1: js通过id获取元素的子级元素的奇怪现象

这是因为ID是具有全局唯一性的，也就是说同一个页面是不允许出现相同ID的元素的（当然你在html中可以设定相同的id，但js只能定位到第一个），所以要想通过id来获取页面元素，只需要全局定位（即document.getElementById）即可，不需要在子元素中再来进一步定位。事实上，正是因为上述原因，getElementById是document对象的特有方法，其他对象是没有这个方法的，这就是为什么list.getElementById会提示说不是函数的原因！

Q2: 如何用js获取子级iframe页面里的变量

方法只有一种：

步骤：

1、获取iframe节点

2、获取iframe中的变量

示例

1

2

3

4

5

6

7

8

9

a.html

iframe

id='x'

name='x'

src='b.html'/

b.html

script

var

y='1';

/script

在a.html中获取y，则可以通过以下方式

document.frames['x'].y

//先获取frame,在获取y

Q3: JavaScript怎么获取一个元素的父级元素？以及子级元素

html代码：

div id="test"

div/div

div/div

/div

js代码：

script

function dom() {

var s= document.getElementById("test");

del_ff(s); //清理空格

var chils= s.childNodes; //得到s的全部子节点

var par=s.parentNode; //得到s的父节点

var fc=s.firstChild; //获得s的第一个子节点

var lc=s.lastChile; //获得s的最后一个子节点

}

/script

建议：使用jquery来获取父级节点跟子级节点会更方便。