js获取span标签的样式属性,js获取span标签的内容

本文目录一览：

• 1、在一个JSP页面中使用javascript获得标签里的内容？
• 2、急！怎么用js提取出span标签内style里的属性值
• 3、js怎么获取当前点击的div里面 span里面的值
• 4、js获取HTML中标签中的内容包括
• 5、js 获取标签信息及内容
• 6、怎么利用js取下面的span值，

在一个JSP页面中使用javascript获得标签里的内容？

alert(data.innerHTML);

input 标签有value属性，值是输入框里的内容；

span 标签没有value属性，span内部的内容，用innerHTML属性获得

急！怎么用js提取出span标签内style里的属性值

CSS的样式分为三类： 

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

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

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

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

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

element指JS获取的DOM对象 

element.style //只能获取内嵌样式 

element.currentStyle //IE浏览器获取非内嵌样式 

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

document.defaultView.getComputedStyle(element,伪类)//非IE浏览器获取非内嵌样式 

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

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

!doctype html

html lang=”en”

  head

    meta charset=”UTF-8″

    meta name=”Generator” content=”EditPlus®”

    meta name=”Author” content=”Yvette Lau”

    meta name=”Keywords” content=”关键字”

    meta name=”Description” content=”描述”

    titleDocument/title

    style

      #test{

        width:500px;

        height:300px;

        background-color:#CCC;

        float:left;

      }

    /style

  /head

  body

    div id = “test”/div

    div id = “tag” style = “width:500px; height:300px;background-color:pink;”/div

  /body

/html

script type = “text/javascript”

  window.onload = function(){

    var test = document.getElementById(“test”);

    var tag = document.getElementById(“tag”);

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

    console.log(test.style); //火狐返回空对象CSS2Properties{}，谷歌返回空对象CSSStyleDeclaration{} 

    console.log(tag.style); //返回CSS2Properties{width:”500px”,height:”300px”,background-color:”pink”}

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

    console.log(tag.style.backgroundColor);//pink

    console.log(tag.style[‘background-color’]);//pink

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

    console.log(test.currentStyle) //火狐和谷歌为Undefined,IE返回CSS对象

    console.log(window.getComputedStyle(test,null))//谷歌返回CSSStyleDeclaration{……} ，火狐返回CSS2Properties{……}

    console.log(window.getComputedStyle(test))

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

    console.log(test.currentStyle.width);//500px(IE)

    console.log(window.getComputedStyle(test).width); //500px;

    console.log(window.getComputedStyle(test)[‘width’]);//500px;

    //document.defaultView.getComputedStyle(element,null)[attr]/window.getComputedStyle(element,null)[attr]   

  }

/script

js怎么获取当前点击的div里面 span里面的值

!doctype html

!DOCTYPE html

html

head

title/title

/head

body

li

div class=”vt-el-inner”

div class=”inner-logo”

img src=”../PPIMG/001.jpg”

/div

div class=”inner-title”span1/span马格全屋定制/div

div class=”inner-btn”

div class=”vote-count fl”7899票/div

button class=”vote-send fr” onclick=”asd(this)”投TA一票/button

/div

/div

/li

li

div class=”vt-el-inner”

div class=”inner-logo”

img src=”../PPIMG/002.jpg”

/div

div class=”inner-title”span2/span马格全屋定制/div

div class=”inner-btn”

div class=”vote-count fl”789票/div

button class=”vote-send fr” onclick=”asd(this)”投ta一票/button

/div

/div

/li

script type=”text/javascript” src=”jquery-3.2.1.js”/script

script type=”text/javascript”

function asd(obj){

var ret = $(obj).parent().siblings(“.inner-title”).find(“span”).html();

console.log(ret)

}

/script

/body

/html

需要引入jquery

js获取HTML中标签中的内容包括

span id=”span”

span style=”color: rgb(229, 51, 51);”2132131321/span

/span

var span = document.getElementById(“span”).innerHTML;

jquery:

var span = $(“#span”).html();

扩展资料

pspansome text./spansome other text./p

如果不对 span 应用样式，那么 span 元素中的文本与其他文本不会任何视觉上的差异。尽管如此，上例中的 span 元素仍然为 p 元素增加了额外的结构。

span在行内定义一个区域，也就是一行内可以被span划分成好几个区域，从而实现某种特定效果。span本身没有任何属性，span 标签支持HTML 的全局属性和事件属性。

可以为 span 应用 id 或 class 属性，这样既可以增加适当的语义，又便于对 span 应用样式。可以对同一个 span 元素应用 class 或 id 属性，但是更常见的情况是只应用其中一种。这两者的主要差异是，class 用于元素组（类似的元素，或者可以理解为某一类元素），而 id 用于标识单独的唯一的元素。

参考资料：百度百科 span标签

百度百科 HTML

js 获取标签信息及内容

var el=document.getElementsById(“#ID”);

在里面输入纯文本

el.innerText=”纯文本”

在里面你输入HTML代码

el.innerHTML=”spanHTML代码/span”

修改类名

el.className=”container”

如果元素是img

el.src=””

修改鼠标悬停提示信息

el.title=”这是提示信息”

添加/修改元素属性

el.setAttribute(“disabled”,true)

移除元素属性

el.removeAttribute(“disabled”)

修改元素标签名，先删除元素，再添加

var elParent=el.parentElement;

el.remove()

var newEl=document.createElement(“script”)

newEl.src=””

elParent.appendChild(newEl)

怎么利用js取下面的span值，

最简单且常规的做法就是给需要用js操作的html标签定义一个id

如span id=”category-0″热门/span

如果是用jquery获取span的值，则如下：

var category = $(“#category-0”).html();//category输出结果就是 “热门” 两个字

如果是用js获取span的值，则如下：

var category =document.getElementById(“category-0”).innerHTML;

建议用jquery库来操作，毕竟方便通用