根据屏幕宽度，通过Javascript运行2段不同的代码（动态）？

我有两套javascript代码。一个用于普通（桌面视图），另一个用于移动设备（以及低于500px的任何设备）

这是一段用于普通（桌面视图）的javascript：

这是我为移动设备准备的javascript：

var sliderProductNames = [
{foreach $products as $product}
    "{$product.name|replace:'Brandname ':''}",
{/foreach}
];

正如你所看到的，我在这里试图实现的是，它删除了移动设备的一部分文本。因此，这将使事情看起来不那么“杂乱”

是否可以运行第一段javascript，除非调整窗口大小或使用移动设备访问窗口（例如宽度小于480px的任何东西）

javascript可以动态地改变这一点吗（如在调整窗口大小时）

它来自使用Smarty模板的WHMCS，但是我可以通过javascript检测根据屏幕宽度运行这两段代码吗

---

提前感谢您。

使用jQuery，您可以

var sliderProductNames=''；
$（窗口）。调整大小（函数（）{
如果（$（窗口）.width（）>640）{
sliderProductNames='[{foreach$products as$product}{$product.name |替换：\'Brandname\'：\'“\'”}，{/foreach}]；
}否则{
sliderProductNames='[{foreach$products as$product}{$product.name}，{/foreach}]'；
}
$（'#txtarea'）。追加（sliderProductNames+“
”）；
});
您可以不使用jQuery来完成这项工作，请查看

如果您需要在调整屏幕大小时做出反应，请不要忘记检查
，我不知道这是什么，但它不是JavaScript。@MadaraUchiha它看起来像Moustach，一种模板语言-我想它最终将输出可运行的html/JS。然而，这似乎不是一个很好的解决方案。我会将这两个数据列分开，并使用CSS来显示或隐藏某些位，这将在运行中发生，而无需担心。如果允许
http://jsfiddle.net/jaredwilli/SfJ8c/
抱歉，无法使用AngularJS:（如果使用它，我会得到一个空白页？显然它不工作，或者我做错了什么。：（您正在运行代码段吗？使用完整页并调整窗口大小。）
var sliderProductNames = [
{foreach $products as $product}
    "{$product.name|replace:'Brandname ':''}",
{/foreach}
];

if (window.matchMedia("(min-width: 400px)").matches) {
    /* the viewport is at least 400 pixels wide */
} else {
   /* the viewport is less than 400 pixels wide */
}