CSS选择器属性未选择

Question

如何使用CSS选择器选择"meta property="og:title""

<meta property="og:type" content="article" />
<meta property="og:title" content="How Computers Got to Where They are" />
<meta property="og:description" content="In the late 1950s, Goyeman forever changed the theory of computing when he discovered atoms interacting subparts of dinucleau particles to lead to an incredible journey." />
<meta property="og:url" content="https://www.voltamagazine.org/how-goyeman-revolutionized-computing-21380521/" />
<meta property="og:site_name" content="Volta Magazine" />
<meta property="og:image" content="https://y2655xcwy6xx58.cloudfront.net/uploads/2016/01/Goyeman_1200x630-Social02.jpg" />
<meta property="og:image:width" content="1200" />

Answer 1

使用属性选择器[]应该可以做到这一点。． 查看参考

document.querySelector("meta[property='og:title']")
//for grabbing the attribute value
const title = document.querySelector("meta[property='og:title']").content

---

添加通配符赋予选择器权限。

1. 选择属性start from 'og'

document.querySelectorAll("meta[property^='og']")

2. 以og结尾

document.querySelectorAll("meta[property$='og']")

3. 包含'og'

document.querySelectorAll("meta[property*='og']")