網頁Web-Javascript-物件(object)-{ }與陣列(array)-[] 的抓值方式

  • 12369
  • 0
  • Web
  • 2023-07-13

1.物件類型 { }

  • 建立物件類型{屬性1:值1,屬性2:值2,屬性3:值3 }
  • 抓物件{ }裡面的值

2.陣列類型 [ ] 

  • 建立陣列類型 [值1,值2,值3 ]
  • 抓陣列整組資料
  • 抓陣列[]裡面的值

3.#物件(object)與陣列(array)抓值方式

1.物件類型 { }

建立物件類型{屬性1:值1,屬性2:值2,屬性3:值3 }

ff = {type:"apple", price:"500", color:"red"};

抓物件{ }裡面的值

ff.price

<html>

<body>

<h2>物件</h2>

<p id="box"></p>


</body>
</html>

<script>

ff = {type:"apple", price:"500", color:"red"};

console.log(ff);

document.getElementById("box").innerHTML = "水果 " + ff.price;

</script>

參考

https://codepen.io/yiruatstudio/pen/mdEjpbp

1.物件裡面的值分行寫會比較清楚

2.變數字串組合

<html>
<head>

<script type="text/javascript" src=""></script>

</head>
<body>

<h2>物件</h2>

<p id="box"></p>


</body>
</html>

<script>

ff = {
	type:"蘋果",
	price:500, 
	color:"紅色"
};

document.getElementById("box").innerHTML = 
ff.color+"的,水果之王:" +ff.type+",價錢"+ff.price+"元";

</script>

參考

 


2.陣列類型 [ ] 

建立陣列類型 [值1,值2,值3 ]

myname = ["yiru", "John", "May"];

抓陣列整組資料

myname

<html>
<body>

<h2>Arrays</h2>

<p id="box"></p>

</body>
</html>

<script>
myname = ["yiru", "John", "May"];

console.log(myname);

document.getElementById("box").innerHTML = myname;



</script>

參考

抓陣列[ ]裡面的值

myname[1]

<html>
<body>

<h2>Arrays</h2>

<p id="box"></p>

</body>
</html>

<script>
myname = ["yiru", "John", "May"];

console.log(myname);

document.getElementById("box").innerHTML = myname[1];


</script>

參考

https://codepen.io/yiruatstudio/pen/mdEjpBj

 


3.物件(object)與陣列(array)抓值方式

<html>
<body>

<h2>Arrays</h2>

<p id="box1"></p>
<p id="box2"></p>
<p id="box3"></p>
</body>
</html>
<script>
staff = {Name:"Jenny", addr:"Taipei", age:36};
console.log(staff);
document.getElementById("box1").innerHTML = "地區:"+staff.addr;
document.getElementById("box2").innerHTML = "員工姓名:"+staff["Name"];


member = ["yiru", "John", "May"];
console.log(member);
document.getElementById("box3").innerHTML = "主管:"+member[2];

</script>

參考

https://codepen.io/yiruatstudio/pen/eYzjyVz


 

Yiru@Studio - 關於我 - 意如