Question

我正在使用一个使用querySelectors刮取DOM的Chrome扩展程序。输入到控制台后，以下querySelector会正确返回我想要的值（全名中的姓氏）：

document.querySelector('[data-bind="text: 
PersonName.fullName"]').textContent.slice(document.querySelector('[data- 
bind="text: PersonName.fullName"]').textContent.indexOf(" ")+1)

但是，在扩展程序中，这些querySelector通过API在JSON对象中提供，并且双引号引起JSON解析错误。是否有仅使用单引号编写上述查询选择器的等效方法？还是要以某种方式转义双引号，以使JSON解析时不会出现问题？

如果您想测试一个可能的答案，这是我尝试抓取的HTML元素：

<span data-bind="text: PersonName.fullName">John Smith</span>

为清楚起见-我无法控制HTML页面，它位于最终用户的计算机上。

这是生成的JSON：

{"AtsMapping":[{"ID":"4"},{"atsCode":"ULT1"},{"atsName":"UltiPro"}, 
{"atsMapName":"UltiPro"},{"atsMapNotes":"John Smith (1)"}, 
{"firstName":"document.querySelector('[data-bind="text: 
PersonName.fullName"]').textContent.slice(0,document.querySelector('[data- 
bind="text: PersonName.fullName"]').textContent.indexOf(" "))"}, 
{"lastName":"document.querySelector('[data-bind="text: 
PersonName.fullName"]').textContent.slice(document.querySelector('[data- 
bind="text: PersonName.fullName"]').textContent.indexOf(" ")+1)"}, 
{"emailAddress":"document.querySelector(".email-address").innerText;"}, 
{"jobTitle":"document.querySelector('[data-bind="text: 
OpportunityTitle"]').textContent"},{"location":""},{"locationDefault":""}, 
{"effectiveDate":""},{"effectiveDateDefault":""},{"expirationDate":""}, 
{"expirationDateDefault":""},{"flsaStatus":""},{"flsaStatusDefault":""}, 
{"compGroup":""},{"compGroupDefault":""},{"benefitsGroup":""}, 
{"benefitsGroupDefault":""},{"offerTemplate":""},{"offerTemplateDefault":""}, 
{"confidentialFlag":""},{"confidentialFlagDefault":""}]}

而解析此JSON的错误是：

未捕获的SyntaxError：JSON中位置184处的意外令牌t 在JSON.parse（）在Object。$。get [成功]（inject.js：10390）着火（inject.js：3274）在Object.fireWith [as resolveWith]（inject.js：3404）完成时（inject.js：9311）在XMLHttpRequest。（inject.js：9554）

谢谢！

Answer 1

您应该对字符串进行转义。

请参阅下文，我如何将您的代码转换为字符串并将其添加到json。

当我使用<HOST> - - .mp4时一定要注意

/"/"

在QuerySelector中仅使用单引号

1 个答案: