在Web开发中，元素的显示顺序对于页面的布局和交互有着重要的影响。在一些交互性的Web应用中，由于需要根据用户的操作动态改变页面布局，因此需要通过JavaScript来控制元素的显示顺序。而要实现这一功能，我们可以使用selectedindex属性。

selectedindex的作用是控制select元素中选定项的索引值。在Web开发中，select元素是一种常见的表单元素，它可以展示选项列表，并允许用户在列表中选择一个选项。而通过selectedindex属性，我们可以控制用户所选择的选项的索引值，从而实现一些动态的页面交互效果。

以下是有关如何使用selectedindex属性来控制网页元素的显示顺序的详细介绍。

一、什么是selectedindex属性？

在学习如何使用selectedindex属性之前，我们需要了解一下selectedindex属性的基本概念。

作为一个属性，selectedindex是用来设置或获取select元素中选定项的索引值。在select元素中，每一个选项都有一个唯一的索引值，这个值是从0开始的。而selectedindex属性则用来指定所选选项在选项列表中的索引值。

例如，对于如下的一个select元素：

```html

第一项

第二项

第三项

第四项

```

我们可以通过如下代码来获取或设置所选项的索引值：

```javascript

// 获取选中选项的索引值

var selectedIndex = document.getElementById("mySelect").selectedIndex;

// 设置选中项的索引值

document.getElementById("mySelect").selectedIndex = 2;

```

在上述代码中，我们首先使用document.getElementById()方法获取了id为"mySelect"的select元素，并使用selectedindex属性来获取或设置所选项的索引值。

二、如何使用selectedindex属性来控制元素的显示顺序？

有了上面的基本概念，我们现在就可以开始了解如何使用selectedindex属性来控制元素的显示顺序了。

对于一个Web页面来说，显示顺序通常是由CSS样式规则决定的。在CSS中，我们可以使用z-index属性来定义元素的显示顺序。z-index属性的值越大，表示该元素越靠上层，越容易显示在其他元素之前。

因此，如果我们想要控制元素的显示顺序，首先需要为每个元素添加z-index属性，并将其设置为合适的值。例如，我们有如下的三个div元素：

```html