我怎么可以在另一个DIV添加CSS样式为一个div当我点击一个按钮

Question

我'尝试添加一些CSS样式一个div文本，当我在另一个DIV点击一个按钮

这里我的HTML代码

<div class="row" id="target"> 
    <h2>{{txt}} </h2> 
</div> 


<div class="row"> 
    <button my-dir>Click Me</button> 
</div> 

我的js代码

.directive('myDir', function() { 
    return { 
    restrict: 'A', 

    link: function (scope, elem, attr) { 
     console.log(elem); 
     elem.bind('click', function (e) { 
     console.log("coming"); 
     elem.find('#target').css({ 
      backgroundColor: 'red' 
     })  

     // angular.element(e.target).siblings('#target').addClass('clr'); 
     }); 

    } 
    } 
}); 

我的问题是，当我在一个双按钮点击V CSS样式必须申请另一个div使用指令，我尝试了类似上面的内容，但没有奏效。

在此先感谢

Answer 1

elem将参考button。所以elem.find('#target')将寻找#target内elem

你可以这样做

elem.bind('click', function (e) { 
     $('body').find('#target').css({ 
      backgroundColor: 'red' 
     })  
}); 

Answer 2

，如果你的元素ID是唯一的和不可更改，则可以将其简化为如下

elem.bind('click', function() { 
     $('#target').css('backgroundColor','red'); 
}); 

elem.find会发现所有的ID与ID包含'目标'，尝试使用唯一的ID的所有div的变化。它会帮助你。