js 获取 html标签_框架

1、新建一个html文件，命名为testhtml。

2、在testhtml文件内，创建一个div模块，并设置其id属性为mydiv，用于下面使用js获得标签对象。

3、在testhtml文件内，在div标签内，填写一段文字，并加入一个span标签。

4、在testhtml文件内，创建一个button按钮，按钮名称为“获取html”。

5、给button绑定onclick点击事件，当按钮被点击时，执行myfun()函数。

6、在testhtml文件内，在js标签内，创建myfun（）函数，在函数内，使用getElementById（）方法获得div对象，通过innerHMTL属性获得div内的html内容，最后，使用alert方法将获得的html内容以d窗形式显示

7、在浏览器打开testhtml文件，点击按钮，查看获得的html标签内容。

第一种方法：输出html

1、<body onload="s()">

2、<span id="hello"></span>

3、<script language="javascript">

4、function s()

5、{documentgetElementById("hello")innerHTML = "<iframe src= height=400 width=300></iframe>";}

6、</script>

第二种方法：输出文本

1、<body onload="s()">

2、<span id="hello"></span>

3、<script language="javascript">

4、function s()

5、{documentgetElementById("hello")innerText = "hello world";}

6、</script>

在页面加载完成后通过jquery给多个span赋值

扩展资料

JavaScript一种直译式脚本语言，是一种动态类型、弱类型、基于原型的语言，内置支持类型。它的解释器被称为JavaScript引擎，为浏览器的一部分，广泛用于客户端的脚本语言，最早是在HTML（标准通用标记语言下的一个应用）网页上使用，用来给HTML网页增加动态功能。

Javascript脚本语言同其他语言一样，有它自身的基本数据类型，表达式和算术运算符及程序的基本程序框架。Javascript提供了四种基本的数据类型和两种特殊数据类型用来处理数据和文字。而变量提供存放信息的地方，表达式则可以完成较复杂的信息处理。

参考资料：

百度百科-javascript

var li=documentgetElementsByTagName("li");

for(var i=0;i<lilength;i++){

documentwrite("第"+(i+1)+"个li<br>");

var span=li[i]getElementsByTagName("span");

for(var j=0;j<spanlength;j++){

documentwrite("第"+(j+1)+"个span："+span[j]+"<br>");

}

不知道楼主是要获得span里的什么东西, 你的span里是一个<a>标签元素啊

不知道是不是这个意思

var span = $('#like_5920');

alert($(span)find('a')text());

输出: 喜欢(1)

可以用两种方法第一个用jquery 获取div 可以查看帮助文档

js 获取 var width=documentgetElementById("div")stylewidth获得宽度

这个肯定是一起变化的。

<!DOCTYPE html>

<head>

<title>Document</title>

<style>

#aa{width:400px;}

#bb{width:100%;}

</style>

</head>

<body>

<div id="bb">#aa的宽为<span id="aaw">400</span><br>#bb的宽为<span id="bbw">0</span></div>

</div>

</body>

CSS的样式分为三类：

内嵌样式：是写在Tag里面的，内嵌样式只对所有的Tag有效。

内部样式：是写在HTML的里面的，内部样式只对所在的网页有效。

外部样式表：如果很多网页需要用到同样的样式(Styles)，将样式(Styles)写在一个以css为后缀的CSS文件里，然后在每个需要用到这些样式(Styles)的网页里引用这个CSS文件。

getComputedStyle是一个可以获取当前元素所有最终使用的CSS属性值。返回的是一个CSS样式对象([object CSSStyleDeclaration])

currentStyle是IE浏览器的一个属性，返回的是CSS样式对象

element指JS获取的DOM对象

elementstyle //只能获取内嵌样式

elementcurrentStyle //IE浏览器获取非内嵌样式

windowgetComputedStyle(element,伪类) //非IE浏览器获取非内嵌样式

documentdefaultViewgetComputedStyle(element,伪类)//非IE浏览器获取非内嵌样式

注：Gecko 20 (Firefox 4 / Thunderbird 33 / SeaMonkey 21) 之前，第二个参数“伪类”是必需的（如果不是伪类，设置为null），现在可以省略这个参数。

下面的html中包含两种css样式，id为tag的div是内嵌样式，而id为test的div样式为内部样式

<!doctype html>

<head>

<title>Document</title>

<style>

#test{

width:500px;

height:300px;

background-color:#CCC;

float:left;

}

</style>

</head>

<body>

</body>

</html><script type = "text/javascript">

windowonload = function(){

var test = documentgetElementById("test");

var tag = documentgetElementById("tag");

//CSS样式对象:CSS2Properties{},CSSStyleDeclaration

consolelog(teststyle); //火狐返回空对象CSS2Properties{}，谷歌返回空对象CSSStyleDeclaration{}

consolelog(tagstyle); //返回CSS2Properties{width:"500px",height:"300px",background-color:"pink"}

//elementstyle获取的是内嵌式的style，如果不是内嵌式，则是一个空对象

consolelog(tagstylebackgroundColor);//pink

consolelog(tagstyle['background-color']);//pink

//获取类似background-color,border-radius,padding-left类似样式的两种写法啊

consolelog(testcurrentStyle) //火狐和谷歌为Undefined,IE返回CSS对象

consolelog(windowgetComputedStyle(test,null))//谷歌返回CSSStyleDeclaration{……} ，火狐返回CSS2Properties{……}

consolelog(windowgetComputedStyle(test))

//效果同上,但是在Gecko 20 (Firefox 4/Thunderbird 33/SeaMonkey 21) 之前,第二个参数“伪类”是必需的(如果不是伪类,设置为null)

consolelog(testcurrentStylewidth);//500px(IE)

consolelog(windowgetComputedStyle(test)width); //500px;

consolelog(windowgetComputedStyle(test)['width']);//500px;

//documentdefaultViewgetComputedStyle(element,null)[attr]/windowgetComputedStyle(element,null)[attr]

}

</script>

以上就是关于js 获取 html标签全部的内容，包括:js 获取 html标签、在js中, 怎么往span标签里放值进去、javascript,如何快速获取li下的span等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！

欢迎分享，转载请注明来源：内存溢出

原文地址: https://outofmemory.cn/web/9443825.html

js 获取 html标签

发表评论

评论列表（0条）