Question

这确实是一个非常奇怪的问题，我希望它很简单。我无法在我的html文档中进行简单的选择并附加工作，但是当我在Chrome浏览器控制台中时它可以正常工作。

<html>
<head>
<script src="https://code.jquery.com/jquery-1.12.3.min.js" integrity="sha256-aaODHAgvwQW1bFOGXMeX+pC4PZIPsvn2h1sArYOhgXQ="   crossorigin="anonymous"></script>
<script src="/js/script.js"></script>
<script>
$('[data-js="works"]').append("hello");
</script>
</head>
<body>
<div data-js="works"></div>
test

</body>
</html>

当我将这行脚本放在控制台中时，hello出现在测试之上。当我打开页面时，测试就在那里。我之前正在从这个页面运行一个脚本，当我尝试选择一个它没有用的元素时。然后我去了内联脚本，看它是否会在那里工作，不。我已经看过它是否在没有导入脚本的内联脚本中工作，也没有。控制台没有错误信息。如果需要，我可以从该内联脚本打印到我的控制台，但此代码仍然无法正常运行。

不能与我的本地httpserver一起使用，并且不像本地打开的文件一样工作。

Answer 1

这是因为脚本在页面加载之前执行，因此目标div还不存在。

解决方案是在执行某些操作之前等待页面完全加载。 $函数可用于此目的。给它一个回调，它将在页面加载后执行。

您也可以使用不需要window.addEventListener("load", callback);的{{1}}。

＆＃13;

jQuery

＆＃13;

另一种解决方案是在页面末尾插入脚本。虽然在我看来并不是那么整洁。

＆＃13;

<html>
  <head>
    <script src="https://code.jquery.com/jquery-1.12.3.min.js" integrity="sha256-aaODHAgvwQW1bFOGXMeX+pC4PZIPsvn2h1sArYOhgXQ="   crossorigin="anonymous"></script>
    <script>
      $(function(){
        $('[data-js=works]').append("hello");
      });
    </script>
  </head>
  <body>
    <div data-js="works"></div>
    test

  </body>
</html>

＆＃13;

Answer 2

尝试以下操作，希望它能解决您的问题

<input name="base_amount" id="form_base_amount_input_hidden" value="383.852" type="hidden">

要么将.js文件放在正文的末尾，要么将JS代码放在(function($) { // This will solve namespace problem (if any) // Write your JQuery code here })(jQuery);

之间

jQuery选择器不在脚本中工作但在控制台中工作

2 个答案: