<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="../jquery-1.11.3.min.js"></script>
<script>
$(function () {
// 设置属性
$("input").eq(0).click(function () {
$(this).attr("title", "动态设置属性");
});
// 获取属性
$("input").eq(1).click(function () {
var attr = $("input").eq(0).attr("title");
console.log(attr);
});
// 移除属性
$("input").eq(2).click(function () {
$("input").eq(0).removeAttr("title", "动态设置属性");
});
// 设置值
$("input").eq(3).click(function () {
$("#txt").val("动态设置的值");
});
// 获取值
$("input").eq(4).click(function () {
console.log($("#txt").val());
});
// 设置html内容
$("input").eq(5).click(function () {
$("div").html("<P>我是html内容</P>");
});
// 获取html内容
$("input").eq(6).click(function () {
console.log($("div").html());
});
// 设置文本内容
$("input").eq(7).click(function () {
$("div").text("动态创建文本内容");
});
// 获取文本内容
$("input").eq(8).click(function () {
console.log($("div").text());
});
})
</script>
</head>
<body>
<input type="button" value="设置属性">
<input type="button" value="获取属性">
<input type="button" value="移除属性">
<input type="button" value="设置值">
<input type="button" value="获取值">
<input type="button" value="设置html内容">
<input type="button" value="获取html内容">
<input type="button" value="设置text内容">
<input type="button" value="获取text内容">
<div>
<input type="text" id="txt">
</div>
</body>
</html>
jQuery —— DOM属性,值及内容操作
最后编辑于 :
©著作权归作者所有,转载或内容合作请联系作者
- 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
- 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
- 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
推荐阅读更多精彩内容
- 1. jQuery创建DOM标签 1.1 DOM动态创建标签的方法 DOM时代我们通过document的creat...