简体   繁体   English

如何使用 selenium Python 点击动态按钮?

[英]How to click on dynamic button using selenium Python?

I am using Selenium Python and trying to access one of the dynamic created buttons which have same names and no ID.我正在使用 Selenium Python 并尝试访问具有相同名称但没有 ID 的动态创建按钮之一。

By.XPATH and By.CLASS_NAME not working here. By.XPATH 和 By.CLASS_NAME 在这里不起作用。 Any suggestions how can I click on this.任何建议我如何点击这个。 This is the button I want to click这是我要点击的按钮

This is how I am trying这就是我正在尝试的方式

btn=WebDriverWait(driver, 5).until(EC.element_to_be_clickable((By.XPATH, '//*[@id="BsGnbProv"]/div[1]/div[13]/div[2]/div[3]/div[3]/button[2]')))

This is xPath这是 xPath

//*[@id="BsGnbProv"]/div[1]/div[13]/div[2]/div[3]/div[3]/button[2]

This is Button element details这是 Button 元素详细信息

    <button class="w-100 btn btn-light btn-sm mr-1" data-bind="disable: 
          false, click: ViewNetworkFuncModal, visible: $root.IsReadOnly" 
        style="white-space: normal;">
        <span class="mr-1 fa fa-edit">
        </span>
        <span>View Configuration</span>
        </button>

This is the html of this div containing all buttons这是包含所有按钮的此 div 的 html

