读取xml文件，制作下拉框

最新推荐文章于 2021-08-05 17:01:23 发布
最新推荐文章于 2021-08-05 17:01:23 发布
阅读量1.3k 收藏
点赞数
CC 4.0 BY-SA版权
分类专栏： java
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/magic_zz/article/details/17751641
本文介绍如何使用jQuery从XML文件中读取数据，并利用这些数据生成下拉菜单选项，适用于多种浏览器。

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

1、jquery读取xml文件,制作下拉框，支持ie、火狐、谷歌等各种浏览器 

<html>
<head>
<script type="text/javascript"src="/scripts/jquery-1.4.2.min.js"></script>
</head>
<body> 
 $.ajax({
          url: 'dept.xml',
          dataType: 'xml',
          success: function(data){
              //console.log(data);
              $(data).find("dept").each(function() {
                    
                  var dept=$(this);
                  var id=dept.find("id").text();
                  var name=dept.find("name").text();
                  $("#byDept").append('<optionvalue='+id+'>'+name+'</option>');
              });
          }
      });
       <select id="byDept"name="byDept">
            <optionvalue="0">请选择</option>
       </select>
<body>
</html>

dept.xml文件如下：

<?xml version="1.0"encoding="UTF-8"?>
<depts>
  <dept>
   <id>1</id>
   <name>a</name>
  </dept>
  <dept>
   <id>2</id>
   <name>b</name>
  </dept>
  <dept>
   <id>3</id>
   <name>c</name>
  </dept>
  <dept>
   <id>4</id>
   <name>d</name>
  </dept>
  <dept>
   <id>5</id>
   <name>e</name>
  </dept>
  <dept>
   <id>6</id>
   <name>f</name>
  </dept>
