js如何改变html元素的值

JavaScript09

js如何改变html元素的值,第1张

js改变html的元素的值，首先需要理解的就是Js的选取对象的方法，一般都是通过class或者是id直接去来获取，然后在确定好，你要改变的值，如宽度，高度，背景等等这些属性，也可以通过改变来实现动画的效果，具体看下代码：

<html>

<head>

<style>

#round{

width:300px

height:200px

}

</style>

</head>

<script>

var oDiv = document.getElementById('round')

oDiv.style.width = 400px //通过js改变这个div的宽度

</script>

<body>

<div id='round'>

<p>我是测试文字</p>

</div>

</body>

</html>

一种方式是 jquery 动态生成的标签 改为

JavaScript code?

1

<a id="id1" href="#" onclick="changeHtml()return false" >打开</a>

js 代码是：

JavaScript code?

1

2

3

function changeHtml(){

$("#id1").html("关闭")

}

第二种方法是：

JavaScript code?

1

2

3

$("#id1").live("click", function () {

$(this).html("关闭")

})

jquery1.6版本以上才行；

还有一种方法就是 在动态生成标签之后，绑定方法即可；

JavaScript code?

1

2

3

4

5

//生成标签......

$("#id1").click(function () {

$(this).html("关闭")

})

angular框架继承了jQuery，可以使用JQuery方式修改，如$('div').attribute('data-key', 'new-value')

另一种办法就是使用动态数据咯，如<div data-key="{parameterName}">，当parameterName的值改变时data-key属性自动就更新了，例$scope.parameterName='new value'