<div data-bind="visible: GeneralProperties.NfCount() > 0, css: { 'bs-inactive': $root.IsInactive }" data-csv-category="Network Function Properties" class="card m-1 flex-shrink-0 ns-toggle"><div class="card-header"><label>Network Function Properties</label></div>
        <div class="overflow-auto card-body ns-width-md">
            <div class="form-group ns-width-md">
                <div class="col col-12 col-sm-3 col-md-3 col-lg-3 col-xl-3">
                    <label class="d-block text-truncate property-label text-dark" data-placement="top" data-toggle="tooltip" style="text-decoration: underline;" title="" data-original-title="Function Type">Function Type</label>
                </div>
                <div class="col col-12 col-sm-3 col-md-3 col-lg-3 col-xl-3">
                    <label class="d-block text-truncate property-label text-dark" data-placement="top" data-toggle="tooltip" style="text-decoration: underline;" title="" data-original-title="Managed Element ID">Managed Element ID</label>
                </div>
            </div>
            <!-- ko with: GeneralProperties.PuProperties -->
            <!-- ko foreach: NetworkFunctionDetailsList -->
            <div style="min-width: 480px;" class="form-group ">
        <div class="d-inline-flex align-items-center col col-12 col-sm-3 col-md-3 col-lg-3 col-xl-3">
            <label data-bind="text: NfTypeDesc, attr: { title: NfTypeDesc }" data-csv-label="Function Type" class="property-label d-block text-truncate text-dark" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="xPU">xPU</label>
        </div>
        <div class="d-inline-flex align-items-center col col-12 col-sm-3 col-md-3 col-lg-3 col-xl-3">
            <label data-bind="text: Id, attr: { title: Id }" data-csv-label="Managed Element ID" class="property-label d-block text-truncate text-dark" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="EAB8620065F0">EAB8620065F0</label>
        </div>
        <div class="col col-12 col-sm-4 col-md-4 col-lg-4 col-xl-4">
            <button class="w-100 btn btn-light btn-sm mr-1" data-bind="disable: $root.IsReadOnly, click: LoadNetworkFuncModal, visible: !$root.IsReadOnly()" style="white-space: normal; display: none;" disabled="">
                <span class="mr-1 fa fa-edit"></span>
            <span>Edit Configuration</span></button>
            <button class="w-100 btn btn-light btn-sm mr-1" data-bind="disable: false, click: ViewNetworkFuncModal, visible: $root.IsReadOnly" style="white-space: normal;">
                <span class="mr-1 fa fa-edit"></span>
            <span>View Configuration</span></button>
        </div>
    </div>
            <!-- /ko -->
            <!-- /ko -->
            <!-- ko with: GeneralProperties.CuCpProperties -->
            <!-- ko foreach: NetworkFunctionDetailsList -->
            <div style="min-width: 480px;" class="form-group ">
        <div class="d-inline-flex align-items-center col col-12 col-sm-3 col-md-3 col-lg-3 col-xl-3">
            <label data-bind="text: NfTypeDesc, attr: { title: NfTypeDesc }" data-csv-label="Function Type" class="property-label d-block text-truncate text-dark" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="CU-CP">CU-CP</label>
        </div>
        <div class="d-inline-flex align-items-center col col-12 col-sm-3 col-md-3 col-lg-3 col-xl-3">
            <label data-bind="text: Id, attr: { title: Id }" data-csv-label="Managed Element ID" class="property-label d-block text-truncate text-dark" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="CUCP-at2200-eab8620065f0-1">CUCP-at2200-eab8620065f0-1</label>
        </div>
        <div class="col col-12 col-sm-4 col-md-4 col-lg-4 col-xl-4">
            <button class="w-100 btn btn-light btn-sm mr-1" data-bind="disable: $root.IsReadOnly, click: LoadNetworkFuncModal, visible: !$root.IsReadOnly()" style="white-space: normal; display: none;" disabled="">
                <span class="mr-1 fa fa-edit"></span>
            <span>Edit Configuration</span></button>
            <button class="w-100 btn btn-light btn-sm mr-1" data-bind="disable: false, click: ViewNetworkFuncModal, visible: $root.IsReadOnly" style="white-space: normal;">
                <span class="mr-1 fa fa-edit"></span>
            <span>View Configuration</span></button>
        </div>
    </div>
            <!-- /ko -->
            <!-- /ko -->
            <!-- ko with: GeneralProperties.CuUpProperties -->
            <!-- ko foreach: NetworkFunctionDetailsList -->
            <div style="min-width: 480px;" class="form-group ">
        <div class="d-inline-flex align-items-center col col-12 col-sm-3 col-md-3 col-lg-3 col-xl-3">
            <label data-bind="text: NfTypeDesc, attr: { title: NfTypeDesc }" data-csv-label="Function Type" class="property-label d-block text-truncate text-dark" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="CU-UP">CU-UP</label>
        </div>
        <div class="d-inline-flex align-items-center col col-12 col-sm-3 col-md-3 col-lg-3 col-xl-3">
            <label data-bind="text: Id, attr: { title: Id }" data-csv-label="Managed Element ID" class="property-label d-block text-truncate text-dark" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="CUUP-at2200-eab8620065f0-1">CUUP-at2200-eab8620065f0-1</label>
        </div>
        <div class="col col-12 col-sm-4 col-md-4 col-lg-4 col-xl-4">
            <button class="w-100 btn btn-light btn-sm mr-1" data-bind="disable: $root.IsReadOnly, click: LoadNetworkFuncModal, visible: !$root.IsReadOnly()" style="white-space: normal; display: none;" disabled="">
                <span class="mr-1 fa fa-edit"></span>
            <span>Edit Configuration</span></button>
            <button class="w-100 btn btn-light btn-sm mr-1" data-bind="disable: false, click: ViewNetworkFuncModal, visible: $root.IsReadOnly" style="white-space: normal;">
                <span class="mr-1 fa fa-edit"></span>
            <span>View Configuration</span></button>
        </div>
    </div>
            <!-- /ko -->
            <!-- /ko -->
            <!-- ko with: GeneralProperties.DuProperties -->
            <!-- ko foreach: NetworkFunctionDetailsList -->
            <div style="min-width: 480px;" class="form-group ">
        <div class="d-inline-flex align-items-center col col-12 col-sm-3 col-md-3 col-lg-3 col-xl-3">
            <label data-bind="text: NfTypeDesc, attr: { title: NfTypeDesc }" data-csv-label="Function Type" class="property-label d-block text-truncate text-dark" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="DU">DU</label>
        </div>
        <div class="d-inline-flex align-items-center col col-12 col-sm-3 col-md-3 col-lg-3 col-xl-3">
            <label data-bind="text: Id, attr: { title: Id }" data-csv-label="Managed Element ID" class="property-label d-block text-truncate text-dark" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="DU-at2200-eab8620065f0-1">DU-at2200-eab8620065f0-1</label>
        </div>
        <div class="col col-12 col-sm-4 col-md-4 col-lg-4 col-xl-4">
            <button class="w-100 btn btn-light btn-sm mr-1" data-bind="disable: $root.IsReadOnly, click: LoadNetworkFuncModal, visible: !$root.IsReadOnly()" style="white-space: normal; display: none;" disabled="">
                <span class="mr-1 fa fa-edit"></span>
            <span>Edit Configuration</span></button>
            <button class="w-100 btn btn-light btn-sm mr-1" data-bind="disable: false, click: ViewNetworkFuncModal, visible: $root.IsReadOnly" style="white-space: normal;">
                <span class="mr-1 fa fa-edit"></span>
            <span>View Configuration</span></button>
        </div>
    </div>
            <!-- /ko -->
            <!-- /ko -->
            <!-- ko with: GeneralProperties.RuProperties -->
            <!-- ko foreach: NetworkFunctionDetailsList -->
            <div style="min-width: 480px;" class="form-group ">
        <div class="d-inline-flex align-items-center col col-12 col-sm-3 col-md-3 col-lg-3 col-xl-3">
            <label data-bind="text: NfTypeDesc, attr: { title: NfTypeDesc }" data-csv-label="Function Type" class="property-label d-block text-truncate text-dark" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="RU">RU</label>
        </div>
        <div class="d-inline-flex align-items-center col col-12 col-sm-3 col-md-3 col-lg-3 col-xl-3">
            <label data-bind="text: Id, attr: { title: Id }" data-csv-label="Managed Element ID" class="property-label d-block text-truncate text-dark" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="RU-at2200-eab8620065f0-1">RU-at2200-eab8620065f0-1</label>
        </div>
        <div class="col col-12 col-sm-4 col-md-4 col-lg-4 col-xl-4">
            <button class="w-100 btn btn-light btn-sm mr-1" data-bind="disable: $root.IsReadOnly, click: LoadNetworkFuncModal, visible: !$root.IsReadOnly()" style="white-space: normal; display: none;" disabled="">
                <span class="mr-1 fa fa-edit"></span>
            <span>Edit Configuration</span></button>
            <button class="w-100 btn btn-light btn-sm mr-1" data-bind="disable: false, click: ViewNetworkFuncModal, visible: $root.IsReadOnly" style="white-space: normal;">
                <span class="mr-1 fa fa-edit"></span>
            <span>View Configuration</span></button>
        </div>
    </div>
            <!-- /ko -->
            <!-- /ko -->
        </div>
    </div>

@Atif, thanks for the detail HTML. @Atif,感谢您提供详细信息 HTML。 Can you try the following XPath:你能试试下面的XPath:

//button/span[text()='View Configuration']

This will give you the five buttons and then you can take action accordingly.这将为您提供五个按钮,然后您可以采取相应的措施。 I tried this and it is working fine.我试过了,它工作正常。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM