溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
JavaScript如何實現訪問對象的屬性？很多新手對此不是很清楚，為了幫助大家解決這個難題，下面小編將為大家詳細講解，有這方面需求的人可以來學習下，希望你能有所收獲。
我們先來看一下格式
(對象的實例名稱).(屬性名稱)
我們來看具體的示例
代碼如下
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script type="text/javascript">
function product() {
this.name = "LemonCandy";
this.price = 150;
this.getInfo = function(){
return this.name + " = \\" + this.price;
}
}
window.onload = function onLoad() {
target = document.getElementById("output");
prod = new product();
target.innerHTML = "name:" + prod.name + "<br/>";
target.innerHTML += "price:" + prod.price + "<br/>";
}
</script>
</head>
<body>
<div id="output"></div>
</body>
</html>說明
function product() {
this.name = "LemonCandy";
this.price = 150;
this.getInfo = function(){
return this.name + " = \\" + this.price;
}
}上面的代碼是對象的定義，在這個例子中，我們實現了name，price屬性和getInfo（）方法。
window.onload = function onLoad() {
target = document.getElementById("output");
prod = new product();
prod.name = "LemonCandy2";
target.innerHTML = "name:" + prod.name + "<br/>";
target.innerHTML += "price:" + prod.price + "<br/>";
}加載頁面時，執行上面的代碼。
prod = new product();
創建對象的實例。
prod.name = "LemonCandy2";
(對象的實例名稱).(屬性名稱)用于訪問對象的屬性。要為屬性設置值，需要通過替換設置屬性值
target.innerHTML = "name:" + prod.name + "<br/>";
target.innerHTML += "price:" + prod.price + "<br/>";(對象的實例名稱).(屬性名稱)用于訪問對象的屬性。屬性的值顯示在頁面上。
運行結果
當Web瀏覽器顯示上述HTML文件時，將顯示如下所示的效果。可以確認設定的屬性值和從屬性中獲取值。
接下來我們再來看一個例子
代碼如下
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script type="text/javascript">
var obj = {
name: "LemonCandy",
price: 150,
getInfo: function () {
return this.name + " = \\" + this.price;
}
}
window.onload = function onLoad() {
target = document.getElementById("output");
obj.name = "LemonCandy2";
obj.price = 220;
target.innerHTML = "name:" + obj.name + "<br/>";
target.innerHTML += "price:" + obj.price + "<br/>";
}
</script>
</head>
<body>
<div id="output"></div>
</body>
</html>說明
var obj = {
name: "LemonCandy",
price: 150,
getInfo: function () {
return this.name + " = \\" + this.price;
}
}上面的代碼是對象的定義。在這個例子中，我們實現了name，price屬性和getInfo（）方法。它是以簡單的格式編寫的。
window.onload = function onLoad() {
target = document.getElementById("output");
obj.name = "LemonCandy2";
obj.price = 220;
target.innerHTML = "name:" + obj.name + "<br/>";
target.innerHTML += "price:" + obj.price + "<br/>";
}加載頁面時，執行上面的代碼。代碼與例1中的代碼相同，處理內容相同。因為使用的是簡單的類型的對象定義的格式，不存在由new命令創建一個實例部分這與例1中的代碼不同。
運行結果
當Web瀏覽器顯示上述HTML文件時，將顯示如下所示的效果，確認可以將值設置為屬性并從屬性中獲取值。
看完上述內容是否對您有幫助呢？如果還想對相關知識有進一步的了解或閱讀更多相關文章，請關注億速云行業資訊頻道，感謝您對億速云的支持。
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
