配合代码再详细解释一下
时间: 2023-11-12 07:23:42 浏览: 32
好的,下面我将结合代码逐行详细解释每一步。
```
function $(param) {
```
定义了一个名为 `$` 的函数,接受一个参数 `param`。
```
var domList = [];
```
定义一个空数组 `domList`,用于存储匹配的DOM节点。
```
if (param.indexOf('#') == 0) {
var id = param.substring(1);
var dom = document.getElementById(id);
domList[0] = dom;
} else if (param.indexOf('.') == 0) {
var name = param.substring(1);
domList = document.getElementsByName(name);
} else {
domList = document.getElementsByTagName(param);
}
```
通过判断参数的首字符来确定匹配的方式,如果参数以 `#` 开头,则使用 `document.getElementById()` 方法获取DOM节点,并将其存储在 `domList` 数组的第一个元素中。如果参数以 `.` 开头,则使用 `document.getElementsByName()` 方法获取DOM节点,并将其存储在 `domList` 数组中。否则,使用 `document.getElementsByTagName()` 方法获取DOM节点,并将其存储在 `domList` 数组中。
```
domList.prop = function () {
if (arguments.length == 1) {
var dom = domList[0];
return dom[arguments[0]];
} else if (arguments.length == 2) {
for (let i = 0; i < domList.length; i++) {
var dom = domList[i];
dom[arguments[0]] = arguments[1];
}
}
}
```
定义了一个 `prop()` 方法,该方法可以设置或获取DOM节点的属性。当 `prop()` 方法接收一个参数时,它将返回第一个DOM节点的指定属性的值。当 `prop()` 方法接收两个参数时,它将设置所有DOM节点的指定属性为指定的值。
```
return domList;
```
返回 `domList` 数组,该数组包含匹配的DOM节点。
综上所述,该函数可以根据参数返回一个或多个匹配的DOM节点,并提供了一个方便的 `prop()` 方法来设置或获取DOM节点的属性。