</depts>
自动化处理--python读取XML格式文件
weixin_41885845的博客
06-16 458
XML文件是比较标准化格式的文件，易于读取和写入，因此较为适用于自动化处理；
Winform C# 从省市区的xml文件中读取的三级联动下拉选项实现
09-10
在本文中，我们将深入探讨如何使用C# Winform来实现一个从XML文件中读取的省市区三级联动下拉选项。这个功能对于许多需要展示地理位置信息的桌面应用程序来说非常实用。我们将详细介绍整个过程，包括XML文件的结构、...
xml城市下拉框联动
05-25
xml城市下拉框联动,xml城市下拉框联动,xml城市下拉框联动
Javascript 调用XML制作连动下拉框
weixin_34054866的博客
10-22 131
Javascript 调用XML制作连动下拉框 作者： 何耀Thursday, June 5 2003 2:44 PM 传统的HTML页面中连动下拉框采用了两种方法：1）直接将下拉框中的内容hardcode于html的javascript中，调用javascript函数循环写入下拉框中。这种方法不...
利用xml数据岛实现多级关联下拉选择框的做法
qiushuiwuhen的专栏
07-22 1957
var arrSel=["year","month","date","clock"];//arrSel定义了要修改的下拉框和xml数据的节点名称                                                                                                         function qswhXml(
js操作xml实现下拉框联动
qqlxx的专栏
03-27 2196
好久没写啦，懒啊。今天写点吧，希望对需要的人有帮助 http://www.w3.org/1999/xhtml" >    Untitled Page        var oSelProvince;    var oSelCity;    function LD()    {        var xmlDoc = new ActiveXObject("Microsoft.XMLDOM"); 
html下拉菜单读取xml,读取xml文件，制作下拉框
weixin_32239523的博客
07-01 428
1、jquery读取xml文件,制作下拉框，支持ie、火狐、谷歌等各种浏览器 $.ajax({ url: 'dept.xml',dataType: 'xml',success: function(data){ //console.log(data); $(data).find("dept").each(...
js+xml生成级联下拉框代码
10-28
2. **JavaScript处理逻辑**：用于读取XML数据并动态更新下拉框。 3. **DOM操作**：用于添加或修改HTML元素（如option）。 #### 三、XML数据结构 首先，我们需要准备一个XML文件来存储省份及其对应的城市信息。这里...
js+xml生成级联下拉框代码.docx
01-19
以上代码展示了如何使用JavaScript读取XML文件并动态生成级联下拉框，同时处理了默认选中项的问题。在实际项目中，你可能需要根据具体需求调整代码，例如添加错误处理、优化性能或增加更多交互效果。此外，现代前端...
XML实现城市下拉框动态联动技术解析
### 知识点：XML城市下拉框联动 #### 一、基础概念 ##### 1. XML简介 XML（Extensible Markup Language，可扩展标记语言）是一种标记语言，用于存储和传输数据。它与HTML类似，但与HTML不同的是，XML旨在描述数据...
AS3+xml下拉菜单_下拉弹出框菜单
04-22
AS3+xml下拉菜单_下拉弹出框菜单 贵是贵了点，但值得下
ajax下拉框联动 修改信息实例,AJAX解析XML实例之下拉框省、市二级联动
weixin_39743695的博客
08-05 181
这个例子是实现省、市二级联动，当选择某一省时，改省下面的市就会在另一个下拉框显示出来。在本例中AJAX通过解析XML文件得到的数据传回到jsp页面，其中省市均是从数据库取到的值：jsp页面代码：String path = request.getContextPath();String basePath = request.getScheme()+"://"+request.getServerNam...
基于XML的下拉菜单（源代码）
weixin_33735077的博客
12-30 295
以前曾看到过有人写出这样的菜单，可是自己却没有源代码，放假的时候，闲着没事，就自己写了一个，并把它制成了服务器控件。这里我用到了六个文件，当然你可以把某些文件合并，以减少耦合，我的用意是将各种不同的代码分离。在写的过程中，遇到了很多问题，不知道大家又没有碰到过，希望各位注意。好了，下面切入正题！1、服务器控件制作：基于Xml的下拉菜单xml文件为：&lt;?xml version="1.0" en...
XML做下拉列表
weixin_30791095的博客
05-18 704
5-18X.php主页面 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <...
xml填充下拉列表
bestlanli的专栏
05-11 459
private function readNation():void{ var array:Array = this.tiles.getChildren(); var loader:URLLoader = new URLLoader(); loader.addEventListener(Event.COMPLETE,loadNation); loader.l...
asp使用xml文件实现联动下拉框
firstaking的专栏
06-10 1239
asp网页调用xml文件，实现两个下拉框的联动。//调用xml文件函数function loadxml(filepath)    {      var oDom=new ActiveXObject(Microsoft.XMLDOM);          oDom.async=false;          oDom.load(filepath);        if(oDom == null)
利用xml实现多级关联下拉选择框
menjoy的专栏
12-23 379
&lt;script&gt;var arrSel=["year","month","date","clock"];//arrSel定义了要修改的下拉框和xml数据的节点名称&lt;/script&gt; &lt;script&gt;function qswhXml(num){/******* by qiushuiwuhen(2002-5-17) ********/ va
javascript+xml实现二级下拉菜单，不会被任何标签或元素遮住
流氓地带
07-31 1240
一、简单说明该菜单最大的优点是可以跨过网页上任何标签，甚至是框架，（一般的菜单会被select,object,flash等挡住）所以如果你有这方面的需要，那么这个菜单是个很好的选择。总体而言，它有如下特性：（1）菜单的样式和数据都是通过xml配置（2）菜单的样式可以随心所欲修改，如：     #DDDDDD     url(menu_bg.jpg)     10pt     #0000
js实现xml的多级联动下拉框
05-15 141
另外发现有人说用树的方式会更灵活和方便，如图     花了半天时间实现一个多级联动下拉框，目的是对某一植物进行“门纲目科属”的归类。使用的技术是javascript+xml，之所以不用数据库，一来这 方面的数据虽然量大但都是固定不变的，二来不希望加重服务器的负担，第三是因为这种多级从属关系的数据不太适合放在数据库里。 这是大概的思路： 1、读取xml文件 2、当一个下拉框...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值