Meta content 属性
JavaScript基础 2022-06-08 17:04:18小码哥的IT人生shichen
Meta content 属性
定义和用法
content 属性设置或返回 meta 元素的 content 属性的值。
<meta> content 属性 规定元信息的内容。
注释：此属性的可用值取决于 name 和 http-equiv 属性的值。
另请参阅：
HTML 参考手册：HTML <meta> 标签
实例
例子 1
返回所有 meta 元素的内容属性值：
var x = document.getElementsByTagName("META");
var txt = "";
var i;
for (i = 0; i < x.length; i++) {
txt = txt + "Content of "+(i+1)+". meta tag: "+x[i].content+"<br>";
}
完整实例：
<!DOCTYPE html>
<html>
<body>
<head>
<meta name="description" content="免费的 Web 教程">
<meta name="keywords" content="HTML5,CSS,JavaScript">
<meta name="author" content="Bill Gates">
</head>
<p>点击按钮可返回所有 meta 元素的 content 属性的值。</p>
<button onclick="myFunction()">试一试</button>
<p id="demo"></p>
<script>
function myFunction() {
var x = document.getElementsByTagName("META");
var txt = "";
var i;
for (i = 0; i < x.length; i++) {
txt = txt + (i+1) + ". meta 标签的" + "内容：" + x[i].content + "<br>";
}
document.getElementById("demo").innerHTML = txt;
}
</script>
</body>
</html>
可以使用本站在线JavaScript测试工具测试上述代码运行效果：http://www.phpcodeweb.com/runjs.html
例子 2
更改 head 中第三个 meta 元素（index 2）的 content 属性的值：
document.getElementsByTagName("META")[2].content = "Steve Jobs";
完整实例：
<!DOCTYPE html>
<html>
<body>
<head>
<meta name="description" content="免费的 Web 教程">
<meta name="keywords" content="HTML5,CSS,JavaScript">
<meta name="author" content="Bill Gates">
</head>
<p>单击该按钮可更改 head 中第三个 meta 元素（索引 2）的 content 属性的值。</p>
<button onclick="myFunction()">试一试</button>
<p id="demo"></p>
<script>
function myFunction() {
document.getElementsByTagName("META")[2].content = "Steve Jobs";
document.getElementById("demo").innerHTML = "元名称“author”中的内容从“Bill Gates”更改为“Steve Jobs”。";
}
</script>
</body>
</html>
可以使用本站在线JavaScript测试工具测试上述代码运行效果：http://www.phpcodeweb.com/runjs.html
语法
返回 content 属性：
metaObject.content
设置 content 属性：
metaObject.content = text
属性值
| 值 | 描述 |
|---|---|
| text | 元信息的内容。 |
技术细节
| 返回值： | 字符串，meta 元素的 content 属性 的值。 |
|---|
浏览器支持
| Chrome | Edge | Firefox | Safari | Opera |
|---|---|---|---|---|
| Chrome | Edge | Firefox | Safari | Opera |
| 支持 | 支持 | 支持 | 支持 | 支持 |
相关页面
HTML 参考手册：HTML <meta> content 属性
