本文目录一览：
- 1、js怎么动态控制div的class？
- 2、js 如何控制class？
- 3、javascript如何控制input的checked属性
- 4、怎么通过js 改变display
- 5、JS 如何控制DIV中内容
js怎么动态控制div的class？
先获取到li标签集合，再遍历该集合把每个className加上去：
script type=”text/javascript”
var li = document.getElementsByTagName(‘li’);
for(var i = 0;ili.length;i++){
li[i].className = i+1;
}
/script
js 如何控制class？
script type=”text/javascript”
window.onload = function() {
var abcs = document.getElementsByClassName(“abc”);
for(var i = 0; i abcs.length; i++) {
abcs[i].style.width = “50%”;
}
};
/script
注意：上面的代码不支持 IE 6/7，因为 IE 6/7 不支持 getElementsByClassName。
下面的代码支持 IE 6/7，使用 getElementsByTagName 查找 div，再查找 abc
script type=”text/javascript”
window.onload = function() {
var divs = document.getElementsByTagName(“div”);
for(var i = 0; i divs.length; i++) {
var classes = divs[i].className.split(” “);
for(var a = 0; a classes.length; a++) {
if(classes[a] === “abc”) {
divs[i].style.width = “50%”;
break;
}
}
}
};
/script
javascript如何控制input的checked属性
input type=”radio” name=”a” value=”1″ /
input type=”radio” name=”a” value=”2″ /
input type=”radio” name=”a” value=”3″ /
script type=”text/javascript”
var radiovar = document.getElementsByName(“a”);
for(var i=0;iradiovar.length;i++)
{
if(radiovar[i].value==2)//这个2即为你所要找的input的值
radiovar[i].checked = “checked”;
}
//或者用jquery
//$(“input[type=’radio’][value=2]”).attr(“checked”,”checked” );
/script
怎么通过js 改变display
1、打开hbuilder软件，新建一个空白的html文件，输入基本的html结构，这里设置一个button按钮用来显示隐藏div，并且给按钮一个id，命名为show。同样也给div一个id，命名为hide：
2、在下方编写js代码，首先给获取button的dom元素，并给其一个click事件，然后获取div的dom，修改disply的属性为block，即让隐藏的div显示出来：
3、按下crtl+S保存，在浏览器里观察效果：
4、点击显示隐藏的按钮，隐藏的div就出现了。以上就是用js控制display属性的过程：
JS 如何控制DIV中内容
思路：先获取div对象，然后用innerHTML属性设置内容。当div用id属性标识时，可以直接用document.getElementById()获取；当div是用其他属性（如name，class）标识，就需要使用document.getElementsByTagName()获取对象，然后循环判断属性进行筛选。
下面实例演示根据div的class设置div的内容：
1、HTML结构
div class=”test”/div
input type=”text” id=”test”/input type=’button’ value=’发送’ onclick=”fun()”/
2、javascript代码
function fun(){
var str = document.getElementById(“test”).value;
var divs = document.getElementsByTagName(“div”);
for(i=0;idivs.length;i++){
if(divs[i].className == “test”){
divs[i].innerHTML += “br” +str;
}
}
}
3、效果演示
原创文章，作者：YYRS，如若转载，请注明出处：https://www.506064.com/n/144317.html
微信扫一扫 
支付宝扫一扫 