gpt4 book ai didi

javascript - 如何发送不同的 ID 作为 JS 函数的参数?

转载 作者:行者123 更新时间:2023-12-03 11:25:09 25 4
gpt4 key购买 nike

我正在尝试将 id 发送到函数,但我不知道该怎么做。我有一个这样的功能

    function showHide(item) {
if (document.getElementById('item.id').style.display=='none') {
document.getElementBydId('item.id').style.display = '';
}
else {
document.getElementById('item.id').style.display = 'none';
}
}

我的 HTML 像这样

    <div onclick="showHide(one);">
<img src="images/1.png">
</div>
<div id="one" style="display:none">
<h1>X List</h1>
<ul>
<li>Elmt 1</li>
<li>Elmt 2</li>
<li>Elmt 3</li>
<li>Elmt 4</li>
</ul>
</div>

但是,我有更多具有不同 id 的 div,所以我不想为每个 id 创建更多函数。如何将“一、二、三……”id 发送到另一个 onclick div?

最佳答案

html:

<html>
<head>
<meta charset="utf-8">
<title>JS Bin</title>
</head>
<body>
<div class="visibility" id="one">
<img src="images/1.png">
</div>
<div id="match-one">
<h1>X List</h1>
<ul>
<li>Elmt 1</li>
<li>Elmt 2</li>
<li>Elmt 3</li>
<li>Elmt 4</li>
</ul>
</div>
</body>
</html>

JavaScript:

(function () {
var hasClass = function (ele, cls) {
return ele.className.match(new RegExp('(\\s|^)' + cls + '(\\s|$)'));
},
removeClass = function (ele, cls) {
var reg = new RegExp('(\\s|^)' + cls + '(\\s|$)');
ele.className = ele.className.replace(reg, ' ');
},
showHide = function (item) {
var element = document.getElementById('match-' + this.id);
if(hasClass(element, 'hide')) {
removeClass(element, 'hide');
} else {
element.className = element.className + 'hide';
}
},
cell = document.querySelectorAll('.visibility'),
i;
for(i = cell.length - 1; i >= 0; i--) {
cell[i].addEventListener('click', showHide, false);
}
}());

CSS:

.hide {
display: none;
}

我选择这个解决方案是因为它具有很强的可扩展性并且不会覆盖 css

关于javascript - 如何发送不同的 ID 作为 JS 函数的参数?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26950412/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com