vue中 $event 的用法--獲取當前父元素，子元素，兄弟元素

<button @click = “clickfun($event)”>點擊</button>

  

methods: {

clickfun(e) {

// e.target 是你當前點擊的元素

// e.currentTarget 是你綁定事件的元素

     #獲得點擊元素的前一個元素

     e.currentTarget.previousElementSibling.innerHTML

     #獲得點擊元素的第一個子元素

     e.currentTarget.firstElementChild

     # 獲得點擊元素的下一個元素

     e.currentTarget.nextElementSibling

     # 獲得點擊元素中id為string的元素

     e.currentTarget.getElementById("string")

     # 獲得點擊元素的string屬性

     e.currentTarget.getAttributeNode('string')

     # 獲得點擊元素的父級元素

     e.currentTarget.parentElement

     # 獲得點擊元素的前一個元素的第一個子元素的HTML值

     e.currentTarget.previousElementSibling.firstElementChild.innerHTML

  

     }

         },

 

-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

js修改元素的屬性

<script type="text/javascript">

//給id為nice的元素 添加title屬性並賦值為"測試title"
function addTitle(){
　　document.getElementById('nice').setAttribute("title","測試title");
}

//給id為nice的元素 刪除 title屬性
function delTitle(){
　　document.getElementById('nice').removeAttribute("title");
}

//獲取id為nice的元素 title屬性的值
function getTitle(){
　　var value=document.getElementById('nice').getAttribute("title");
　　alert('title的屬性值為:'+value);
}

//jq方式刪除、設置元素屬性,為了更加形象些對比，這里采用嵌入式方式,沒有進行js html分離
function a(){
　　alert('測試jq添加onclick屬性');
}

//jq方式給id為nice的元素 添加onclick="a();"de 屬性
function jqAddOnclick(){
　　$("#nice").attr("onclick","a();");
}

//jq方式獲取id為nice的元素 onclick屬性值
function jqGetOnclick(){
　　var value=$("#nice").attr("onclick");
　　alert('onclick屬性值為:'+value);
}

//jq方式刪除id為nice的元素 onclick屬性
function jqDelOnclick(){
　　$("#nice").removeAttr("onclick");
}
</script>