Question

我正在尝试让这个codepen代码在本地运行：

但是，当我尝试将js作为外部脚本加载时，它不起作用：

<!DOCTYPE html>
<html lang = "en">

<script src="isotope.pkgd.js"></script>
<script src="jquery.min.js"></script>
<script src="isotopes.js"></script>

但如果我将文件复制粘贴到标记中：

<!DOCTYPE html>
<html lang = "en">

<script src="jquery.min.js"></script>
<script src="isotope.pkgd.js"></script>
<script>
$( function() {
  // quick search regex
  var qsRegex;
  var buttonFilter;

  // init Isotope
  var $container = $('.isotope').isotope({
    itemSelector: '.element-item',
    layoutMode: 'fitRows',
    filter: function() {
      var $this = $(this);
      var searchResult = qsRegex ? $this.text().match( qsRegex ) : true;
      var buttonResult = buttonFilter ? $this.is( buttonFilter ) : true;
      return searchResult && buttonResult;
    }
  });

  $('#filters').on( 'click', 'button', function() {
    buttonFilter = $( this ).attr('data-filter');
    $container.isotope();
  });

  // use value of search field to filter
  var $quicksearch = $('#quicksearch').keyup( debounce( function() {
    qsRegex = new RegExp( $quicksearch.val(), 'gi' );
    $container.isotope();
  }) );


    // change is-checked class on buttons
  $('.button-group').each( function( i, buttonGroup ) {
    var $buttonGroup = $( buttonGroup );
    $buttonGroup.on( 'click', 'button', function() {
      $buttonGroup.find('.is-checked').removeClass('is-checked');
      $( this ).addClass('is-checked');
    });
  });


});

// debounce so filtering doesn't happen every millisecond
function debounce( fn, threshold ) {
  var timeout;
  return function debounced() {
    if ( timeout ) {
      clearTimeout( timeout );
    }
    function delayed() {
      fn();
      timeout = null;
    }
    setTimeout( delayed, threshold || 100 );
  };
}
</script>

<link rel = "stylesheet" type= "text/css"  href = "style.css">

<h1>Isotope - filtering with search field and button filters</h1>...

然后它确实有效。有人可以解释如何加载外部js文件吗？

Answer 1

HTML 4.01中需要type属性（来源：http://www.w3schools.com/tags/tag_script.asp）。

<script type="text/javascript" src="file.js"></script>

外部js没有加载

1 个答案: