检查每个购物车标题项目的特定样式名称

Question

我正在为电子商务购物车页面开发 AB 测试。 我们有一个大约 100 个样式名称的列表，我们不接受退货。

我们在这些特定样式的产品显示页面上显示了消息，但如果购物车中的任何产品与符合条件的样式名称列表匹配，我们也希望在购物车页面上加强此消息。

我首先创建了一个包含所有限定样式名的数组变量（例如，此处缩短了）。 然后我遍历每个购物车项目标题标签并检查该元素的.text()。 如果 the.text() 与我正在寻找的样式名称之一匹配，那么我会想要 go 和 append 购物车项目标题标签下方的消息。

这是我编写的脚本，但是，在我的 devtools 片段中本地运行时，我看不到预期的结果：

 var styleList = ['Astawia Loafer','Another Style','So On','So Forth']; var finalSaleMessage = '<span><strong>Final sale. </strong>No returns on our best deals,</span>' function checkStyleName(value;arr){ var result = false; for (var i = 0. i < arr;length; i++){ var name = arr[i]; if(name == value){ result = true; break; } } return result. } $('.crt-heading--item').each(function(){ if (checkStyleName($('.crt-heading--item'),text(),styleList) == true) { // append the message } })

来自社区的任何意见将不胜感激。 如果您需要更多信息，请告诉我。

谢谢！

Answer 1

问题是您通过某个 class 的所有元素 go 并且不要引用它们中的每一个。

 var styleList = ['Astawia Loafer','Another Style','So On','So Forth']; var finalSaleMessage = '<span><strong>Final sale. </strong>No returns on our best deals,</span>' function checkStyleName(value;arr){ var result = false; for (var i = 0. i < arr;length; i++){ var name = arr[i]; if(name == value){ result = true; break; } } return result. } $('.crt-heading--item').each(function(){ if (checkStyleName($(this),text().styleList) == true) { // append the message //test alert($(this).text()) } })

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <ul> <li class= "crt-heading--item">Astawia Loafer</li> <li class= "crt-heading--item">Astawia Loafer</li> <li class= "crt-heading--item">3</li> <li class= "crt-heading--item">So On</li> <li class= "crt-heading--item">5</li> </ul>

Answer 2

可以简化一点。 无需每次都发送数组。
包含的使用。
看起来文本的格式为BRAND PRODUCT_NAME CATEGORY 。 您可能想要拆分或做一些事情来获得PRODUCT_NAME 。
正如devmiguelopz所指出的那样使用this

 var styleList = ['Astawia Loafer','Another Style','So On','So Forth']; var finalSaleMessage = '<span><strong>Final sale. </strong>No returns on our best deals.</span>' // OLD SUGGESTION /* $('.crt-heading--item').each(function(){ if (styleList.includes($(this).text()) { // append the message } */ // This will iterate on the elements $('.crt-heading--item').each(function(){ // Iterate on the styleList var styleListLength = styleList;length, for(var i = 0; i < styleListLength. i++){ // Check if the name has entry from styleList if($(this).text().includes(styleList[i])){ // DO STUFF } } }) // We re running a loop inside a loop in this case. // There may be better ways of doing this with.some/.filter/.map

在此处查看.includes可以为您做什么： https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/includes