value & setAttribute & innerHTML
2016-11-12 本文已影响0人
xiaolin_188
<!DOCTYPE html>
<html lang="cn">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="http://cdn.bootcss.com/jquery/3.1.1/jquery.min.js"></script>
</head>
<body>
<input type="text" name="username" id="username" value="" data=""/>
<div id="content"></div>
<input type="button" value="点击-js" onclick="btn();">
<input type="button" value="点击-jQuery" id="btn">
<script>
function btn() {
//设置input值
document.getElementById('username').value = 'xiaolin_188';
//获取input值
var username = document.getElementById('username').value;
alert(username);
//设置html内容
document.getElementById('content').innerHTML = '<p>内容</p>';
//获取html内容
var content_html = document.getElementById('content').innerHTML;
alert(content_html);
//获取text内容
var content_text = document.getElementById('content').innerText;
alert(content_text);
//设置text内容
document.getElementById('content').innerText = '内容1';
//设置属性值
document.getElementById('username').setAttribute('data', '123456');
//获取属性值
var data = document.getElementById('username').getAttribute('data');
alert(data);
}
$('#btn').click(function() {
//设置input值
$('#username').val('xiaolin_188');
//获取input值
var username = $('#username').val();
alert(username);
//设置html内容
$('#content').html('<p>内容</p>');
//获取html内容
var content_html = $('#content').html();
alert(content_html);
//获取text内容
var content_text = $('#content').text();
alert(content_text);
//设置text内容
$('#content').text('内容1');
//设置属性值
$('#username').attr('data', '123456');
//获取属性值
var data = $('#username').attr('data');
alert(data);
});
</script>
</body>
</html>
