使用控制台Chrome在模态上进行反应选择的Javascript选择元素

时间:2019-10-10 16:05:56

标签: javascript reactjs google-chrome console

我有使用ReactJS构建的项目

我尝试使用控制台镶边中的javascript测试我的代码。

我有与此网站https://jedwatson.github.io/react-select/类似的代码

我去点击了按钮 这将打开一个模态,该模态具有反应选择组件。 我要在此选择victoria中选择一个元素。

HTML代码:

    <div class="Select has-value is-clearable is-focused is-open is-searchable Select--single">
    <input type="hidden" name="selected-state" value="new-south-wales">
    <div class="Select-control"><span class="Select-multi-value-wrapper" id="react-select-2--value">
<div class="Select-value State-NSW"><span class="Select-value-label" role="option" aria-selected="true" id="react-select-2--value-item">New South Wales</span></div>
    <div class="Select-input" style="display: inline-block;">
        <input id="state-select" aria-activedescendant="react-select-2--option-1" aria-expanded="true" aria-haspopup="true" aria-owns="react-select-2--list" role="combobox" value="" style="box-sizing: content-box; width: 5px;">
        <div style="position: absolute; top: 0px; left: 0px; visibility: hidden; height: 0px; overflow: scroll; white-space: pre; font-size: 14px; font-family: &quot;Helvetica Neue&quot;, Helvetica, Arial, sans-serif; font-weight: 400; font-style: normal; letter-spacing: normal; text-transform: none;"></div>
    </div>
    </span><span aria-label="Clear value" class="Select-clear-zone" title="Clear value"><span class="Select-clear">×</span></span><span class="Select-arrow-zone"><span class="Select-arrow"></span></span>
</div>
<div class="Select-menu-outer">
    <div class="Select-menu" id="react-select-2--list" role="listbox" tabindex="-1">
        <div class="Select-option State-ACT" role="option" aria-label="Australian Capital Territory" id="react-select-2--option-0">Australian Capital Territory</div>
        <div class="Select-option is-selected is-focused State-NSW" role="option" aria-label="New South Wales" id="react-select-2--option-1">New South Wales</div>
        <div class="Select-option State-Vic" role="option" aria-label="Victoria" id="react-select-2--option-2">Victoria</div>
        <div class="Select-option State-Qld" role="option" aria-label="Queensland" id="react-select-2--option-3">Queensland</div>
        <div class="Select-option State-WA" role="option" aria-label="Western Australia" id="react-select-2--option-4">Western Australia</div>
        <div class="Select-option State-SA" role="option" aria-label="South Australia" id="react-select-2--option-5">South Australia</div>
        <div class="Select-option State-Tas" role="option" aria-label="Tasmania" id="react-select-2--option-6">Tasmania</div>
        <div class="Select-option State-NT" role="option" aria-label="Northern Territory" id="react-select-2--option-7">Northern Territory</div>
    </div>
</div>
</div>

我如何在Chrome控制台中使用javascript选择“维多利亚”?

我尝试过

var country = document.getElementById("react-select-2--list");
country.document.querySelector("div #react-select-2--option-1").value='victoria';

对不起,我是测试中的新手

0 个答案:

没有答案