Javascript 在页面加载时修改MDL元素

我试图在加载页面时设置滑块的值。为mdl滑块设置值的建议方法如下-

document.querySelector('#slider').MaterialSlider.change(value);

但是，如果从

$（document.ready（）

或

$（window.load（））调用，则会抛出一个错误
TypeError:document.querySelector（…）。MaterialSlider未定义

设置一秒钟的超时时间可以解决这个问题，但似乎有点不妥。
是否有其他活动我可以将其与之联系起来以确保其正常工作

这就是我加载scripsts的方式--

根据您的错误消息，我确实同意@e666正在下降的问题行。要检查的其他事项是相对于其他脚本加载MDL的位置

此外，如果你在服务器上动态构建HTML页面，你可以考虑的是直接在DOM中设置滑块的值。
例如，滑块的HTML如下所示：
<p style="width:300px">
  <input class="mdl-slider mdl-js-slider" type="range" id="s1" min="0" max="10" value="4" step="2">
</p>

但是，如果您的JavaScript加载有问题，我建议您在继续之前确保所有内容都正确加载，因为这可能会影响您以后的工作。
滑块和JavaScript代码的顺序是什么？
如果先调用函数，然后创建滑块，函数将找不到它。这可能就是它未定义的原因。
这也是为什么它在等待一秒钟后工作的原因。在这一秒钟内，页面已完全加载，可以找到滑块

如果先创建滑块，然后对其进行更改，则可以对其进行操作。
您可以在滑块后使用代码块来执行此操作，其中调用了更改滑块值的函数。
我花了几个月的时间，但我终于找到了解决方案。只是需要加上这个--

$（文档）.ready（函数（）{
componentHandler.upgradeAllRegistered（）；
//---在这里做有关mdl元素的事情---
});

这样做的另一个好处是在mdl组件完全加载之前隐藏其丑陋版本。
是否异步加载mdl？否，滑块是html文件的一部分。如何加载库？是否执行此操作？
？如果没有延迟位，则不执行。如果可以，请编辑您的问题并显示JavaScript在代码中的加载位置以及加载方式。目前还没有足够的信息。谢谢我已经在HTML中设置了一个值，但它需要根据用户的位置进行更改。我还尝试更改脚本加载的顺序。没什么区别。现在，我已经求助于非标准方式（在滑块上调用.val（））来设置值，这会导致css的小问题，但我还没有找到其他方式。
<p style="width:300px">
  <input class="mdl-slider mdl-js-slider" type="range" id="s1" min="0" max="10" value="4" step="2">
</p>

@model MyModel

<div>
  <p style="width:300px">
    <input class="mdl-slider mdl-js-slider" type="range" id="s1" min="0" max="10" value="@Model.InitialValue" step="2">
  </p>
</div>