JS创建对象最常用的方法就是使用JSON格式的语法

最新推荐文章于 2024-07-07 03:41:16 发布
原创 最新推荐文章于 2024-07-07 03:41:16 发布 · 3.1k 阅读 · 1 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#json #javascript

本文介绍如何使用JSON格式组织数据，并通过JavaScript实现网页上的级联菜单功能。具体包括JSON的基本概念、数据结构示例及如何利用这些数据动态生成下拉菜单选项。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

这里只要简单的记住JSON的二个符号就OK

{} 代表一个对象

[] 代表数组，数组元素类型任意

写一个简单的json对象

var obj={

 name:"zhangsan",

 age:10,

 into:function(){alert(this.name+"   "+this.age)};

}; 

obj就是一个js的对象，该语法完全符合json的语法。

下面一个例子就是使用json格式的数据进行级联菜单的实现。

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
</head>
<body>
<select id="province" style="width:150px">
</select>
<select id="cities" style="width:150px">
</select>
<script type="text/javascript" src="cascade.js">
</script>
</body>
</html>

cascase.js

var data = [ {
id : 1,
name : "湖南",
cities : [ {
id : 11,
name : "衡阳"
}, {
id : 12,
name : "岳阳"
}, {
id : 13,
name : "花果山"
}, {
id : 14,
name : "尚阳"
} ]
}, {
id : 2,
name : "黑龙江",
cities : [ {
id : 21, 
name : "齐齐哈尔"
}, {
id : 22,
name : "大庆"
}, {
id : 23,
name : "佳木斯"
}, {
id : 24,
name : "宜春"
} ]
} ];


var province = document.getElementById("province");
var cities = document.getElementById("cities");
province.innerHTML="";
for ( var i=0,len=data.length;i<len;i++) {
var op=document.createElement("option");
op.value=data[i].id;
op.innerHTML=data[i].name;
province.appendChild(op);
}


province.onchange=function(){
cities.innerHTML="";
var showcities=data[province.value-1].cities;
for(var i=0,len=showcities.length;i<len;i++){
var op=document.createElement("option");
op.Value=showcities[i].id;
op.innerHTML=showcities[i].name;
cities.appendChild(op);
}
};







37.JavaScript对象与JSON格式的转换，JSON.stringify、JSON.parse方法的使用方法和注意事项
embelfe_segge的博客
07-28 1091
在之前的文章中，我们讲到每个对象都有的toString方法，当进行格式转换时会自动调用。和toString一样，对象的toJSON方法会在序列化的时候调用，我们可以通过重写这个方法改变序列化的方式。name'peter',age18}}代码执行结果我们可以看到，在重写了对象的toJSON方法后，使用stringify的结果发生了改变。我们可以根据自己的需要重写toJSON方法，从而达到自己的目的。JSON是一种数据格式，有独立的标准和大多数编程语言的支持httpshttps。...
json对象的创建和解析
12-01
json对象的创建和解析，java的json对象实例
JSON法创建对象
04-18
JSON法创建对象
使用 JSON 创建对象
withyou
09-11 260
    作者：Flyingis    一般在JavaScript中可以调用Object类的构造函数来创建对象：var obj = new Object();     并且可以将对象附加到其他对象上，类似于C++中的对象数组，例如，某大学里拥有多个专业，每个专业都有一位主任和多名讲师组成，在JavaScript中可以这样来描述：var university = new Object...
JavaScript创建JSON对象
weixin_30482181的博客
05-07 673
JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式。易于人阅读和编写。同时也易于机器解析和生成, JSON采用完全独立于语言的文本格式，这些特性使JSON成为理想的数据交换语言。 JSON 语法 数据使用键名/值对表示，键名是字符串，值没有限定...
在 JavaScript 中创建 JSON 对象
10-06 181
&lt;html&gt; &lt;body&gt; &lt;h2&gt;在 JavaScript 中创建 JSON 对象&lt;/h2&gt; &lt;p&gt; Name: &lt;span id="jname"&gt;&lt;/span&gt;&lt;br /&gt; Age: &lt;span id="jage"&gt
js中json法创建对象（json里面的:相当于js里面的=）
weixin_34289744的博客
05-16 598
js中json法创建对象（json里面的:相当于js里面的=） 一、总结 json里面的:相当于js里面的= 4、json创建js对象解决命名冲突：多个人为同一个页面写js的话，命名冲突就有可能发生，比如多个js文件里都有一个get()方法，调用的时候就不知道是哪个     二、js中json法创建对象 JSON 法创建对象 JSON非常易于人阅读与编写，同时利于机器解析与生成...
json格式的javascript对象用法分析
10-22
JSON常被用于网络数据交换，其与javascript对象关系密切，因为JSON格式和JavaScript对象语法非常相似，使得JavaScript程序可以很方便地处理JSON数据。 在JavaScript中，一个对象可以被简单地看作是一个属性的无序集...
详解js中Json的语法与格式
10-21
JavaScript中JSON的语法与格式是数据交换中常用的一种格式，其简洁性和易读性使其在前端和后端的数据交互中占据重要位置。...以上就是关于js中Json语法与格式的详细知识点介绍，希望能帮助到有需要的开发者。
jQuery Json数据格式排版高亮插件json-viewer.js使用方法详解
10-19
jQuery json-viewer.js插件是一款专门为处理JSON数据格式而设计的jQuery插件，它允许开发者在网页上以更易读的格式展示JSON对象，并且提供了节点展开/收缩以及语法高亮等辅助功能。这种插件对于Web开发者来说是非常...
把json格式的字符串转换成javascript对象或数组的方法总结
10-21
在实际开发中，`JSON.parse`是最常用且安全的方法，除非有特殊需求，否则应避免使用`eval`和通过`new Function`来解析JSON字符串。同时，确保服务器返回的数据是安全的JSON格式，以防止潜在的安全攻击。 总的来说，...
JavaScript 生成json对象
最新发布
weixin_40800470的博客
07-07 262
数组相关视频讲解：数组-Go代码演示数据结构与算法-栈-Go代码演示版如何使用JavaScript生成JSON对象 在Web开发中，JSON（JavaScript Object Notation）是一种轻量级的数据交换格式，常用于前后端数据传输。而在JavaScript中，我们经常需要生成JSON对象来进行数据处理和传...
JSON对象的创建
热门推荐
xiaobangdesk的博客
04-05 1万+
在创建JSON对象的时候，首先必须要导入org.json的依赖，然后可以通过三种方式创建JSON对象，分别是利用JSONObject类创建JSON对象，利用Map来构建JSON对象以及利用JavaBean来构建JSON对象。三种创建对象的代码如下：    //通过Map的形式构建JSONpackage com.json; import org.json.JSONObject; import ja...
使用JSON创建对象
weixin_30600503的博客
04-17 131
Jason（JavaScript Object Notation，JavaScript对象表示法） function sayLoudly() { alert(this.firstName.toUpperCase()); } var newObject = {//每个子对象间用,分割 firstName : "frank...
使用json数据创建对象
yangyabing2020的博客
03-08 898
JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式。易于人阅读和编写。同时也易于机器解析和生成, JSON采用完全独立于语言的文本格式，这些特性使JSON成为理想的数据交换语言。 JSON 语法 数据使用键名/值对表示，键名是字符串，值没有限定； 例如 “language”:”Java” 每个数据之间由逗号分隔； 使用大括号保存对象，对象可以包含若干个数据...
使用JSON语法创建JS对象(重要)
weixin_33832340的博客
08-13 204
　　JS对象的键值可以加单引号或者不加或者加双引号 　　JSON语法提供了一种更简单的方式来创建对象，可以避免书写函数，也可避免用new关键字，可以直接创建一个JS对象，使用一个花括号，然后将每个属性写成"key:value"的形式。 　　从JavaScript1.2开始，创建对象有了一种更快捷的语法: 　　格式如下: var p = { ...
JSON学习1——JavaScript 创建 JSON 对象
weixin_45890771的博客
11-16 1488
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>菜鸟教程(runoob.com)</title> </head> <body> <h2>JavaScript 创建 JSON 对象</h2> <p> 名称: <span id="name"></span><br /> 座.
使用 JSON 语法创建对象
qq_40641206的博客
02-06 677
JSON 格式的数据交换具有轻量级、易理解、跨语言的优势。 使用 JavaScript 创建一个对象 //定义一个函数，作为构造器 function Person(name, sex){ this.name= name ; this.sex= sex; } //创建一个 Person 实例 var p = new Per...
js动态创建json对象
LONGSHAN123456789的博客
04-16 721
{ "name":"test","table":["date:"2016-10-10","age":"10"],"array":[0,1,2]} var json={ "name":"test","table":["date:"2016-10-10","age":"10"],"array":[0,1,2] }
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值