Question

我加载了一个创建表单的外部JS，我想更改其中一个输入的占位符。我尝试在包含表单的div之后编写函数，并通过名称或类来定位输入。也许只是加载的脚本阻止了占位符的更改......

document.getElementsByClassName('squeezer-widget-input-code').placeholder = 'Enter your Code';

<script type="text/javascript" src="https://dl.squeezer.fr/widget"></script>
<div class="squeezer-widget"></div>

Answer 1

您可以使用MutationObserver并监听DOM更改，以便为<FORM>

创建

var MutationObserver = window.MutationObserver;
var list = document.querySelector('.squeezer-widget');

var observer = new MutationObserver(function(mutations) {
  mutations.forEach(function(mutation) {
    if (mutation.type === 'childList') {
      var elem = document.querySelector('.squeezer-widget-input');
      if (elem != null)
        document.querySelector('.squeezer-widget-input').placeholder = 'Enter your Code';     
    }
  });
});

observer.observe(list, {
  attributes: true,
  childList: true,
  characterData: true
});

<script type="text/javascript" src="https://dl.squeezer.fr/widget"></script>
<div class="squeezer-widget"></div>

注意：没有squeezer-widget-input-code选择器的元素，因此使用了squeezer-widget-input

请阅读What do querySelectorAll, getElementsByClassName and other getElementsBy* methods return?

如何更改外部加载的表单的占位符？

1 个答案: