Question

我在页面上有一些HTML，内容如下：

def changeset(struct, params \\ %{}) do
    struct
    |> cast(params, [:email, :first_name, :last_name, :password_hash, :role, :birthdate, :address1, :address2, :city, :state, :zip, :status, :mobile, :card, :sms_code, :status])
    |> validate_required_inclusion([:email , :mobile])
end


def validate_required_inclusion(changeset, fields,  options \\ []) do

end

我正在READY页面中运行一些javascript，我正在创建一个动态超链接，我想插入它，以便在页面呈现最终结果时：

<h3 class="ms-standardheader"><a name="SPBookmark_History"></a>History</h3>

H3的类名存在于多个页面元素上。锚标记的名称SPBookmark_History是唯一的。

如何使用JQuery或直接javascript完成此操作？

谢谢

Answer 1

请按照以下代码：

$(document).ready(function(){
  var link = $('a[name=SPBookmark_History]');
  link.attr('href','https://thissite.com/newurl');
  link.attr('target','_blank');
});

JSFIDDLE SAMPLE

Answer 2

您可以使用：

Attribute Equals Selector [name=”value”]：为了选择元素，因为SPBookmark_History是唯一的
.closest( selector )：获取父h3元素。
.contents()：获取匹配元素集中每个元素的子元素，包括文本和注释节点。
filter-function：仅获取链接后的文字
.wrap()：围绕匹配元素集中的每个元素包装HTML结构。

代码：

＆＃13;

$('a[name="SPBookmark_History"]').closest('h3.ms-standardheader')
.contents().
filter(function (idx, ele) {
  return ele.nodeType == Node.TEXT_NODE
})
.wrap($('<a/>', {href: "https://thissite.com/newurl", target: "_blank"}));

console.log('Result is: ' + document.getElementsByClassName('ms-standardheader')[0].outerHTML);

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>


<h3 class="ms-standardheader"><a name="SPBookmark_History"></a>History</h3>

＆＃13;

使用JQuery在现有文本周围注入锚标记

2 个答案: