<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script>
</script>
<style type="text/css">
</style>
<script type="text/javascript" src="js/jquery-1.11.3.min.js" ></script>
<script type="text/javascript">
var obj={
name:"八戒",
age:"500",
title:'X',
sellers:['A','B'],
getDom:function(){
console.log(this)
/*
btn1方式this指向obj对象，可以直接读取obj里面的变量
btn2方式this指向"<button id="btn2">按钮2</button>"
btn3方式this指向"<button id="btn3">按钮3</button>"
btn4方式this指向"<button id="btn4" onclick="console.log(this)">按钮4</button>"
btn5方式this指向"<button id="btn5">按钮5</button>"
*/
}
}
$(document).ready(function(){
document.getElementById('btn1').addEventListener('click',function(){
obj.getDom();
})
document.getElementById('btn2').onclick = obj.getDom
document.getElementById('btn3').addEventListener('click', obj.getDom)
$("#btn5").on("click", obj.getDom)
});
</script>
</head>
<body>
<button id="btn1">按钮1</button>
<button id="btn2">按钮2</button>
<button id="btn3">按钮3</button>
<button id="btn4" onclick="console.log(this)">按钮4</button>
<button id="btn5">按钮5</button>
</body>
</html>
