我怎麼可以在另一個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的變化。它會幫助你。