我不知道如何在 Javascript 工具包框架中处理 select HTML Class 属性

Question

我在 Javascript 中使用名为 Xel 工具包的 Electron 框架，我从 main.js:

document.querySelector("menu.selected").className.remove('selected')

有一些 Xel 代码，其中 selected 是纯 HTML Class:

<x-tab selected class="menu">

你知道，像这样不输入 a Class="name" 是一种不好的做法。但我不知道如何捕捉 selected 当前值。检查控制台：

Uncaught TypeError: Cannot read property 'className' of null

Answer 1

在您的示例中 selected 在该上下文中不是 "pure HTML Class"。这是一个等同于 HTML5 中的 selected="true" 的属性。如果您想使用 querySelector 来查找该元素并使用 Javascript 删除 selected 属性，您需要这样的东西：

document.querySelector("menu[selected]").selected = false;

Answer 2

我不确定您到底想在这里完成什么，但我认为这可能会有所帮助。我向您展示的以下代码示例将获取基于 className 的 checked 属性，我认为这是您最终要求的...

ClickToSeeJsBin

https://jsbin.com/kahona/edit?html,output

    function validate() {
    var CurrentSelected = [];
    //Doing the same thing for checkBox selection
    var GetAllCheckBoxNodes = document.getElementsByClassName("someCheckBox");
    var InputNodesSize = GetAllCheckBoxNodes.length;
    for (var i = 0; i < InputNodesSize; i++) {
        var CurrentCheckBox = GetAllCheckBoxNodes[i];
        if (CurrentCheckBox.checked) {
            CurrentSelected.push(CurrentCheckBox.value);
        }
    }
    //Doing the same thing for radio selection
    var GetAllRadioNodes = document.getElementsByClassName("someRadio");
    var GetAllRadioNodesLength = GetAllRadioNodes.length;
    for (var i = 0; i < GetAllRadioNodesLength; i++) {
        var CurrentRadioNode = GetAllRadioNodes[i];
        if (CurrentRadioNode.checked) {
            CurrentSelected.push(CurrentRadioNode.value);
        }
    }
    //Displaying what is Selected...
    CurrentSelected.forEach(item => { console.log(item); });
}

我不知道如何在 Javascript 工具包框架中处理 select HTML Class 属性

I don´t know how select HTML Class attribute handled in Javascript toolkit Framework

html

javascript

css

javascript-framework

electron